Adding official Twitter follow button to Blogger

Adding official Twitter follow button to Blogger

Make it easier for your blog visitors to follow you on Twitter by adding Twitter Follow button to your blog.

The Twitter Follow Button lets them follow you straight from your blog, without having to visit Twitter.  All it takes is just one click (if they are logged in).

The button comes with (optional) followers count. Visitors can also see your profile and latest tweets by clicking the button.

1. Go to Design > Page ElementsDashboard > Layout .
2. Click Add A Gadget and select HTML/Javascript gadget.
3. Copy the code below and paste it inside the content box:

   <!-- Twitter follow button start -->
   <a href="http://twitter.com/USERNAME" class="twitter-follow-button">Follow @USERNAME</a>
   <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
   <!-- Twitter follow button end -->

Screen Short

• Replace USERNAME with your Twitter handle (username).

Configure button   

You can configure the look of the Follow button by adding link data-attributes (next to class="twitter-follow-button") in line 2. Refer to the list below:

1.  

   Description	Appearance	Data-attribute
   Default
   Don’t show followers count		data-show-count="false"
   Don’t show Twitter handle		data-show-screen-name="false"
   Large button (shown here without count)		data-size="large"
   Align button to the right		data-align="right"
2. Save the widget and view your blog.
3. Do test the button to make sure if it works.

Here’s a live demo example:

and the code for it:

<!-- Twitter follow button start -->
<a class="twitter-follow-button" href="http://twitter.com/sitsoft1650" data-show-screen-name="false" data-size="large">Follow @BloggerSentral</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<!-- Twitter follow button end -->

Enjoy!