How to Design Blogger Labels Like Buttons with CSS3?
Designing of blogs is very important and now very easier in now-a-days. You can design your blogs with beautiful CSS3 codes.You can Design every part of your blogs. Now you can design your blogger label like buttons with CSS3 code.Blogger labels are the links or tags which we can add to our side bar of blogs for easy user navigation. By add they don't look so good and now by this CSS code blogger labels are looks very good and blooger labels looks attractive and so good. We will design our blogger labels to make so attractive. So lets start the procedure.
Example
How To Design Blogger Labels Like Button ?
To Design Blogger Labels Follow these steps
- First log into blogger.com and choose your blog.
- Go to Template >> HTML >> Proceed.
- By using CTRL+F key find this code ]]></b:skin>
.cloud-label-widget-content span a{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;}.cloud-label-widget-content span a: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); }
Now save the template
How to Add Label Widget
4. If you already added label widget then its ok, just make this setting. In display there are two options List and Cloud. You Select Cloud and un-check the number of post
In case if you have not added label widget in your blog. Just go to Blogger Layout>>Add a Gadget>>pop up window will appear. scroll down and click on the label widget, just click on it and add it .
See below image for the correction