Friday, October 14, 2016

How to make two columns section categories or label in blogger?

Blogger blog called Label Widget is a job too. Using a blog before it can be presented to all readers Label funds. As a result, readers can easily read the posts of Label as its choice. By default, the widget does not seem so attractive to so many people do not want to use it. However, it needs someone that can design their liking. We are considering the choice of two designs share the widget.  

We'll post the two designs share. We'll show you two different ways to share designs in two parts. Now we will method adding list label for your blog widget. However, this method has been added to my blog site.
  • Please login first blog.
  • Click Layout from the Blogger dashboard.

  • Layout of the blog in the sidebar and click on Add Gadget.
  • Label Widget Clicking on the icon you will see the option as shown below.

All options can customize the image at the top of your mind. Display the List option will not only be able to change. Changing the style codes will not work.
  • Then click the Save button orrange color.
  • Be the Blogger Dashboard Template> Edit Html button.
  • From the keyboard by pressing Ctrl + F section of the search ]]></b:skin>
  • The following codes are now Css ]]></b:skin> tag on the paste.
  /* Sidebar List Label
-------------------------------------------------------- */
.Label h2{background:#009688;border-bottom:3px solid #9BD2F4;margin:0 0 10px;padding:8px 10px 8px;color:#fff;font-size:16px;line-height:16px;font-family:"Oswald",sans-serif;font-weight:bold;text-decoration:none;text-transform:none}
.Label h2:before{content:"\f02c";color:#fff;font-size:16px;font-family:FontAwesome;font-style:normal;font-weight:normal;text-decoration:inherit;margin-right:10px;margin-left:2px}
.label-size a,.label-size span{display:inline-block;color:#666;padding:10px 12px;font-weight:400}
.Label ul{margin-left:10px}
.Label ul li{background:url("") no-repeat scroll 0 2px rgb(255,255,255);list-style-type:none;padding-left:20px;margin:0 0 5px}
.Label li{background:#fff;color:#1359ae;float:left;padding:5px;margin-left:3px;text-align:left;width:40%;transition:.3s linear;font-size:13px}
.Label li a{color:#1359ae;transition:.3s linear}
.Label li a:hover{color:#FF0900;text-decoration:underline}
.label-size{background:#fff;color:#666;border:none;display:block;float:left;margin:0 3px 3px 0;font-size:11px;transition:all 0.8s linear}
.label-size a{display:inline-block;color:#666;padding:10px 12px;font-weight:400;transition:all 0.8s linear}
.label-size a:hover{background:#eac965;color:#fff;transition:all 0.1s linear}
  • Finally Template Save and Quit. Label design of your blog will change.
Previous Post
Next Post

Show Comments: OR

0 comments: Post Yours! Read Comment Policy ▼
Attention Please
No comments that are not related to the post can be made. Do not share your blog link without any reason. Always try to give positive comments. We evaluate all opinions equally and try to answer them in due course.

Post a Comment

Copyright © Poisa Click Registered Surf. Modified: PC Team, Server Hosted: GSE