2

I've removed all post centered markup from my Tumblr theme and instead I'm using ajax to fetch the data. So far, so good. Now I want to add a like button to each post, but I can't seem to find any documents on how to do this (without resorting to their api, which needs oauth to work).

Are there no way to include like buttons when you use ajax to fetch the posts and you rather not go full fledge api with oauth?

Aldwoni
  • 1,168
  • 10
  • 24
INT
  • 910
  • 4
  • 21
  • 45
  • possible duplicate of [Can I mimic Tumblr interaction such as reblog and like via their API?](http://stackoverflow.com/questions/23445566/can-i-mimic-tumblr-interaction-such-as-reblog-and-like-via-their-api) – mikedidthis May 06 '14 at 19:24

1 Answers1

0

Tumblr's new implementation of the "Like button" for individual posts uses an <iframe> element to function. The URL for this iframe is obtainable only through your Theme code.

For example:

{Block:Posts}

    <div class="like-button">{LikeButton}{/div>

{/Block:Posts}

What is rendered for the {LikeButton} will look something like this:

<iframe id="like_iframe_84714330251" src="http://assets.tumblr.com/assets/html/like_iframe.html?_v=fa292ab73ee80893ffdf1edfabaa185a#name=blog-name-&amp;post_id=84814329251&amp;rk=reKNyFfj" scrolling="no" width="20" height="20" frameborder="0" class="like_toggle" allowtransparency="true"></iframe>

There does not seem to be any way to obtain this without including {LikeButton} inside of a {Block:Posts}

For using ajax, you could include a hidden element on the page that loads this information and parse it out when loading each page of posts using ajax.

So if in your theme you included something like:

<div id="posts-info" style="display: none;">
{Block:Posts}

    <div class="post-info" data-postid="{PostID}">{LikeButton}</div>

{/Block:Posts}
</div>

When you load your posts with AJAX, you would also have to load the correct page of your Tumblr (with this code in the Theme).

You could then parse this information by matching the Post ID's to the posts you fetched with AJAX and insert that <ifame> code.

This is a really round-about solution but it should work.

Felix
  • 541
  • 2
  • 7
  • 1
    I actually tried this, but had some serious trouble using clone to copy the iframe. I ended up with chalking it as a cloning iframes issue.. And in the end it's probable that the iframe code might change in the future, rendering this hacky solution broken :( I just wish they'd let me create like buttons via JS on their own domain.. – INT May 05 '14 at 11:52
  • I think inserting a new ` – Felix May 05 '14 at 11:58
  • Sorry to say, but this is a hacky solution. Please use the API, its what it is there for. – mikedidthis May 05 '14 at 19:36
  • Didn't claim it wasn't hacky. But honestly using the API in this manner on a Tumblr page isn't exactly intended use of the API either. – Felix May 10 '14 at 15:44