Labels with Hovering Effect | InfoTechBlogging InfoTechBlogging: Labels with Hovering Effect

Posted by Syed Muhammad Ali


Today we are sharing an awesome customized label widget for Blogger. This is a simple widget and uses Label widget made by Blogger.

This widget would allow visitor to find categories of your Blog. Using this widget would make your Blog attractive
 
Follow the below steps to Convert your Blog Labels into an Attractive Style
 

⦁ Go to Blogger

⦁ Log-In to your Dashboard

⦁ Go to  Template section

⦁ Click Edit Html

⦁ Find ]]> inside template

⦁ Paste the Below code Just Above ]]>
 
.Label li {float: left;padding: 3px!important;margin: 0px!important;border: 0px!important;}.Label li a:hover {background:#8542AC; color:#fff!important;}.Label li a {float: left;background: #2b3743;padding: 8px 10px 8px 10px;border-radius: 4px;color: #fff!important;

}

⦁ Save your Template    

⦁ Now Go to your Blog Layout

⦁ Navigate to Sidebar Section

⦁ Click Add Gadget

⦁ A popup will open, Select Labels Widget from the List

⦁ Save the Widget by using the Settings shown in Below Image
                         
⦁ Save the Widget

Congrats! You are done. You can see this awesome widget on your Blog.

I hope you like this widget. Ask any Queries related to this widget in below comments
    

Follow Us!

About This Blog:
InfoTechBlogging is owned by Syed Muhammad.Ali who loves to help other bloggers in starting their Blogging career. He also share Blogger Widgets and Templates.
Follow Him at : Google |Facebook| Twitter