12 February 2013

How Use CSS Brick Style Label Cloud Widget For Blogger

Tuesday, February 12, 2013 By , No comments
Namecheap.com - Cheap domain name registration, renewal and transfers - from only $3.98/Year

Professional CSS Cloud Label Style For Blogger


CSS Brick Style Label Cloud For Blogger Blog #2Hi all Users,in this Post i am going to share a how to add Professional CSS Cloud Label Style For Blogger.few weeks ago i posted another beautiful Label Style.well this is also blogger label customizing tutorial with some different style .
Follow below simple steps to add this.

 




How To Add Brick Style Labels Cloud In Blogger Using CSS


1. Log in to blogger >> Go to Design >> Edit HTML

 

2. Find ]]></b:skin>  by using Ctrl+F

3.Paste below code Before ]]></b:skin> code
 /*-----Custom Labels Cloud widget by www.egytricks.com----*/
.label-size{
margin:0 2px 6px 0;
padding: 3px;
text-transform: uppercase;
border: solid 1px #C6C6C6;
border-radius: 3px;
float:left;
text-decoration:none;font-size:10px;color:#666;}

.label-size:hover {
border:1px solid #6BB5FF;
text-decoration: none;-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-ms-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;
}.label-size a:hover {
text-decoration: none;
}


4. Now all done save the Template ..Comment if you got any problem ..

Note:-Make sure you are not using any another label customizing code,if you using remove the old code then use this ..

Please Share it! :)

0 comments:

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. Please do not spam Spam comments will be deleted immediately upon our review.

Regards,
Imtiaz Ahmed

Popular Posts

Recent Post


Recent Posts Widget | IBT