Spread The Word

Spread our WordWith over 19,000 regular readers, hundreds of tutorials and thousands of answered queries Alhamdulillah, its now our kind request from all our beloved readers, contributors and motivators to spread the knowledge as far as they can so that everyone could learn what you are learning at the moment.  Sharing knowledge is indeed better then preserving it. Whatever help that we have provided so far and will keep on providing is free of charge. From templates, widgets, CSS/HTML tutorials to buttons, icons and tons of other blogger resources, all available for free and will remain at your service forever. If our tutorials have helped you a little in making you a better blogger then kindly spread our word to your readers, friends and all those close ones who deserve to know what you know now.

We have shared different Ad formats that will blend perfectly in your blogs. All banners are in PNG format so they will suit any background. Simply copy the codes given below each banner and paste it in your HTML/JavaScript widgets.

125 by 125 Banner

125 by 125 banner

<a href="http://www.mybloggertricks.com/" ><img  border="0" src='http://3.bp.blogspot.com/-4oNXY_-qsi0/TfKIFohE6XI/AAAAAAAADwA/oh5rjLDcpo0/s400/125-by-125-PNG.png' rel="Blogger Widgets" title="Blogger Widgets"/></a>

[a href="http://1.bp.blogspot.com/-5jm24df9vB4/Ts5T4fYA81I/AAAAAAAAFac/GI0v5-LZhb8/s1600/MYBLOGGERTRICKS.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"][/a]

<a href="http://www.mybloggertricks.com" ><img alt="Make Money Blogging!" border="0" src="http://1.bp.blogspot.com/-5jm24df9vB4/Ts5T4fYA81I/AAAAAAAAFac/GI0v5-LZhb8/s1600/MYBLOGGERTRICKS.jpg" /></a>

[a href="http://2.bp.blogspot.com/-m9K1asqesgM/TfKOlQp0rpI/AAAAAAAADwg/OpYo1ukptYM/s400/entrecard.gif" target="_blank"]125 by 125 banner[/a]


<a href="http://www.mybloggertricks.com/" ><img  border="0" src='http://2.bp.blogspot.com/-m9K1asqesgM/TfKOlQp0rpI/AAAAAAAADwg/OpYo1ukptYM/s400/entrecard.gif' rel="Blogger Widgets" title="Blogger Widgets"/></a>

Related Tutorial:

  • [a href="http://www.mybloggertricks.com/2009/09/125-by-125-ad-banner-widget-for.html" target="_blank"]You can also create a beautiful 125 by 125 Banners Widget[/a]

300 by 250 Banner

[a href="http://3.bp.blogspot.com/-En-5TX5a0xg/TfKIGBxOsNI/AAAAAAAADwI/tlUEHPp-Ow0/s800/300-by-250-PNG.png" target="_blank"]300 by 250 banner[/a]

<a href="http://www.mybloggertricks.com/" ><img  border="0" src="http://3.bp.blogspot.com/-En-5TX5a0xg/TfKIGBxOsNI/AAAAAAAADwI/tlUEHPp-Ow0/s800/300-by-250-PNG.png" rel="Blogger Widgets" title="Blogger Widgets"/></a>

468 by 60 Banner

[a href="http://2.bp.blogspot.com/-od4mZpeI3Eg/TfKIGiQTySI/AAAAAAAADwQ/XlDTGV5TNH0/s800/468-by-60-2.png" target="_blank"]468 by 60 banner[/a]

<a href="http://www.mybloggertricks.com/" ><img  border="0" src='http://2.bp.blogspot.com/-od4mZpeI3Eg/TfKIGiQTySI/AAAAAAAADwQ/XlDTGV5TNH0/s800/468-by-60-2.png' rel="Blogger Widgets" title="Blogger Widgets"/></a>

Related Tutorial:

  • [a href="http://www.mybloggertricks.com/2011/03/how-to-create-random-468x60-ad-banners.html" target="_blank"]You can also create a beautiful 468 by 60 Random Banners Widget[/a]

Tiny Button

[a href="http://4.bp.blogspot.com/_7wsQzULWIwo/Sw_xXX2dRQI/AAAAAAAACWk/N6b11x6d588/s400/mybloggertricks.com.gif" target="_blank"]tiny button[/a]

