
How To Add
In Blogger, go to (1) Layout (2) Page Elements and in your "Blog Posts" module click (3) Edit.
By default, Blogger gives you 3 categories: Funny, Interesting, Cool. You can add more or remove some if you want. In my case, I only wanted one; a "Like" button.

If I kept everything as the default settings, it would give me something that looks like the first image shown in this post. Not quite a "Like" button, so I had to edit the code myself. To do so, I made only one category simply labeled "Like" and after saving all my progress, I moved into the "Edit HTML" module. I clicked "Expand Widget Templates" to show all the code. This line of code was made from the settings I had just set up:
<span class='reaction-buttons'><b:if cond='data:top.showReactions'><table border='0' cellpadding='0' width='100%'><tr><td valign='center'><span class='reactions-label'><data:top.reactionsLabel/></span></td>
<td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td></tr></table></b:if></span>
It's a little messy and it had some things in there that I didn't want. The following line is the code that renders the word "Reactions" (or whatever you decide to name your categories). In my scenario, I didn't want it shown at all, so I just deleted the line:
<span class='reactions-label'><data:top.reactionsLabel/></span>
Some of the other code was formatting for tables. Since I only have 1 box, I don't need to worry about how multiple boxes will look. With that said, I cleaned the code even more. This is the final code that simulates the "Like" feature I was going for:
<span class='reaction-buttons'><b:if cond='data:top.showReactions'>
<iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' name='reactions' scrolling='no'/></b:if></span>
7 comments:
Thank Gawd!!! I couldnt remember how I put Reactions on and REALLY couldnt figure out how to remove it! Thanks!
Hey no problem at all Jeannie... glad you found it helpful!
Is it possible to put this outside of the blog area. for example a html widget on the sidebar. while keeping the actual reaction buttons normal, creating a like button like yours seperately?
ugurarcan: Not really sure what you mean. Are you talking about a "Like" feature for just the overall website as opposed to each individual post?
Perhaps. Here is specifically what I have been trying to do. I have regular reaction buttons after each post to measure reactions as Blogger has provided the tool for us.
BUT... What I ALSO want to do is create a "like" button for a HTML widget that I created. I put events, movies, etc there as my showcase section and I want people to say "I like this too" or "yeah I saw this" with a simple "like" button as in Facebook. Of course needless to say I want the tally next to it.
So I would keep the regular reactions under each blogpost but want that extra benefit. Is that possible? Simply if I copy and paste code that is after each blogpost, I would have to have the same reaction options both for blogposts and that widget. I would like to be able provide visitors different set of options for blogposts and just the "like" option for that widget.
Hope it is more clear now.
Thanks!!
ugurarcan: Hmmm... sorry for the delayed response. I see what you're talking about now and I looked into it. I couldn't really figure anything out for setting up a "Like" feature for Widgets, but obviously that's not to say it can't be done; I'm more of a designer than a coder.
Sorry if I can't answer that question but I hope the post was helpful in regards to your previous question. Best of luck figuring it out and if you do, please let me know... I'm sure more people are wondering the same thing.
Thanks for your interest!
it's a quest and i will share with you once i find a solution :) thanks!
Post a Comment