Customize Popular Posts Widget in Blogger with CSS Computer IT Help 86 | Best Urdu & Hindi Tutorials

Ads

 

Customize Popular Posts Widget in Blogger with CSS
Blogger blog each element is to change what with CSS and JavaScript. There are many needs in the blogger may want to customize or make them more beautiful. This theme is a popular flash messages on the blogger. Even today is very simple and something popular blogger on the allocation of widgets. This piece comes by default in every blogger and custom forms. In the beginning, it is simple and has no attraction. But, using the trick today, you can make it more attractive and appealing.

Tip No,01.How to Change Popular Posts widget in Blogger Blog,s By Saftain Azmat?

We will begin to do things in this tutorial. Follow these simple steps to change the flash popular blogger posts your:

  1. Log in to Blogger dashboard
  2. Go to the page template blog
  3.  Click HTML >>Click Continue
  4. Now find this code:]]> use CTRL + F
  5. Just above / before]]> paste the code below

.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNZSfpiGujzyJNxcKHtWqG3abAKLEi7CxXQQ2wGLwW7tBpSbUYK4Cr79u12fwQW9GGYoKbmAug9xzjxersfkwWjEfXDP551aGNkrGgvQUJPHQ1MXwlusR0yqStbXmTfZHzllEaMZhXfG4/s1600/1.gif) no-repeat scroll 5px 10px;
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 1px solid #ddd;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
.popular-posts ul
li:hover {
border:1px solid #6BB5FF;
}
.popular-posts ul
li a:hover {
text-decoration:none;
}
.popular-posts .item-thumbnail img {
webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}
Save your blogger template and you're done By Saftain Azmat!

Tip No,02.How to add a popular widget in Blogger Blog,s By Saftain Azmat?

In addition, popular blogger functions in the segment just go planning >> addition to segment and add the People's Posts List Widget widget and make the required modifications. See the picture below, for example:
Customize Popular Posts Widget in Blogger with CSS
To view the first line of the following your messages popular, and verification of fragments image boxes and a thumbnail of another display, select the number of messages that you want to display at the item and you can specify the time period to view the messages as popular as ever in the last 30 days and 7 days. After you add a widget you can drag anywhere on your blog, but if you're still in the bar next door, will look attractive.

Your thoughts:
Only a simple piece to add, and can also be customized. If you have any questions on this piece will let me know through a comment below this post.

Post a Comment

 
Top