PS: GIF. Those who previously added this button to their blogs may kindly use this updated code.

<a href="http://www.mybloggertricks.com/" ><img  border="0" src='http://4.bp.blogspot.com/_7wsQzULWIwo/Sw_xXX2dRQI/AAAAAAAACWk/N6b11x6d588/s400/mybloggertricks.com.gif' rel="Blogger Widgets" title="Blogger Widgets"/></a>

[a href="http://2.bp.blogspot.com/-T1OR5tH2TEQ/TfKIHRbgm4I/AAAAAAAADwY/oX12JTkVQrM/s400/tiny-button.png" target="_blank"]tiny button[/a]

<a href="http://www.mybloggertricks.com/" ><img  border="0" src="http://2.bp.blogspot.com/-T1OR5tH2TEQ/TfKIHRbgm4I/AAAAAAAADwY/oX12JTkVQrM/s400/tiny-button.png" rel="Blogger Widgets" title="Blogger Widgets"/></a>

Source: http://www.mybloggertricks.com/2011/06/spread-our-word.html

How Google Blogger was Invented? A True Story

  • On August 23, 1999, Blogger was launched by Pyra Labs.
  • At first Blogger was entirely free and there was no income model. When Pyra Lab’s money was about to end, the employees worked without pay for weeks, even months.  This caused a lot of employees to leave the company. Evan Williams, who is the co founder of Blogger, ran the company exclusively by himself after the loss of income.  He then was lucky to fasten an investment by Trellix. Soon after, advertising started supporting Blogger, and Blogger professionally emerged.
  • In 2004, after the Google’s acquisition of Picasa, Google integrates its photo sharing utility allowing the users to post photos to their blog.
  • In May 2004, a major redesign was introduced, the features such as web standards-compliant templates, individual archive pages for posts, comments, and posting by email was added.
  • In August 2006, Beta version of Blogger was launched, codenamed "Invader".
  • In May 2007, blogger moved to Google’s dedicated servers.
  • In January 2009, Blogger allowed BlogSpot users (without own domain) to sign up with Google Adsense.

Google Blogger

Drastic Redesigns

In December 2006, drastic changes took place. Blogger was taken out of its beta version and totally moved over Google operated servers. This made Blogger claimed that the service was more reliable due to the quality of the servers provided by Google. There were new features introduced due to the Google’s dedicated servers.  These features included, a drag and drop template-editing interface, label organization, and new web feed options.  In addition the blogs were updated enthusiastically, as opposed to rewriting HTML files.

Integration of Tools

  • A free add-in for Microsoft Word named, “Blogger for Word”. It enables the user to save a Word document on their Blogger’s blog so that they can also edit their post on and offline. But in early 2007, Google showed uncertainty about its compatibility with newer version of Blogger; however MS Word 2007 adds native support for many blogging systems including Blogger.

  • Google toolbar has a feature called “BlogThis”, which allows the user of Bloggers to post links directly to their blogs.

Blog This by Google
  • Google's AdSense is supported by Blogger for generating revenue from running a blog.

  • Blogger offers multiple author support, making it possible to establish group blogs.


Today Blogger is amongst the world's top ten websites and there are [a href="http://www.mybloggertricks.com/2008/03/blogger-tips-and-tricks.html" target="_blank"]tonnes of tutorials written on it daily[/a]. This was just a brief history of the great Google blogger in a nutshell to give you some history knowledge of this great service that many of us are addicted to. I just hope you liked it. If you know something new with regard to how Blogger actually came into being then feel free to share it. We love sharings. :)

 umair-khanUmair Ahmed Khan

About the Guest Author:

Umair is an Undergraduate Student, pursuing his B.E Degree in Computer and Information System Engineering. He has a desire to develop IPhone and Android applications in future. You can contact him always at his [a rel="nofollow" href="http://www.facebook.com/umairkhan.cis"]Facebook[/a]

Source: http://www.mybloggertricks.com/2011/05/how-google-blogger-was-invented-true.html

How To Create Google Custom Search Engine?

   4.   The Click the next button and choose the Design for your search engine. You can click the "Customize" button to edit the colours and look.


   5.  Hit the next button and then click the "Look and feel" link on the next page as shown below,


