In this Blogger tutorial, you are going to learn how to add Facebook like button on Blogger. Having a Facebook like button on your blogspot blog allows your visitors to promote/share your blog content on the Facebook wall and Newsfeed.
Facebook like button is always a great way to get more visitors to your website from Facebook. It also allows them to like your Facebook fan page directly. In order to show a like button on all your Blogger posts, you have to insert the like button code into your theme’s template.
Don’t Panic!!! If you have not prior experience of customising your blogger website, its really very simple to do even if you don’t have any sort of knowledge in coding. Just follow the steps I have written below.
Note: Backup your Blogger blog before doing any changes to the Blogger Template. To do so, read this article.
Generate Code for Facebook Like Button
Step #1. First, make sure you’re logged into your Facebook account. Then, enter the following URL into the address bar and open it.
Step #2. Now, add the URL of your blogger blog in which you’d like to add the Facebook like button. (see screenshot for reference)
Note: Under Like Button Configurator, you can also set the width, layout, and size of the button. Change according to your preference.
Step #3. Click Get Code to generate the code.
Step #4. Select the IFRAME code and copy it.
Now, you have generated the Facebook like button code for your Blogger blog. It’s time to add it to your blog. You can add the code using two ways: the first way is using the gadget method and second way is to insert the code into the Blogger template. I have mentioned both ways to add Facebook like button to Blogger.
Note: Do Step 5 —> Step 7 to add the code using the Gadget method. Most of the time it adds the like button at the sidebar.
Step #5. Now, login to your Blogger dashboard and choose Layout from the left navigation bar.
Step #7. Paste the code generated in Step 4 above and click Save. (see screenshot below)
Perform Step 8 —> Step 11 to add the code to the blog post.
Step #8. On your blogger dashboard, go to Theme > Edit HTML.
Step #9. Click Hide warning if it shows any HTTPs warning.
Step #9. Place your mouse cursor anywhere inside the code and press Ctrl+F to open the Blogger search box.
Step #10. Inside the search box, type <data:post.body/> and hit enter.
Step #11. Paste the Facebook like button code just below the <data:post.body/> and save the template.
Visit your blog to see the Facebook like button on every blog posts on blogger.