Latest Posts :

Stylish Custom Label Cloud Widget With Hover Effect for Blogger

Share It! LinkedInFacebookPinterestTwitterGoogle+RedditDiggStumbleUpontumblrflattr

Today I am going to share a nice label cloud widget with hover effect for blogger. This Label Widget look Gorgeous And Cool. This widget Specially created only For Blogger. Blogger Tag Clouds are used to show all the categories or labels present in the blog. By default blogger comes with simple design they do not look beautiful. But we designed our labels widget like CSS buttons, which will be looking attractive more than the default blogger labels cloud widget style. you can see preview in our screenshot image to know how is this is. I hope you will like it.
Please Note:- Before applying this label widget you must set your label style to cloud & backup your template for safety.
Click here for backup your Template

How To Add Custom Label Cloud Widget

To add this Widget in your Blog Follow the simple steps carefully.
  1. Sign in to your Blogger Dashboard then go to Layout & click Add a Gadget option and select Label.
  2. Now set the settings which are shown in the screenshot below.
  3. You must Select the cloud option from the display settings.
  4. Now click Save button & go for CSS.
  5. Now click Template option & then click Edit HTML button.
  6. Now press CTRL+F button in your keyboard & find ]]></b:skin> tag.
  7. Now Copy the below code and paste it above ]]></b:skin> tag.
  8. /*Stylish Custom Cloud Labels Widget by Manoj Paul----------------------------------------------- */ .label-size{ padding: 3px; text-transform: uppercase; margin:0 2px 6px 0; border: solid 2px #061ED5; border-radius: 3px; float:left; text-decoration:none; font-size:14px; color:#000000; background: #000000 ; } .label-size:hover {background: #0faefd ; border:5px solid #000000; text-decoration: none; -o-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; transition: all 0.5s ease-out; -o-transform: rotate(7deg); -moz-transform: rotate(7deg); -ms-transform: rotate(7deg); -webkit-transform: rotate(7deg); transform: rotate(7deg); filter: progid:DXImageTransform.Microsoft.Matrix( M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand'); zoom: 1; } .label-size a { text-transform: uppercase; float:left; text-decoration: none; color:#0FAEFD; } .label-size a:hover { text-decoration: none; color:#000000;}
  9. Now click Save template button & view your blog.
If you face any problem, then leave a comment bellow and if you get this post is helpful then kindly share this post on your network or social network sites. Thanks for visiting my page.

If u like this post then please share it on your social network!
Powered By: Blogspot Blog Tricks


  1. Hi Dear Admin, Thank you so much for everything that you share.
    Thank for your beautiful label widget and I really appreciate for that. And Could I reguest you some help, please?
    Now,my blog is getting full of mess.
    I used the template from and it just show 4 post, and I would like to
    remove the credit link and I would change the number of post into 12 posts, What should I do?
    Please help me! I'm not a professional blogger or not an advanced blogger, just a
    beginner from Myanmar.
    I expect that some nice advice will come from you.
    Thank you.

  2. Hi,Thankyou for this informative article. Explain every thing very well, if you want any service regarding web services or cloud services visit here

  3. Wow, this tutorial worked perfectly on my blog Thanks Manoj!



  • Latest Widgets

    Latest Widgets

    Blogspot Blog Tricks is a blog from where you can get all the tricks, gadgets, templates, widgets and tutorials for your blogger blogs.

  • Why GoDaddy

    Why GoDaddy?

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

  • Buy Domain 35% off

    Buy Domain or Hosting server from Godaddy. Visit the upper Image for 50% off in Hosting & the text link for 35% off in any Products.

  • Facebook Tips & Tricks

    Facebook Tips & Tricks

    Facebook is the worlds best social networking site.We use facebook in daily life.We can use many tricks in facebook.Visit here and use tricks in your facebook.

  • Download & Play

    Download latest software, games, movies, music & many more. Play online latest movies & musics & games.

Subscribe For Free Updates!

We'll not spam mate! We promise.

Go To Top