September 7, 2011

Widgets

Make a Button Badge For BlogSpot and Wordpress


blogspot button makerYou have seen many blogs and directories using a small button for their promotion. You can see one for mbt too. This micro button comes in 80X15 pixels in size. I would create such buttons using Photoshop but amazingly thanks to dynamic drive you can now create a button online easily. The button maker tool provides you with multiple options of making a good looking button or badge for your blogger blogs or wordpress blogs. You can choose border style, background colors, font type and text. This tool is extremely easy to use and no expert tech skills are required to design a button. However I will be sharing some tips which could be helpful for most of you.

 

How to Design a good looking Button?

The tool lets you create "XHTML valid" micro buttons (80x15). We also use the larger sized 88x31 button instead. Follow these tips:

  1. Check Base Color is Transparent
  2. Uncheck "Border Color is Transparent"
  3. Choose "Button Size" as 80 by 15 pixels
  4. Keep "Border color" equal to #dddddd
  5. To change a color, simply click on a particular box(where color code is mentioned) and then drag your mouse over the Color Picker tool to choose your preferred color.
  6. Keep clicking the "update" button to see live previews
  7. Now right a small abbreviation for you blog e.g: MBT     (LEFT SIDE TEXT)
  8. And right your main keyword on the RIGHT SIDE TEXT e.g: Widgets
  9. If your left side text didn't fit in a column perfectly then increase the "Vertical Bar Position"
  10. When you are satisfied click the update button and then right click the image to save it.

How to use this button to promote your blog?

Now to link your blog to the button you need a HTML code which is shared below.

<a href="BLOG LINK" ><img  border="0" src='BUTTON LINK' rel="BLOG KEYWORD"/></a>

Replace BLOG LINK with your blog URL

Replace BUTTON LINK with the URL of your uploaded button on blogger

Replace BLOG KEYWORD with a keyword that describes your entire blog content. In my case it is "Blogger Widgets"

 

Use this HTML code and share it with your readers so that they could help you better promote your blog. I just hope this little tool will be useful for everyone who was looking for an easy way to create it. Have fun! :)




If you enjoyed this post and wish to be informed whenever a new post is published, then make sure you Subscribe to our regular Email Updates!

If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »

11 comments:

Luckshya Garg on Sep 8, 2011, 4:38:00 PM said... #

these buttons are really cool.thanks a lot for this.

M.Pinto on Sep 11, 2011, 3:27:00 AM said... #

Thanks bro.. Just created one.. :)
M.Pinto from www.ProHacker.IN

Rout on Oct 12, 2011, 7:08:00 PM said... #

Hello Mohammad I have made a blogregarding jobs in Orissa http://latestjobsinorissa.blogspot.com/

Can u tell me to improve the site
anrout22@gmail.com

Mr Fix on May 1, 2012, 12:23:00 PM said... #

I like these buttons. It's good to have one for the blog.

DebbieNavarro.Blogspot.com on May 4, 2012, 2:50:00 PM said... #

Can you share the HTML code for This Gif image? the confused gif.thanks

kiran on May 17, 2012, 11:21:00 AM said... #

hai,google ads not display my blog...http://vidyarthiplus.blogspot.in
google ads team does not accept my blog why...

Duhaz on Jun 22, 2012, 7:49:00 PM said... #

this is superb post this post help me so much i am new in internet world i like it bro so much.


Kind regards
odesk test answers

Debarpan Mukherjee on Oct 9, 2012, 9:53:00 AM said... #

very good post sir.I just love ur blog.TechTrickHome

Rajat Garg on Dec 6, 2012, 12:12:00 PM said... #

nice one dude
Blogger Tips And Tricks

bestlodge.blogspot.com on Feb 16, 2013, 12:09:00 PM said... #

Good post....
www.bestlodge.blogspot.com

murali on May 18, 2013, 9:59:00 PM said... #

e Books For UPSC Civil Service Exam 2013. Discover more on Books For UPSC Civil Service Exam 2013. Find more on Books For UPSC Civil Service Exam 2013.
Books For UPSC Civil Service Prelims and Main Exam 2013

Click Here To add Comment

Confused? Feel free to ask

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.

Note:
1. To add HTML CODE in comments then please use our HTML Encoder
2. You can always Test the tutorial on our HTML Editor
3. No cheesy/spam Comments tolerated Spam comments will be deleted immediately upon our review.

Regards,
Mohammad

Support Us

If our Tutorials have helped you a little, then kindly spread our voice using the badge below:-

or try a Beautiful Banner


Widgets

 
  • MBT Icons and buttons

    Icons and Buttons

    Our resources have been successfully downloaded over 10K times and found almost every where. Get yours!

  • choosing webhost for a blog

    Why HostGator?

    Learn Why we chose HostGator as our Web Host and find discount coupons to kick start your blog today!

  • SEO Settings for blogger

    ALL IN ONE SEO PACK 2012

    Learn every single SEO tip that will boost your blog's ranking and organic traffic. We got them all!

  • Blogger widgets and plugins

    Visit MBT's Blogger LAB

    Why not take a tour of all great Blogger widgets published so far? You Name it we have it!

  • become a six figure blogger!

    Become a SIX FIGURE BLOGGER

    Learn what it takes to become a successful entrepreneur and build a living online!

About The Author

Hi! I am Mohammad, a certified SEO Consultant, Pro Blogger, Computer Engineer and an addicted Web Developer. Read More..

Recipes

SEO Affiliate Marketing Social Media

Make Money Online Web hosting

Blogging Tips Web Designing

Plugins and Widgets Blogging Ethics

Recent Comments

Popular Series

Powered by:

My Blogger Tricks © 2013. All Rights Reserved | Contact |