It will bring you a page where you will find three layout options i.e Full -width, Compact and Two Column as shown below,

Google Search Engine Layouts

  • If you wish to add the search box just below posts as I have done on my blog then choose Full-width
  • Or if you wish to display the box and results on the sidebar then choose compact
  • Else if you wish to add your search box to your sidebar and display the search results above the post title then choose Two Column

  6.  Finally hit "save & get code" button and jump to the next part of our tutorial.

Add Google Custom Search Engine To Blog Posts

To add the search engine just below your blog posts as we have done on MBT then please follow the steps below,

customize Google Custome Search Engine

  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Click the Expand Widgets Templates Box
  4. Search for <data:post.body>
  5. Just below it paste your Blog Post Search Engine Code (Full-width)
  6. Save and you are done!
  7. View your blog to see it appearing just below posts.

Add Google Custom Search Engine To Blog Sidebar

  1. Go To Blogger > Design
  2. Choose a HTML/ JavaScript Widget
  3. Paste your Sidebar Search Engine Code (Compact or Two Column) in it
  4. Save and you are done!
  5. View your blog to see it working just fine

Changing your default search box to Google Custom Search Engine Box is an important step that you must take as early as possible. You will see the difference in your analytics the next week. In the next post as shared below you will learn to integrate your AdSense Ads to your Custom Search engine and increase your Adsense earnings.

  • [a href="http://www.mybloggertricks.com/2011/05/how-to-integrate-adsense-in-google.html"]How To Integrate AdSense In Google Custom Search Engine?[/a]

Hope you liked it! :)

Source: http://www.mybloggertricks.com/2011/05/how-to-create-google-custom-search.html




3- YouTube - Broadcast yourself





10- QQ.COM

qq top10China’s most popular free instant messaging program [a href="http://www.qq.com/" target="_blank"]QQ[/a] has been ranked 10th by Alexa’s traffic rankings. Its users amount to 636.6 million, making it the world’s largest community online. The program is owned by Ten-cent Holdings Ltd. Since its launching in February 1999, QQ has quickly emerged as a modern cultural phenomenon in China. Besides its cat program, QQ has developed many sub-features as well such as gaming, virtual pets, ringtone downloads, blogging etc.


I hope you liked it. On our next post you will find out how important these top 10 Giants  are to your websites'  success.

 AUTHOR-PICAyesha Mazhar

About the Guest Author:

Ayesha Mazhar is an undergraduate student doing B.E in Electrical Engineering. She loves to write and express herself through any medium. She loves life and always try to live it with a positive attitude no matter how rough things may get. You can contact her always at her [a rel="nofollow" href="http://www.facebook.com/profile.php?id=585630376"]Facebook[/a]

Source: http://www.mybloggertricks.com/2011/05/alexas-top-ten-websites-2011.html


google-vs-yahooIf one looks around, he may found two different styles of working - one organizing ways of getting in the market which sometimes makes Google superior than Yahoo . everything in a big pile and leaving it to you to sort out and find what you need . In other words , gathering everything under one roof . Next approach , gathering neat piles of everything . Putting in front of you what you actually want . Google and Yahoo work with the above mentioned styles respectively . Along with this , Google and Yahoo! have entirely different Many of the Yahoo fans wont like this , i know! :P

I studied briefly the statistics , the proactive approach Google and Yahoo take and the way they market their firms . While studying it all , I found one thing very clear everywhere - Google is a developer and Yahoo is a user . Yes .

[a name='more'][/a]

Lets have a look , how :

Yahoo's Strategy So Far:

yAHOO STRATEGYLets talk about Yahoo side of the story first . Yahoo has always believed in partnerships in order to drive traffic . In 2006 , as we all know , Yahoo made a $1+billion bid for Facebook . It was one of the most crucial steps for Yahoo! to drive public through a social networking site .  But unfortunately , Yahoo didn't make it at the end as Microsoft had offered a more powerful amount of money ($40 billion that is ) :P

Yahoo had always been aware of the fact that it cannot develop a social media website to counter Google's products , and that is why , Yahoo created partnership with social media sites . In 2009 , Yahoo announced a sort-of-connection with Facebook Connect by integrating it in its popular web properties . Through this , Yahoo would be able to get traffic generated by sharing articles and other things on Facebook.

