You want to add the official Facebook Like or Recommend Button at the end (or at the top) of each of your blog post, here's how.
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
1) To show Facebook Profile pictures/faces of people who "Liked/Recommended" the blog post, change "false" to "true".
2) To use different action on the Facebook Button, change "like" to "recommend". Decide which is suitable for you.
3) To change the font, change "arial" to either "lucida+grande", "segoe+ui", "tahoma", "trebuchet+ms" or "verdana". Decide which is suitable for you.
4) To change the colour scheme, change between "light", "dark" or "dark". It represents the background colour your blog uses. If it's light colours use "light", if it's dark use "dark" and "evil" is somehow the same.
5) To change the width or height of the button, change them accordingly.
That's all for now!
Firstly, go to Dashboard > Design > Edit HTML.
Then click Expand Widget Templates.
Then click Expand Widget Templates.
Search for this code:
<data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> |
Then, here's the code to add the Facebook Like Button.
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
Where to add Facebook Like Button?
To add it above each blog post, add the code before <data:post.body/>.
To add it after each blog post, add the code after
<div style='clear: both;'/> <!-- clear for photos floats -->.
<div style='clear: both;'/> <!-- clear for photos floats -->.
To distance the button away from the blog post, add <br/> before or after the Facebook Like Button code depending on where to put it.
Click "Save Template" and you're done.
---------------
How to customize Facebook Like Button?
1) To show Facebook Profile pictures/faces of people who "Liked/Recommended" the blog post, change "false" to "true".
2) To use different action on the Facebook Button, change "like" to "recommend". Decide which is suitable for you.
3) To change the font, change "arial" to either "lucida+grande", "segoe+ui", "tahoma", "trebuchet+ms" or "verdana". Decide which is suitable for you.
4) To change the colour scheme, change between "light", "dark" or "dark". It represents the background colour your blog uses. If it's light colours use "light", if it's dark use "dark" and "evil" is somehow the same.
5) To change the width or height of the button, change them accordingly.
That's all for now!
No comments:
Post a Comment