Perfect
Cloud Label Style For Metro UI Blogger Template
This tips help you
custom your Label Cloud or Categories into a Metro UI Style Label same as
Windows 8 Only for Blogger & specially for Metro UI Blogger Template
1. From your Blogger
dashboard, go to Design and then Template.
2. Choose "Edit
HTML" then click on "Proceed".
3. Combine Ctrl+F,
look for ]]></b:skin> in your
blog’s template code.
4. Copy/paste the
following code below right above it.
/*--- TricksHunt.com
Custom Label Cloud --- */
.Label a{
padding-left:10px;
background:#0090D5;
padding:0 10px;
color:#fff!important;
height:26px;
line-height:26px;
text-decoration:none;
border:none !important;
-webkit-transition:all .3s
ease-in-out !important;t: 30pxt: 30px;
float:left;
margin-left:1px;
margin-top:1px;
font-size:13px; }
.Label a:hover{
background:#69625A;
-webkit-border-radius:
1px;
-moz-border-radius: 1px;
border-radius: px;
}
TIP: To
change the label color, simply replace #0090D5 with the corresponding HEX Code
Color Generator of your preferred color. To change the color of the label upon
mouse over or on hover, replace #69625A. You can also change 13px t adjust the
font size.
Save your
template.
Next, go to
Layout, click on the Edit button of your Labels gadget.
NOTE: If
you currently have no Labels gadget then just click on an Add a Gadget button
and then scroll down the list of gadgets and select Label.
Now follow
these Label gadget settings:
Title = Labels
Show = All Labels
Sorting = Alphabetically
Display = Cloud
Uncheck Show number of posts per label.
Save your gadget and you’re done.
View your blog to see the effect. Enjoy and
have a good day!
0 comments:
Post a Comment