Ceco

Blog about all things apps.
Recent Tweets @ceco
Posts tagged "viral"

Adding a Facebook ‘Like button’ to your blog is an extremely valuable feature undocumented by Tumblr (maybe because it competes with their own ‘liking’ system?). For those unfamiliar with what the ‘Like’ button is, it’s a way for Facebook users to publish blog posts they like to their activity feed, broadcasting your blog to all of their friends in the process. This is a quick cheap way to promote your blog and generate more traffic. Just paste the 4 lines of code into your template and you’re done!

STEP 1:

Search for <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8” /> and right after it (or anywhere in the head), paste:

<meta property=”og:title” content=”{block:PostTitle}{PostTitle}{/block:PostTitle}”/>

<meta property=”og:site_name” content=”appsmonkey.com”/>

<meta property=”og:image” content=”http://static.tumblr.com/usynesx/eoWl8wyr8/appsmonkey-logo-sm.png”/>

The first tag og:title determines how the title of your post will appear on Facebook. The second tag og:site_name is how your site’s name will appear on Facebook so you’ll want to replace appsmonkey.com with your blog name. The third tag is optional and represents a thumbnail image of your blog. Remove this or replace it with a thumbnail of your blog.

STEP 2:

Using the default Redux theme, search for {/block:PostNotes} and add this code after it (or anywhere in the footer after <div class=”footer):

<iframe src="http://www.facebook.com/plugins/like.php?href={Permalink}&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=evil" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:auto; height:24px;margin-top:10px;"></iframe> 

Once the button is working, you can fine-tune it by adjusting the width property to control whether the text wraps or not and moving it into the desired place in your blog post.