How To Add Flat Colorful Cloud Label Widget In Blogger

0
install add stylish beautiful custom label widget in blogger template
Hello Folks, Today in this article we are going to explain How to add Flat Colorful Label Widget in blogger template.You might have noticed in other websites that there tags or categories looks in different style.In this gadget we have used pure CSS for styling.However you can change the color according yourself.Blogger default cloud label widget is very simple and does not suits any blogger website niche.This widget looks like diamond shape and definitely increase the look of your blogspot blog.In order to increase page views of your website you must install categories section so the visitors can understand the topics of your website.In previous post we have shared Adding drop down function on blogger labels.So to give stylish on your labels you must install flat colorful label widget in your blogger template.To create widget follow the steps mentioned below.

How to Create Flat Cloud Colorful Label Gadget In Blogger Template

Installation Steps:
Step 1. Log in to your Blogger account and Go to your Blogger Dashboard.
Step 2. Now Click on -> Template -> Edit HTML.

Step 3. Now Search for ]]></b:skin> or </style> by Pressing Ctrl+F keys.

Step 4. Now Copy the below CSS and paste it just before/above </style> or ]]></b:skin>.


/*Flat Cloud Label Widget By www.Bloggersstand.com*/
.Label a{
padding-left: 5px;
padding-right: 31.5px;
color: #fff!important;
height: 32px;
background: #63953D;
margin-right: 2px;
line-height: 28px;
text-decoration: none;
border: none !important;
-webkit-transition: all .3s ease-in-out !important;
float: left;
margin-top: 2px;
font-size: 12px;
text-align: left; }
.Label a:hover{
color:#fff !important;
background:#8ED557; }
.Label a:after{
content: "";
position: absolute;
width: 0px;
height: 0px;
border-width: 16.5px;
border-style: solid;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.3) rgba(0,0,0,0.1) transparent;}

Customization:
  • To Change the background color replace 63953D with your desired color.
  • To Change the Hover background color replace 8ED557 with your desired color.
  • You can choose colors from color wheel picker or color code generator.
Step 5. Now Save your Template..Done !
learn trick to add install flat cloud ui color label widget in blogger template.Custom labels gadget for blogger template.stylish beautiful label design diamond style for website.
Hello Folks, Today in this article we are going to explain How to add Flat Colorful Label Widge...
SUMMARY

learn trick to add install flat cloud ui color label widget in blogger template.Custom labels gadget for blogger template.stylish beautiful label design diamond style for website.

You Might Also Like:

We hope this article helped you to learn How To Add Flat Colorful Cloud Label Widget In Blogger. If you have any question or any complication please don't hesitate to ask us.You can drop your message below in the comment box or you can Contact Us!. If you liked this article please join us on : Facebook | Twitter | Google+

SUBSCRIBE ARTICLES BY EMAIL

Post a Comment Blogger Disqus

0 Comments on "How To Add Flat Colorful Cloud Label Widget In Blogger" So Far
Out Of Topic Show Conversion CodeHide Conversion Code Featured Post

MARKUP FOR WRITING COMMENTS:
1. To Insert Code Length Use<i rel="pre">Code Here</i>
2. To Insert Short Codes Use<i rel="code">Code Here</i>
3. To Insert Quote Use<b rel="quote">Quote</b>
4. To Insert Image Use<i rel="image">Image URL</i>
5. To Insert Video Use<i rel="youtube">You Tube Url</i>

Note: You Can Also Convert Your Code Directly From The Conversion Box.
--------------------------------------------------------------------------------------------------------------------------------------------------------
Please drop your comment according with the topic and feedback with hyperlinks may be removed.Thank you.
Regards:
Team Bloggersstand