How To Change The Order Of Blogs On Tumblr

Hi everyone,

I am trying to reverse the order of Tumblr posts by date. BY default Tumblr presents the most recent post at the top of the page. I would like to present the oldest post at the top and so on in that order, with the newest post at the bottom. I am new in using jQuery. I am still understanding the DOM. I saw one solution by jakecigar here to randomize Tumblr posts. But with all honesty to come up with something like that is beyond my jQuery skills yet. Copy and paste will be easy. Besides, I need to sort them by date from the oldest at the top to the newest at the bottom. Here is the Tumblr page. Big thanks to anyone who can help or provide any advice.

Replies(9)

Do you have dates for each post? Or are they already in the reverse order of what you want?

JΛ̊KE

Thank you Jake for your prompt reply,

Dates are now showing in the default order by date. They are not reversed yet. Currently the newest post (dated Nov 14th) is showing at the top of the page and the oldest (dated Nov 9) at the bottom. I would like this to be reversed by showing the oldest post at the top and the newest at the bottom.

Actually I copied and pasted your solution for randomizing Tumblr posts and it worked perfectly. But that's not the outcome I am looking for here.

Thank you in advanced for your help and advice.

Do they all fit on one page? Well, I see they do now, but will they in the future?

Does Tumblr impose a particular page size, a certain number of photos per page?

If they don't all fit on one page, then jQuery can't provide the solution. You will get the first page of n photos, and you can reverse the order, but they will still be the n most recent photos. Then the next page will have n less-recent photos, which you can reverse in order. But it won't make any sense and won't be in strict order from oldest to newest.

You need to see if Tumblr has an option to change the order.

Another potential problem is if Tumblr does pre-fetch and continuous scrolling. This is a problem because jQuery can't reverse the order of pictures that haven't been received yet!

Alternately, you could make a web page using the Tumblr API, and it probably has an option to reverse the order, or list photos from a certain date. But maybe not a job for a beginner at jQuery. It will be a lot of work, and you will have to set-up your own website. If you want to dig-in to the API, we are here to help with your jQuery problems.

Thank you much for your answer and guidance watusiware. It will take more time, but I am sure I need to tackle my jQuery skills more.

Below is the best answer to solve the issue of reversing the order of Tumblr's posts by date.

Have a nice day!

You have assigned CSS to each post somewhere, so even when I reverse them they appear in the same positions.

This would be the classic way to reverse elements.

var divs = $(".inner_container").get().reverse();
$("#posts .content").append(divs)

Hi Jake,

I am thankful for your advice and solution. It really worked! I am just amazed and encouraged to polish my jQuery skills following your example. Although, humbly, I don't know if I can get there soon enough to understand and solve problems like these. I am more of a right brained person. Thank you much again. And if there's any way I can return the favor, send me an email.

Truly yours,

A good place to start is the jQuery Learning Center. You can probably skim through the first few pages.

But a lot of it is knowing the idioms, and that comes with a lot of reading and writing code. .get().reverse(); means get the jQuery as an array, then use javascript's built in reverse method.

JΛ̊KE