Tumblr — getting the 8 digit reblog code on home page (nearly there…)

Question

I've seen two sites in the wild which manage to get Like and Reblog buttons on their homepages via hacks.

This seems to be the best one to reference: http://cicerontheme.tumblr.com/

Somehow, they manage to get the reblog URL, how, i have no idea. I've been rummaging through their code and all I find is this for the like button:

$('a.likeLink').click(function() {
    var post = $(this).closest('.post');
    var id = post.attr('id');
    var oath = post.attr('rel').slice(-8);
    var like = 'http://www.tumblr.com/like/'+oath+'?id='+id;
    $('#likeit').attr('src', like);
});

It's discussed a little in this Stack overflow discussion but again, does not get to the crux of the matter, how the heck to get the reblog url.

I've gone through the script resources and havent found any personal scripts, just scripts from tumblr, my chrome extensions, etc. Where are they getting it from?!

In the "like" code pasted above, they get the post ID easily enough, you just have to use Tumblrs {Permalink}, but the reblog url is taken from the rel attribute.

Hoping someone can help!

Thanks.

Answer 1

Pretty sure this isn't a JS thing — when you view the source of the site you linked, the reblog links are already there (meaning, they aren't being dynamically inserted).

I think the the Ciceron theme is actually generating reblog links - have you tried adding:

<a href="{ReblogURL}">Reblog</a> 

...to your theme?

Answer 2

View the Source code at: http://cicerontheme.tumblr.com/

1. $('a.likeLink').click(function() {
2.     var post = $(this).closest('.post');
3.     var id = post.attr('id');
4.    var oath = post.attr('rel').slice(-8);
5.    var like = 'http://www.tumblr.com/like/'+oath+'?id='+id;
6.    $('#likeit').attr('src', like);
7. });

Explanation of the code:

1. Add an event handler to the anchor with class likeLink
2. Uses the JQuery .closest method to find the closest element with class post (which, in fact, is an anchor, see source)
3. Get the ten-digit tumblr ID from the ID attribute of the anchor (using .attr('id')
4. Get the rel attribute of the anchor, and use .slice(-8) to get the last 8 characters
5. Create link
6. Set the src attribute of the <iframe> with ID likeit (see source). This causes a request to http://www.tumblr.com/like/..... Hack?

Answer 3

From your tumblr dashboard, each post has a 'reblog' icon. Surely if you click this, that post's reblog url will appear in the addres bar? Of course, this means adding the url manually for each post, but it's the only alternative I've found to the default tumblr controls.

'Follow' and 'Dashboard' are bog standard a href commands, but I'm still looking for a way to have a simple text link for the 'like' functionality, so that I can do away with the default controls altogether.

Answer 4

The use of the "reblog key" is sanctioned by Tumblr, and encouraged in some developer situations just like the ones that you have mentioned.

Tumblr has an API and Internal Theme Development Options to utilitze the reblog key. It's a neat trick, but to be clear it's not a hack, as Tumblr does intend, encourage, and hope that this tool is used and helpful for everyone.

See the specific API article on "reblog key" post usage: https://www.tumblr.com/docs/en/api/v2#reblogging

When you use the Tumblr API to post programmatically to your Tumblr blog, you are given a response with the "reblog key". You can create a script that could display a reblog url of your own tumblr post, instead of a share button that would create a new post. This could help you localize on tumblr to your own source, and send better "Canonical Link" power for SEO.

In themes internal to Tumblr, you could use {ReblogURL} to display the reblog url, or create a like button.

There are potentially a lot of ways you can use this properly, but there are also a lot of ways that are not allowed, even if it's and easy or obvious thing you "could" to do. Most of all, be nice to other users and don't do something other users wouldn't like (hidden clicks, etc).

You can make yourself aware of Tumblr Terms of Service here: https://www.tumblr.com/policy/en/terms-of-service

I mentioned the API which has it's own little section of rules, it's linked within the Terms of Service. You can read the Tumblr Application Developer and API License Agreement: https://www.tumblr.com/docs/api_agreement