Moreover , Yahoo has also been a partner of Twitter . Yahoo gave users the feasibility to access Twitter from within Yahoo . So we see that Yahoo instead of competing with the social media , believes in partnering with them so as to generate traffic through them .

Google's Strategy So Far:

gOOGLE STRATEGYNow lets discuss Google in detail : Google has always been focusing on developing things on its own e.g Google Buzz . Google has focused on technology unlike Yahoo ,  who believes in partnership . Doesn't it look more like Development vs Partnership ?  Mind taking a look ?

In Oct 2006 , Google buys YouTube . Same year ,  2006 , Yahoo and eBay formed a partnership . In 2008 , Google launched Google Chrome . The very next year , 2009 , Yahoo formed a search partnership with Microsoft . Later in Feb 2010 , Google came up with Google Buzz  . Same year , Yahoo and Twitter formed a partnership . Moreover , Google is launching an application Google Wallet this summer .  While , there are no latest updates of Yahoo (of this summer) in my knowledge .

So you see how well-planned Google has always been . Always taking a very calculated step in developing applications which always grabbed the attention of people , while Yahoo continued on partnerships . Google's strategy is continuously succeeding since the launch of Google Buzz because it is one of the most complete product Google has presented up till now . As compared to Yahoo , Google has developed better technical products in a short duration ( Buzz , Chrome , Wallet , Android  etc. ) . Plus , Google is working more on smartphones now , which is going to be the next biggest target for searching .

To conclude , I would say that COMPARING the two firms is really difficult . I and you all can never judge just on the basis of search engine results that Yahoo is better or Google is better . It all relates to the strategies they follow . And they have entirely different strategies . Neither company's strategy or direction is wrong . Its just that they need different social strategies to succeed .

  Amna Masood Khawaja

About the Guest Author:
Amna has always been a valuable MBT contributor, smooth writer, and a kind socializing person. She is pursuing her B.E Degree in Computer and Information System Engineering. During her Leisure time she loves to share and post her Random Rumblings.

Source: http://www.mybloggertricks.com/2011/05/google-vs-yahoo-two-strategies.html

Add Facebook Send Button to Blogger Blogs

Facebook-send-buttonIn 2010 when Facebook introduced the [a href="http://www.mybloggertricks.com/2010/12/add-facebook-like-button-retweet.html" target="_blank"]Facebook Like button[/a] to help people share interesting stuff with all their friends, some people still needed a more private button that could let them share stuff with specific people. Thus just this year Facebook introduced the  [a href="http://developers.facebook.com/docs/reference/plugins/send/" target="_blank"]Send button[/a],  which is the easiest way to privately share things with groups, friends or individuals. In todays tutorial we will learn on how to add this important new social plugin to your blogger blogs.

[a name='more'][/a]




How To Add Facebook Send Button To Blogger Blogs?

  1. Source: http://www.mybloggertricks.com/2011/05/add-facebook-send-button-to-blogger.html

How To Integrate AdSense In Google Custom Search Engine?

5) Hit the Submit button and you are done!

6) Log into your [a href="http://adsense.com" target="_blank"]Adsense[/a] Account and simply click the link that may appear at the top of your dashboard which will ask you whether or not you wish to let the Custom Search engine to access your AdSense Ads. Simply click it and enjoy the happy new earning! =)

Source: http://www.mybloggertricks.com/2011/05/how-to-integrate-adsense-in-google.html

Top Ten Mozilla Add-Ons for Web Designers & Developers

2. CSS Usage

4. Seo Quake

6. HTML Validator

8. Web Developer


FireFTP is a free, secure, cross-platform FTP/SFTP client for Firefox which provides easy and intuitive access to FTP/SFTP servers. Along with transferring your files quickly and efficiently, FireFTP also includes more advanced features such as: directory comparison, syncing directories while navigating, SFTP, SSL encryption, search/filtering, integrity checks, remote editing, drag & drop, file hashing, and much more…  [a href="https://addons.mozilla.org/en-US/firefox/addon/fireftp/" target="_blank"]Download The Add-on[/a]


