Archived topic
HTML Sidebar Widget Question
9 replies · Started by Adam on October 10, 2020
I'm using the WordPress recent post widget to display recent posts, but I'm trying to create a replica of this using an HTML widget to display popular posts. (which I'll be manually updating based on google analytics stats)
I use some CSS code supplied by you that adds a bullet point and aligns the text when it drops down a line, and this works fine for the recent post widget, but I would like it to also change the HTML widget I've added so that the line spacing, etc are the same. So both the recent and popular widget have the same spacing, alignment and bulletpoints.
Is this possible?
The CSS used is:
/* Latest post widget margin */
.widget_recent_entries ul {
margin-left: 1em;
}
/* Latest post bulletpoints */
.widget_recent_entries ul li {
list-style-type: disc;
margin-bottom: 5px;
Hi there,
If you give the Popular Posts HTML widget a custom class like widget_popular_posts then CSS should just be this:
.widget_popular_posts ul {
margin-left: 1em;
}
/* Latest post bulletpoints */
.widget_popular_posts ul li {
list-style-type: disc;
margin-bottom: 5px;
}Can't seem to get it working. I'm using the code in private info section.
I'm no longer seeing the popular posts HTML widget?
Added it back in. Line spacing, bullet points and alignment still not functioning
Hi,
You can try changing the markup of your Custom HTML widget into this:
<ul class="widget_popular_posts">
<li><a href="https://chasingronin.com/travel-photography-gear/">Travel Photography Gear: What’s In Our Camera Bag?</a></li>
<li><a href="https://chasingronin.com/lock-laces-elastic-shoelaces/">Lock Laces: Elastic No Tie Shoelaces</a></li>
</ul>Leo's CSS code should work well w/ this.
Still not working
Hi there,
try this CSS:
ul.widget_popular_posts {
margin-left: 1em;
}
/* Latest post bulletpoints */
ul.widget_popular_posts li {
list-style-type: disc;
margin-bottom: 5px;
}Nailed it. Thanks David.
You're welcome
