Adding a Facebook “Like” Button (Timeline) on a Blogger Blog

I got my “Like” Facebook link up and running on my blogger blog yesterday (this was no small feat since I’m so technologically challenged).  Anyway, I have received a few e-mails on how to do this.  So, I’m going to try to walk you through this.  (These instructions assume you have already created a Facebook Page.)

  • To make things easier, open facebook in one tab and open blogger in another tab. (This way you are ready to toggle between both sites later on)
  • Go to the facebook page you created  (there should be an Admin Panel at the top of your page).
  • Look to the lower right corner and there should be a block that says “Page Tips”.
  • “Page Tips” has two main options that you can toggle between them by hitting the next button.  You want “Discover Resources & Tips” and click on it.
  • The next screen has 3 main categories:  
    • Develop Your Page
    • Connect With People
    • Additional Resources
  • Under “Connect With People” you want “use social plugins”.  Click on this
  • The first option at the top of this page is “Like Button”.  Click on this
  • Now here is the first place where I got so confused.  The first box asks “URL to like”.  What they are asking for is the internet address for your facebook page.  So just go to your facebook page and cut and paste the address that appears at the top of your computer screen.
  • Next you will go down and decide the rest of button options (pictures, etc).  Once you have made your selections, click on “Get Code”.
  • Here is the second place where I got so confused.  There will be 2 boxes of code.  You do need both of them.  Here’s what I did.
    • On blogger you want to go to “design” blog.  Then on the layout where you can add gadgets, you want to add “HTML/Java script” gadget.  
    • Then, I added the title “Follow On Facebook”.
    • The big empty box that looks like you would write text you want to copy and paste the two pieces of code facebook gave you.  I copied and pasted the contents of the first box (much more code) and then spaced down a couple of lines and copied and pasted the second piece of code  (This way if there was a problem I knew which code came from which box on Facebook).
  • Then when I saved my design and viewed my blog it worked!  I was the first one to LIKE my page just to verify it worked.
Let me know if this helps!

{Click here to read more}
Loading Facebook Comments ...


  1. says

    Thank you so much for this…i just wasted so much time on HTML’ers sites trying to figure it out, and you just explained it so much simpler – thank you!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>