Umair let me take the opportunity of commenting first on one of your extremely valuable post. As a web designer my self, I had never looked into the importance of these tools as much as you made it looked so simple and useful. I often wasted a lot of time troubleshooting browser compatibility issues linked to codes in the templates but never realized that how easily these errors could be solved using these brilliant tools. I personally liked it a lot and your post forced me to give you a thumbs up! Great work.

  Umair Ahmed Khan

About the Guest Author:

Umair is an Undergraduate Student, pursuing his B.E Degree in Computer and Information System Engineering. He has a desire to develop IPhone and Android applications in future. You can contact him always at his [a rel="nofollow" href="http://www.facebook.com/umairkhan.cis"]Facebook[/a]

Source: http://www.mybloggertricks.com/2011/05/top-ten-mozilla-add-ons-for-web.html

Style Post and Sidebar Titles With Google fonts In Blogger

  This line will look similar to the one below,

<link  href=http://fonts.googleapis.com/css?family=Aclonica:regular 

rel="stylesheet" type="text/css" >

You will have to add a back slash "/" at the end of the above link like this,

<link  href=http://fonts.googleapis.com/css?family=Aclonica:regular 

rel="stylesheet" type="text/css" />

 3.  Go To Blogger > Design > Edit HTML 

  4.    Backup your template

  5.    Search For </head> and just above it paste the code you copied from Font previewer like this,

<link  href=http://fonts.googleapis.com/css?family=Aclonica:regular 

rel="stylesheet" type="text/css" />


  6.  Save your template and follow the next part of the tutorial.


After you have embedded the font in your templates, you will have to apply the effects to selected areas of your blog like Header Title, Post title and Sidebar. To do that follow the steps below,

How To Style Post Titles in Blogger?

  1. Go To Blogger > Design > Edit HTML

  2. Backup your template

  3. Search For the following code in blue,

.Post h3 {



....               }

    4. Inside the above code you will find this line or a similar one,

.Post h3 {


font-family: arial, verdana;

....               }

    5. Simply replace it with the Second Line which you can get from the font previewer


Like this,

.Post h3 {


font-family: 'Aclonica', serif;

....               }

   6.  Hit Save and you are done!

   7. Preview your blog to see your Post titles appearing beautifully!

How To Style Sidebar Titles in Blogger?

All steps are same as we discussed for post titles. Here instead of searching for .post h3, search for,

.Sidebar h2{



....               }

and replace the font-family with your Second Line of Code like this,

.Sidebar h2 {


font-family: 'Aclonica', serif;

....               }

Save your template to see the effect.


Ps: Since the CSS coding for each template may differ so feel free to ask me for any help if needed. Have Fun!

Source: http://www.mybloggertricks.com/2011/05/style-post-and-sidebar-titles-with.html

Social Share Widget With Counters For Blogger

6. Hit Save and you are done!

Let me know if you needed any help :>

You will also like these social share widgets,

  • [a href="http://www.mybloggertricks.com/2009/12/bookmarking-widget-for-blogger-bookmark.html" target="_blank"]Social Bookmarking Widget For Blogger[/a]
  • [a href="http://www.mybloggertricks.com/2009/12/add-css-based-social-bookmarking-widget.html" target="_blank"]Add CSS Based Social Bookmarking Widget To Blogger[/a]
  • [a href="http://www.mybloggertricks.com/2011/05/facebook-social-bookmarking-widget.html"]Facebook Social Bookmarking Widget[/a]
Source: http://www.mybloggertricks.com/2011/05/social-share-widget-with-counters-for.html

Add Facebook Like and Send Button To Blogger Blogs

FACEBOOK-LIKE-AND-SEND-BUTTONIn our [a href="http://www.mybloggertricks.com/2011/05/add-facebook-send-button-to-blogger.html" target="_blank"]previous post[/a] we learned how to add Facebook Send button to blogger but just recently Facebook combined the Like and send button into a single plugin, making it more easy to add both the buttons with a single code. Further the like button is equipped with an additional comment functionality i.e. The visitors can comment on what they liked just under the button. Lets add this beautiful plugin to blogger.[a name='more'][/a]

