Add a Stylish Cool Effects for Blogger Label.Here i will explain you gow to add Labels and How to Customize it with Stylish Effects.Just Follow my steps carefully Then it will be easy For You!
Step1: Go to Blogger Dashboard and Then Layout--> Add a Gadget--> Label (If you don't Undertsand this Please See the Image Below.
Step2: Now a Pop-up Will open Will Label Options. Then Now to Add a Stylish Label Change the Display Option from List to Cloud.
Step3: Now go to Template Which is on the Left Pane of Dashboard. Then Click on Edit HTML
Step4: Now Search for the following code by Pressing Ctrl+F.
Step1: Go to Blogger Dashboard and Then Layout--> Add a Gadget--> Label (If you don't Undertsand this Please See the Image Below.
Step2: Now a Pop-up Will open Will Label Options. Then Now to Add a Stylish Label Change the Display Option from List to Cloud.
Step3: Now go to Template Which is on the Left Pane of Dashboard. Then Click on Edit HTML
Step4: Now Search for the following code by Pressing Ctrl+F.
]]></b:skin>
Step5: Now Place the Below Code Just Above
]]></b:skin>
/* Colorful Label Widget By www.wwesnaps.blogspot.Com —————- */.sidebar .label-size {position:relative;text-transform: uppercase;text-decoration:none;font-size:13px;font-family:Open Sans;color:#fff!important;}.sidebar .label-size a {color:#fff!important;font-weight:bold;padding:8px 10px;margin:0 6px 6px 0;float:left;display:block;-moz-transition: all 0.4s ;-o-transition: all 0.4s;-webkit-transition: all 0.4s ;-ms-transition: all 0.4s ;transition: all 0.4s ;}.sidebar .label-size-1 a {background:#1abc9c;border-bottom:3px solid #127F69;}.sidebar .label-size-1 a:hover {background:#16a085;}.sidebar .label-size-2 a {background:#3498db;border-bottom:3px solid #226693;}.sidebar .label-size-2 a:hover {background:#2980b9;}.sidebar .label-size-3 a {background:#2ecc71;border-bottom:3px solid #1F8C4C;}.sidebar .label-size-3 a:hover {background:#27ae60}.sidebar .label-size-4 a {background:#9b59b6;border-bottom:3px solid #74398E;}.sidebar .label-size-4 a:hover {background:#8e44ad}.sidebar .label-size-5 a {background:#e74c3c;border-bottom:3px solid #922C20;}.sidebar .label-size-5 a:hover {background:#c0392b}
Now its All over Reload you blog and Enjoy this Awesome Widget. :) Cheers..!!
Post a Comment