Saturday, March 24, 2007

How To Means Labels Inwards Blogger

By default, Blogger allows you lot to adjust your content into categorize amongst the assistance of labels. It is e'er considered equally a handy practise to label your posts to a specific category thence that users tin dismiss easily detect relevant content non past times searching your whole spider web log but past times looking into a specific label or a category.  This makes your site to a greater extent than user friendly, but also useful for search engines too. You tin dismiss display labels inwards the sidebar or anywhere inwards your site which are listing or cloud style. In this article, nosotros volition demo you lot how to mode labels inwards blogger.

Before you lot larn started amongst this tutorial, nosotros would recommend you lot to larn through how to add together labels inwards your posts thence that you lot tin dismiss sympathise amongst a lot to a greater extent than authority.

Display All Labels amongst Post counts inwards Blogger:

Some pop sites tend to display all labels on their fault or non works life pages to render users a few laid upwards of options that they tin dismiss utilization to detect a relevant topic. However, around sites display them inwards either sidebar or footer thence here’s how you lot tin dismiss display all labels amongst ship service counts inwards a cast of label cloud:

Go to Blogger >> Add a gadget >> Labels >> (Select label cloud inwards types) too salve the widget. Now it depends on you lot where you lot would similar to house it either inwards the sidebar or footer.

Now you lot mightiness meet a label cloud on your site afterward next the inwards a higher house pedagogy but it may non last equally pretty or attractive equally you lot mightiness last looking for thence add together the next CSS coding inwards your template merely inwards a higher house the pare tag.

/*--- MBL Custom Label Cloud With CSS3 --- */
.Label a {
    padding-left: 20px;
    background: #000;
    padding: 0 20px;
    color: #fff!important;
    border-radius: 100px;
    -moz-border-radius: 100px;
    height: 32px;
    line-height: 32px;
    text-transform: uppercase;
    text-decoration: none;
    border: none !important;
    -webkit-transition: all .3s ease-in-out !important;
    t: 30pxt: 30px;
    float: left;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 14px;
}

.Label a:hover {
    color: #000 !important;
    background: #ff0;
}

You tin dismiss e'er customize the CSS according to your likings, here’s a demo of what you lot volition meet afterward applying the inwards a higher house code inwards your template.
 Blogger allows you lot to adjust your content into  How to Style Labels inwards Blogger

Styling Labels inwards your Posts Meta Information: 

The bulk of Blogger templates comes amongst a nicely mode ship service information meta information that displays labels that you lot get got tagged your ship service amongst inwards ship service editor. However, around one-time templates don’t get got this functionality or if they do they are non attractive anyway, or you lot may similar to mode them differently.

The rattling starting fourth dimension matter you lot demand to do is to accept tending of which CSS Class or ID that is been used past times your blogger template to display labels. You tin dismiss utilization Google Chrome’s inspect chemical component to figure that out.  Right click on the label too choose “Inspect elements” this volition opened upwards up a window at the bottom of your covert merely equally it is shown inwards the screenshot below:
In the inwards a higher house screenshot, you lot tin dismiss meet the theme is using tags for CSS class. Now you lot tin dismiss utilization the next CSS code to mode it according to your wish needs too requirements. Note: if you lot are using whatever other class or ID too thence merely edit the CSS accordingly.

.meta_categories {
    float: left;
    margin-bottom: 10px;
    text-transform: uppercase;
    width: 100%;
    font-size: 14px;
}
.meta_categories a {
    text-decoration: none;
}

This is the destination lawsuit of what you lot volition meet on your site.  However, you lot tin dismiss customize it according to your likings.
We promise this beginner’s lead to mode labels inwards blogger would get got helped you lot inwards non exclusively customizing your template but also around blogger template developers who expire along on quest that how to display labels inwards posts inwards blogger. 

No comments:

Post a Comment