First element in a list: class="cat-item-first"

ThemeShaper Forums » Thematic

First element in a list: class="cat-item-first"

(7 posts)

Started 4 months ago by Baudesign
Latest reply from Chris
This topic is not resolved

Tags:

Baudesign
Member
Hi everyone,

The more I play with Thematic, the better I like it. My first post here.

I would like to add a class to the first item in a list, in my sidebar, class="cat-item-first", like so:
This class definition comes from the "classes.php" file, but I do not want to change anything in the wordpress core files. I would like to make this change in my theme directory, and I do not know how. Would there be a function that would allow me to do such a thing?

Thanks for any tip about how to do this.

Pat
Posted 4 months ago #
Chris
Moderator

Hi Pat,

will take a look at it tomorrow .. which widget is creating your list?

Chris

Posted 4 months ago #
Baudesign
Member

Thanks Chris,

I use WP in French. It is the default localized "Catégories" widget in the "Primary Aside" column. I suppose that it would therefore be the "Categories" widget. The reason I am trying to achieve this is that I want to apply a specific style to this first element in the list: no border top, whereas all the others would have this "border top".

Thanks for your time Chris.

Pat

Posted 4 months ago #
Chris
Moderator
Hi Pat,

sorry for this delay .. my family kept me busy over the weekend.

Here is your solution .. put this code in your child theme's functions.php:
```
function add_markup($output) {
    return preg_replace('/cat-item/', 'cat-item cat-item-first', $output, 1);
}
add_filter('wp_list_categories', 'add_markup');
```
Chris
Posted 4 months ago #
Baudesign
Member

Chris, don't be sorry for the delay, my God, you do this on your own time free of charge! Family first, always.

That being said, this is exactly what I was trying to achieve! Thank you very much. You rule, really.

Pat

Posted 4 months ago #
Baudesign
Member
Hum, I just noticed something...

The widgets that list elements (Archives, Meta, Recent posts, etc.) do not add any class to the <li> tag, whereas it is the case for categories and pages: cat-item, cat-item-n (where n is a number), page_item (why underscore instead of dash here!?), etc.
Would it be possible, the same way here, to add a class to the first element of every list? Like so:
```
<h3 class="widgettitle">Title</h3>
  <ul>
    <li class="first-element">
    </li>
    <li>
    </li>
</ul>
```
Base on Chris' suggestion, here are the two functions I added to my functions.php file:
```
function add_markup_cat($output) { // add a class to cat-item
    return preg_replace('/cat-item/', 'cat-item cat-item-first', $output, 1);
}
add_filter('wp_list_categories', 'add_markup_cat');

function add_markup_page($output) { // add a class to page-item
    return preg_replace('/page_item/', 'page_item page-item-first', $output, 1);
}
add_filter('wp_list_pages', 'add_markup_page');
```
Thanks for the hints.

Pat
Posted 4 months ago #
Chris
Moderator

Thanks a lot for your help!!

Posted 4 months ago #

RSS feed for this topic

Reply

You must log in to post.