Blogger Simple Label widget with Drift Effect

Simple Label widget with Drift Effect

0
data:blog.title
label widget

Label widget is good for blog navigation. But blogger default label is not so attractive. For this reason many blogger coding to make some variation on it. I have designed this label widget with hover effect. Which will make little attractive to visitors. This label widget would be simple and clean style on normal mode but when you will mouse over on widget then it will change color. Added a black pipe on the right side of the each label. Hope you would like this label widget. Previously I have designed many label widget but has choose orange color as trendy style. And this widget has created with pure CSS coding. So to install this widget simply follow the simple steps from below.


Step 1 Log in to your Blogger account and Go to your Blogger Dashboard

Step 2 Go to your Layout tab.

Step 3 Click on "Add a Widget" then select "Label" Widget (Select Cloud Style).


bloggerspice.com


Step 4 Now click on -> Template -> Edit HTML-> Unfold code  

Step 5 Now Find this code ]]></b:skin> by pressing Ctrl + F

Step 6 Paste the below code  Before/above ]]></b:skin>

/* Simple Label Widget by www.bloggerspice.com */
.Label li {
background: none repeat scroll 0 0 #EEEEEE;
border: 0 none;
color: #666666;
margin: 0 1px 1px 0;
padding: 0;
text-decoration: none;
}
.label-size a {
background: none repeat scroll 0 0 #EEEEEE;
border-bottom: 0 none;
border-image: none;
border-left: 0 none;
border-top: 0 none;
color: #666666;
float: left;
font-size: 12px;
margin: 0 5px 5px 0;
padding: 10px;
text-decoration: none;
}
.label-size a:hover {
background-color: #fd4326;
color: #fff;
text-decoration: none;
-webkit-transition: all .2s ease-out;
-moz-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .2s ease-out;
border-right: 5px solid #333333;
}


If you need any help then feel free to contact with me. I will get back  to you as soon as possible. 
Blogger Simple Label widget with Drift Effect
4 Stars stars - "Blogger Simple Label widget with Drift Effect" Label widget is good for blog navigation. But blogger default label is not so attractive. For ...

Post a Comment

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

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 *