Sidebar CSS list variation

  • #sidebar ul li ul li a{
	display:block;
	height:40px;
        padding-bottom:3px;
	font-size:14px;
	line-height:19px;
        padding-left:5px;}

    Hiya. I have the above css on this website: https://www.explosivefootballtraining.com/

    I changed the height and line-height to customize the “most popular posts” widget(also changed hover). My problem is that it effected all the other widgets also. Is it possible to change the styles for each widget? Inline would work, but then the hover would be messed up.

    Any recommendations?

    Thanks.

Viewing 5 replies - 1 through 5 (of 5 total)

  • Hi

    This will require slightly modifying the plugin code but it will work. That means you have to do it again whenever the widget is updated. I recommend contacting the plugin author and requesting he add it as part of the next version of the plugin, since its a very reasonable request.

    In the plugin’s folder, edit most-popular.php
    Find this

    <h2><?php echo $options['title']; ?></h2>
<ul>
<?php
//display each page as a link
foreach ($posts as $links) {

    Change <ul> to <ul class="most-popular"> and save the change.

    Now you can change the 1st line of your CSS to

    #sidebar ul li ul.most-popular li a{
... ... ... ...

    and it will only affect that one widget.

    Thread Starter zeemy23

    (@zeemy23)

    Hmmm, the plugin only has 2 phps: popular-posts.php and popular-posts-admin.php.

    I searched everywhere and couldn’t find that code.

    Thanks.

    maybe I was looking at a different plugin with a similar name – what is the URL of where you download the plugin you used on the WP plugin site?

    Thread Starter zeemy23

    (@zeemy23)

    https://rmarsh.com/plugins/popular-posts-plugin/

    thanks for the help.

    hi

    yes, this is a different plugin than I was looking at. It will be easier with this one.

    On the plugin’s options page in the WP admin section there is supposedly a field called “Text and codes before the list”

    It says the default if you enter nothing is <ul>
    Put an entry in that field of <ul class="most-popular"> and save the changes.

    Now you can enter the css as I explained in the earlier post.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Sidebar CSS list variation’ is closed to new replies.