Add The Facebook Like and Send Button To Blogger

  1. Go To Blogger > Design > Edit HTML

  2. Backup your template

  3. Click Expand widgets templates box

  4. Search for <data:post.body/>

  5. and now if you wish to add the plugin just below your post titles then add the giant code below just above <data:post.body/> or if you wish that the plugin may appear at the end of your posts then paste the following code just below <data:post.body/>


<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="" send="true" layout="button_count" width="450" show_faces="false" font=""></fb:like>


  6.  Hit save and you are done!

We hope you will enjoy reading these posts too,

  • [a href="http://www.mybloggertricks.com/2011/04/add-floating-facebook-like-and-retweet.html" target="_blank"]Add Floating Facebook Like and Retweet Counters To Your Websites[/a]
  • [a href="http://www.mybloggertricks.com/2011/05/facebook-social-bookmarking-widget.html" target="_blank"]Facebook Social Bookmarking widget[/a]
  • [a href="http://www.mybloggertricks.com/2011/05/social-share-widget-with-counters-for.html" target="_blank"]Social Share Widget With Counters For Blogger[/a]

If you faced any problem, please do not hesitate to let me know. :)

Source: http://www.mybloggertricks.com/2011/05/add-facebook-like-and-send-button-to.html

How To Create a Google Profile Page?

google-profilesOn April 21, 2009 Google Inc. introduced the "Google Profile". Google profile is more like creating your online portfolio where people can read about you in detail. You can write about your work experience, location, education and business. Most importantly you can add dofollow links to your websites. When people search for your name, your profile will appear at the bottom of the search results if you are one of the top matches. The new Google buzz service can be used only if you have a Google profile where people can follow you and keep themselves up to date with your daily buzzes. In order to create your Personal Google Profile Page then Kindly follow the steps below,

[a name='more'][/a]


How To Create a Google Profile Page?

Source: http://www.mybloggertricks.com/2011/05/how-to-create-google-profile-page.html

LOCK and UNLOCK Blogger Widgets

    3.  Simply note down the widgetID which in my case is HTML12. You widget ID is one that appears between widgetid= and &action

The Widget that you want to lock looks like this in UNLOCK mode,





    You can clearly see that there are three buttons which are REMOVE, CANCEL and SAVE

    Now we want to delete the REMOVE button so that the widget could only be edited but not removed.

    4. Now go to Blogger > Design > Edit HTML

    5. Backup your template

   6. Search for your widget ID. (In my case I will search for HTML12 

   7. You will find a code similar to this,

<b:widget id='HTML12' locked='false' title='Subscribe Now!' type='HTML'/>

   8. Now to LOCK the widget simply let locked to  true 

   9. Save your template and Your Widget is now LOCKED.

Go to Page Elements section and you will see that your widget has no REMOVE button now.




To UNLOCK the widget back, simply repeat the same process and change locked to  false

That's all! Have fun :>

Source: http://www.mybloggertricks.com/2011/06/lock-and-unlock-blogger-widgets.html

Download 25 Free PayPal Donate Buttons!

free Paypal ButtonsAdding a PayPal donate button has become a formality now for all webmasters. I have shared a tutorial earlier on [a href="http://www.mybloggertricks.com/2010/12/add-customized-paypal-donate-button.html" target="_blank"]how to add a PayPal Donate button to your Blogger Blogs[/a] and now its time to replace the default PayPal donate button with a stunning and eye catching one. I hope you will like the collection below which is gathered from different sources and is not the property of MBT Blog. They are shared only for non-commercial purposes.

[a name='more'][/a]



Those of you who don't have a windows live ID can download it from here,

2 3
service_paypal_add paypal-icon3
paypal-icon5 paypal-icon4
Paypal-icon1 paypal-icon
paypal333 Paypal-64
paypal33 paypal22
paypal2 paypal_straight
paypal1 paypal_curved_32px
grey_paypal_stamp Honeycomb-Paypal-64
paypal3 credit_card_paypal
Source: http://www.mybloggertricks.com/2011/06/download-25-free-paypal-donate-buttons.html
Play : Agame | Y8 Games | Y3 Games
Copyright © 2011. Blogger Tips And Tricks 2012 - All Rights Reserved

Proudly powered by Blogger