Why I Blog?

For the past two months, I've desired for just one thing, "free time"! Yeah, you got it right, I have been giving my exams but finally, they have ended. Now I'm staring at the the plenty of free time I've got and and wondering why, in the first place, I ever wanted it? I slept, read, watched movies, did shopping and everything I wanted to do but still have a lot of free time in reserve. May be this is the only thing that is "free" and in excess these days.

I would stop boring you now and come to the point straight and that is, why do I blog? and the answer is, "I don't know!". When I was a student, I used to write poems and my friends suggested I should write on a broader platform but being an introvert, I discarded the suggestion. But today, when I have nothing else to do, I decided to try my luck here i.e The Blogosphere. Talking about myself won't be a great idea so I would rather stick to the topic i.e. "Why PEOPLE blog?" The reasons, in my view, are few and simple which are as follows:

More

Mohammad 4/17/2011

Add Floating Facebook Like and Retweet Counters To Your Websites

UPDATED:  Problem Solved now happily use the new working code :>

Since it is weekend so I thought lets  play with some CSS again. Facebook Like Button and retweet counter by tweetmeme are the two most widely used social media widgets without which you can’t call a blog a blog. Both these buttons along with Stumble Upon bookmarking button can let your readers circulate/share your tutorials and articles with their interested collegues and friends connected to them via these social networks. With a little HTML spiced with CSS we succeeded in creating a floating widget that will include these three buttons and will stay fixed at the middle lift side of your websites. The widget settings can surely be changed to align it to the right, bottom or left if you wish. You can also add more buttons to it if you wish like DIGG for instance.  See a demo first,

More

Mohammad 4/09/2011

Show Guest Author Info Below Blogger Posts

Due to lack of time blog authors often have to rely on Guest posters. In return we offer them with quality back links and advertisement. In order to better serve them it is important to display some info about them in a polite and attractive manner. This will encourage more and more people to write quality articles for you. We are very selective in accepting tutorials written by our readers but once the tutorial qualifies we publish their post in the best manner possible. See the example below which shows one of MBT’s Guest Author’s info ,

Update: A Dynamic version of the same widget has been published. Please visit: Display author Box automatically

 
To create this type of attractive box for your guest authors you would need to play with some  delicious CSS and HTML . So then Lets jump straight to the main part!

How To Create a Customized Author Info Box?

1. Go To Blogger > Design > Edit HTML
2. Back up your template
3. Search for ]]></b:skin>
4. Just above it paste the code below,

/*----------Guest Poster --------*/
.mbt-gp img {
margin:0;
border:0;
}
.mbt-gp-about {
font-size:12px;
margin:0 auto;
padding:3px;
width:580px;
background:#edf6ff;
border:#9ecfff dotted 1px;
min-height:130px;
}
.mbt-gp {
padding-top:10px;
margin:0;
font-size:12px;
float:left;
width:17%;
text-align:center;
border-right:#93C0F9 solid 1px;
}
.mbt-gp-text {
float:right;
width: 80%;
padding:5px;
text-align:left;
font:12px arial,sans-serif;
text-align:justify;
margin:0;
padding:0;
}

   5.    Save your template and jump to the next part of the tutorial.

How To Add The Author Info Box Below Guest Post?

Now whenever you publish a Guest post at your blog, simply switch to the Edit HTML Mode of your Blogger Editor. And drag to the bottom of the HTML codes and just at the end add the code below,

<div class="mbt-gp-about">
  <div class="mbt-gp"><img src="GUEST-AUTHOR-IMAGE-LINK" width="80" height="70" /> GUEST-AUTHOR-NAME </div>
  <div class="mbt-gp-text">
    <p><strong>About the Guest Author:</strong>
      <br />ADD-DESCRIPTION-ABOUT-AUTHOR-INFO-HERE </p>
  </div>
</div>

See the screenshot below to know better where to add the code,

Make sure you replace the bolded text with proper details. The image size would fit perfectly if it is 200px by 125px.
Suggestion:  To customize the colours and style of the box I recommend that you use MBT HTML Editor
You will have to add just the second code for every guest post that you publish. Once you understand on how to do it then doing it again and again would become more like a fun. I just hope you find it useful and worth trying. Take care buddies. :>

More

Mohammad 4/08/2011