Sunday, July 25, 2010

How to - Twit/Fb blog badges

Hi there both readers and bloggers! Ever wondered how bloggers created their Twitter and Facebook badges?

Today, I'll show you an easy way how to out 'follower' badges for your own blog. The steps about to provided will be for blogger.com users. So, here it is:



1. Login to your Blogger account.
2. Proceed to the 'Design' tab
3. Then, click on the 'Edit HTML' sub-tab.
VERY IMPORTANT: Just in case, you miss something and ruin your blog's coding, backup your working template by clicking on the 'Download Full Template' link:

 
4. Next would be to find the 'Expand Widget Template' checkbox. You have to make sure that this is first checked, before you proceed to making the code changes.
5. In the code page, look for this: "]]>" WITHOUT the quotes(" "). You can hit Ctrl+F to easily locate the said code.
. Once located, copy and paste the following code right above the ]]> code:

#float_corner {
position:fixed;_position:absolute;bottom:10px;left:3px;clip:
inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);}

Which should look like this:



Please Note:
This will position the image just up from the bottom left corner of the page.
You can change this just change the following attributes : bottom :left
Change them to make the image appear were you like :

top left
top right
bottom left
bottom right

7 . Up next is to find the tag. Just press Ctrl+F and to make a quick search.
8. Then copy and paste the following code directly above it and change what's necessary*:







*Note: Necessary, meaning to change the 'YOUR TWITTER USERNAME' to your twitter profile.
 Example: http://twitter.com/digiknowzone


The code should look like this:




8. Ultimately, you have to save your changes and click on the 'Save Template' button:



Before we finish : If you need more help or have an opinion or suggestion Please leave a comment Below. I'll reply to your comments and queries as soon as I can.

9. View your blog. And should somehow look like this:

10. Enjoy!

I have also uploaded both vertical badges for both Facebook and Twitter:
Facebook:    http://img716.imageshack.us/img716/7343/fblogodigiknowzone.png
Twitter:          http://img705.imageshack.us/img705/5872/twitdigiknowzone.jpg



Yes, you! We want your feedback! We believe that by seeing your feedback, we can help improve our blog and in turn, we can serve you more efficiently.

Also, if you have any questions, suggestions or any violent reactions, don't hesitate to post a comment or send us a feedback.
Minute Maid Pulpy Juice Drink!
Minute Maid Pulpy Juice Drink!