Make a cool multicolored Brick or Box Style labels or tags

Comments: 0
data:blog.title
blogger hack

Make cool style multicolored Brick or Box Style labels You have already seen in many website different colorful labels in brick or box style. But it is generally increase the site loading time as a result your blog site become slower. So I am explaining a tutorial that how you can make a fast loading multicolored labels.



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 Find this code ]]></b:skin>  by pressing Ctrl+F

Step 4 Paste any code from below Before/above ]]></b:skin>

Style 1

royal blue color labels

#Label1 a{     color:#333;     padding:2px 8px;     line-height:24px;     margin:0 2px;     background:#eee url(http://4.bp.blogspot.com/-Txy4Bb2Mlmk/UMLCOMGHAcI/AAAAAAAAAXE/biFGGIGrr5E/s320/blue%2Bbrick.png) center center repeat-x;     border:1px solid #ddd;     -webkit-border-radius:6px;     -moz-border-radius:6px;     border-radius:6px;     font-size:10px !important;     text-decoration:none;}     #Label1 a:hover{     color:#666;     background:none #fff;     text-decoration:none;}

Style 2

 
mash color labels



#Label1 a{         color:#333;         padding:2px 8px;         line-height:24px;         margin:0 2px;         background:#eee url(http://1.bp.blogspot.com/-da_pNWytnys/UMLCNS17rKI/AAAAAAAAAW4/3RFW0PXmA1s/s1600/mash%2Bbrick.jpg) center center repeat-x;         border:1px solid #ddd;         -webkit-border-radius:6px;         -moz-border-radius:6px;         border-radius:6px;         font-size:10px !important;         text-decoration:none;}         #Label1 a:hover{         color:#666;         background:none #fff;         text-decoration:none;}   



Style 3


yellow color tags




#Label1 a{         color:#333;         padding:2px 8px;         line-height:24px;         margin:0 2px;  background:#eee url(http://4.bp.blogspot.com/-tyfp0jTUg34/UMLCOzaMZXI/AAAAAAAAAXQ/AwJWXLS5pw4/s1600/yellow%2Bbrick%2Blabel.png) center center repeat-x;        border:1px solid #ddd;         -webkit-border-radius:6px;         -moz-border-radius:6px;         border-radius:6px;         font-size:10px !important;         text-decoration:none;}         #Label1 a:hover{         color:#666;         background:none #fff;         text-decoration:none;}
 

 Step 5  Now Click  Save Template.

Speak Your Mind

Facebook Group Community Code ConverterHide Code Converter Show EmoticonHide Emoticon

If you Got questions? Ask ’em below! While we’re here, you might like to leave a comment and let me know if you have any stories or questions.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form

Name

Email *

Message *