wp_list_categories() – adding a div to each li?

I am using wp_list_categories() to print out a link to each category from a specific author ID which is working fine. However, I would also like to add a div to each li which will hold an icon for the category. How can I achieve this?

Here is my current code:

<?php
    // Display a list of all categories associated with author
    $cat_array = array();
    $args = array(
        'author' => $author_id,
        'showposts' => -1,
        'data-filter' => 'category',
        'ignore_sticky_posts' => 1,
    );
    $author_posts = get_posts($args);
    if($author_posts) {
        foreach ($author_posts as $author_post ) {
            foreach(get_the_category($author_post->ID) as $category) {
                $cat_array[$category->term_id] =  $category->term_id;
            }
        }
    }
    $cat_ids = implode(',', $cat_array);
    wp_list_categories('include=".$cat_ids."&title_li=');
?>

1 Answer
1

You can use CSS pseudo selectors to include the icons. :before if you need in front of the categories or :after for placing it to the right.

li.cat-item::before {
  content: url("Icon image URL here");
}

Leave a Comment