Thursday, 21 June 2018

New Fashionable Pop Postal Service Widget Amongst Thumbnail For Blogger

Leave a Comment
Recently I shared a postal service on How to add together an advance random postal service widget inwards blogger blog. And inwards this post, I am going to laissez passer on you lot a novel fashionable Popular postal service widget alongside Thumbnail for your Blogger Blog. So if you lot desire to add together a fashionable Popular postal service widget to your Blogger blog. Then follow our below steps.
How to add together an advance random postal service widget inwards blogger spider web log New fashionable Popular postal service widget alongside thumbnail for Blogger

Add a fashionable Popular postal service widget alongside thumbnail to blogger blog.

  1. Go to the Blogger.com in addition to sign inwards your account.
  2. Now conduct your Blog where you lot desire to add together a fashionable Popular postal service widget.
  3. From your spider web log dashboard click on the layout option.
  4. From the sidebar department click on the Add Gadget link.
  5. Now a novel window volition appear on your screen. From this window conduct the Popular postal service widget in addition to add together it to your blog.
  6. After adding a pop postal service widget. Click on the template choice in addition to from the adjacent page click on the Edit HTML button.
  7. Search </b:skin> past times pressing CTRL+F. 
  8. After finding the </b: skin> glue the next code but earlier it.
.popularposts{line-height:1.5;color:#fff;font-size:100%;border-radius:10px 10px 0 0;}
 .popular-posts{font-size:100%;line-height:1.5;border-radius:0; color:#fff}
.popular-posts a{color:#fff} .popular-posts a:hover{color:#fff}
.PopularPosts ul{counter-reset:popcount;list-style:none;padding:0;margin:0;}
 .popular-posts ul li:before{counter-increment:popcount;list-style-type:none;margin:10px 15px 0 5px;padding:0.3em 0.8em;content:counter(popcount);color:#fff;font-size:16px;position:relative;border:1px enterprise #fff;border-radius:90%;float:right;}
 .PopularPosts li{background:none;list-style:none;display:block;text-transform:uppercase;padding:10px 18px;margin:0;clear:both;overflow:hidden;border-bottom:none;font:13.5px/140%;}
 .PopularPosts li a{text-decoration:none}
 .PopularPosts li:hover{background:#0FB9BB}
 #PopularPosts1 .widget-content{margin-bottom:-2px;padding:0px 0 0 18px;}
.PopularPosts ul li{padding:3px 7px;border:none} .PopularPosts ul li:nth-child(1){margin-right:0;background-color:#286dfa;} .PopularPosts ul li:nth-child(2){margin-right:0;background-color:#d20303;} .PopularPosts ul li:nth-child(3){margin-right:0;background-color:#20ba02;} .PopularPosts ul li:nth-child(4){margin-right:0;background-color:#d005a7;} .PopularPosts ul li:nth-child(5){margin-right:0;background-color:#03c6bf;} .PopularPosts ul li:nth-child(6){margin-right:0;background-color:#d9ba71;} .PopularPosts ul li:nth-child(7){margin-right:0;background-color:#2ba6e1;} .PopularPosts ul li:nth-child(8){margin-right:0;background-color:#718397;} .PopularPosts ul li:nth-child(9){margin-right:0;background-color:#11b7b5;} .PopularPosts ul li:nth-child(10){margin-right:0;background-color:#d9ba71;}
And you lot are done. Now take in your spider web log to encounter how is it looking. In illustration you lot volition larn an fault you lot tin sack driblet your comment I volition help you lot to cook it. Thanks for reading my this post. And Keep visiting for to a greater extent than useful posts. If this Post was Useful for You therefore you lot tin sack part it alongside your Friends past times pressing the Share Buttons.
If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment