There are thousands of ways to generate web traffic but the most effective method is to direct your readers to other articles,For better results direct to your best stuffs.
For that same reason,I use a WordPress Plugin called WordPress Popular Posts.This Plugin helps me to showcase best articles list on blog sidebar.The main reason for preferring WPP is, It offers loads of features,Like
- Related Posts with custom size Thumbnail
- Ability show posts according to Time range (Daily,Weekly,Monthly etc)
- Shorten the Title
- Show post excerpts
- Filter posts based on Category,Post Type and Author
- Show details like number of comments,Average Pageviews,date etc
So,WPP certainly a complete package for all your needs but you need to get your hands dirty with some CSS coding if you want ro match it with your theme style.This article will help you style WordPress Popular Post widget to grab your readers attention.
Its going to be a very simple tweak,We are going to remove the List style and add background color with some padding.You can see the preview of the style at the end of this article.
All you need to do is to paste the following code to your current Theme’s style.css file.
[css]
/*
WordPress Popular Post Style
Code by Vivek
Url : http://www.wpstuffs.com/
*/
#wpp-2 ul li {
list-style-type: none;
background: #06A2CB;
padding: 10px;
border: 2px solid #fff;
}
#wpp-2 ul li a {
color: #fff;
text-decoration: none;
font-size: 14px;
font-weight: bold;
}
#wpp-2 ul li:hover {
border: 2px solid #666;
background-color: #06A2CB;
opacity: 0.9;
-webkit-transition: 0.3s linear all;
-moz-transition: 0.3s linear all;
-ms-transition: 0.3s linear all;
-o-transition: 0.3s linear all;
transition: 0.3s linear all;
}
#wpp-2 ul li a:hover,
#wpp-2 ul li a:visited {
color: #fff;
}
[/css]
This is how it looks like
You can change the background color by changing the hex value #06A2CB,I personally use Colorcombos for Hex color code reference.Now share your custom WPP widget design with me through below comment form.
