Add An Animated Twitter Bird To Your Blog

Friday, August 31, 2012


Today I'm going to show you how to add that cute little twitter bird that flies around your blog and lands somewhere once you stop scrolling, I've seen them around and I think they are adorable. Twitter is one of the biggest social networking sites used by bloggers so it's a great way to get your readers attention and gain followers.


Note: Like any other HTML editing, backup your template. Click Design > Edit HTML > Download Full Template and save it to your computer.


Add Flying Bird to Post Pages Only;



Find the following code in your template (Ctrl F/ Cmd F)


</body>


And paste the following code directly underneath it

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Twitter Bird Widget for Blogger by Way2blogging.org -->
<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js">
</script>
<script type="text/javascript">
var twitterAccount = &quot;Your Twitter User Name Here!&quot;;
var tweetThisText = &quot; <data:blog.pageTitle/>: <data:blog.url/> &quot;;
tripleflapInit();
</script>
<span style="font-size:11px;position:absolute;"><a title='Blogger Widget by Way2blogging.Org' href="http://www.way2blogging.org" target='_blank'><img border='0' src='http://img1.blogblog.com/img/blank.gif'/></a></span><a href="http://www.spiceupyourblog.com" target="_blank">Twitter Bird Gadget</a>
<!-- Twitter Bird Widget for Blogger by Way2blogging.org -->
</b:if>



Add you username, not the entire url. Save template.


Add Flying Bird to All Pages;



Find the following code in your template (Ctrl F/ Cmd F)

</body>

And paste the following code directly underneath it


<!-- Twitter Bird Widget for Blogger by Way2blogging.org -->
<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js">
</script>
<script type="text/javascript">
var twitterAccount = &quot;Your Twitter User Name Here!&quot;;
var tweetThisText = &quot; <data:blog.pageTitle/>: <data:blog.url/> &quot;;
tripleflapInit();
</script>
<span style="font-size:11px;position:absolute;"><a title='Blogger Widget by Way2blogging.Org' href="http://www.way2blogging.org" target='_blank'><img border='0' src='http://img1.blogblog.com/img/blank.gif'/></a></span><a href="http://www.spiceupyourblog.com" target="_blank">Twitter Bird Gadget</a>
<!-- Twitter Bird Widget for Blogger by Way2blogging.org -->


Add you username, not the entire url. Save template.


Twitter have now release a one click follow button like this one below


You can check it out on twitters resources page.