Blogger / Button Installation Instructions

Installing your Contact Button on your Blogger blog is easy.

This step by step guide will take you through the installation process.

You can either install your Contact Button automatically at the end of every blog or on the Sidebar of your blog (but not both). Be sure to create your button code before you start.

For a Sidebar example, see - http://iamjohnsmith1.blogspot.com/

For a below each blog example, see - http://wikiworldbook.blogspot.com/

Install on the Sidebar of Blogger

  • Step 1

    Sign in to Blogger.

  • Step 2

    On the Dashboard page, select Layout for the blog you wish to add your Button to.

  • Step 3

    Click Add a Gadget.

  • Step 4

    Select HTML/JavaScript on the pop-up window.

  • Step 5

    In the next pop up window, write "Contact Button" in the Title field and then paste your button code into the Content field below.

  • Step 6

    Click Save and you're finished!

Installing on Your Blog Posts

  • Step 1

    Sign in to Blogger.

  • Step 2

    On your Dashboard, click the Layout option of the blog you wish to add your Button to.

  • Step 3

    Click on Edit HTML.

  • Step 4

    Tick the Expand Widget Templates checkbox.

  • Step 5

    Find the <div class='post-footer'> tag in the code. It should be around half way down the page.

    If you can’t find this DIV tag, left click your cursor into the code and use a word search to find post-footer.

    You can find word search either on your browser under Edit > Find, or by using Ctrl-F.

  • Step 6

    Copy and paste your button code into the HTML, immediately after the <div class='post-footer'> tag.

  • Step 7

    Click Save Template and you're finished!

    Your button should now appear beneath each blog post. Click View Blog to see it.

Alternative Step 5 & 6

If you prefer, you can cut and paste all the Blogger code into a word processing program and search for post-footer there. Then add the Contact Button code and paste all the code back into Blogger.