Popular post horizontal line

Travelify
1

Hi Aigars,

I have one more question. I’m using “wordpress popular posts” plug-in, and I would like to have the 5 thumbnails in a horizontal line (not vertical as they are now) with the post titles under them rather than next to them.
I got a code below from a person who did exactly what I want, but it didn’t work in my Child theme style.css.

  • My current footer look : http://styleimported.net
    It worked perfectly in her website, so I’m not sure what I should change.

Also, how can I remove the dots “<” sign next texts in sidebar and footer?

As I’ve been asking so many questions, I’d love to donate to this theme. Would you let me know how? as I couldn’t find a place to donate.
Thank you so much for your time and support!

/*
Wordpress Popular Posts plugin stylesheet
Developed by Hector Cabrera

Use the following classes to style your popular posts list as you like.
*/

.wpp-list { /* UL element */
	
}

	.wpp-list li { /* LI - post container */
		overflow:auto;
		display:inline-block;
		float:none;
		clear:both;
width: 165px;
height: 220px;
	}

		/* title styles */
		.wpp-post-title {
width: 150px;
		}
		
		/* thumbnail styles */
		.wpp-thumbnail {
			display:inline;
			float:left;

			
padding-right:15px;
padding-bottom:5px;
padding-top:5px;
			border:none;
		}
		
		/* excerpt styles */
		.wpp-excerpt {
		}
		
		/* Stats tag styles */
		.post-stats {
			font-size:9px;
			font-weight:bold;
display:inline;
		}
			
			.wpp-comments {
			}
			
			.wpp-views {
			}
			
			.wpp-author {
				font-style:italic;
			}
			
			.wpp-date {
				display:block;
				clear:right;
			}
		
		/* WP-PostRatings styles */
		.wpp-rating {
		}
2

Add this code to Theme Options - Other - Custom CSS.

.col-3 {
    width: 100%;
}
.col-3 .widget ul li {
    list-style: none;
    background: none;
}
.col-3 .widget ul li a {
    display: block;
}
.wpp-thumbnail {
    display: block;
    float: none;
}

The best way to donate to support this theme development is via PayPal where my ID is a.silkalns[at]gmail.com (replace [at] with @ ).

Thank you! I really appreciate it!

3

Thank you for the info! I’ll donate soon via Paypal.

I added to the code to Custom CSS, and it’s in horizontal line now.
However… I need to change below

  1. it’s not align to the top.

  2. Also I want to eliminate the space on the top- between top thin line and POPULAR POST text,
    and at the bottom - title text to dash line.

  3. How to adjust the space between the photos?

I tried to change numbers the code above in style.css, but nothing changed…
Thank you for your help!

4

Never change anything directly into plugin or theme stylesheet but write CSS on top of it.

#footerarea .widget-area {
    padding: 0;
}
.wpp-list li {
    height: auto;
    overflow: visible;
}
#footerarea .widget {
    margin-bottom: 0;
}
.col-3 .widget ul li {
    vertical-align: top;
}