CODEWITHSUNDEEP
phpwordpresssidebar
Cain Nuke
Cain Nuke

Reputation: 3083

How to add class to <ul> of dynamic_sidebar in wordpress

Wordpress automatically wraps up your menus inside a <ul> but I want to give it a class. If you do it like this

register_sidebar(array(
        'name' => 'Before Content Area',
        'id' => 'before-content-area',
        'before_widget' => '<ul class="menu">',
        'after_widget' => '</ul>',
    ));

you get an inside another and I dont want that.How you do it?

Thank you.

Upvotes: 0

Views: 1395

Answers (3)

Therichpost
Therichpost

Reputation: 1815

you can try with jquery also:

 jQuery( document ).ready(function() {
    jQuery('.widget > ul').addClass('nav nav-list');
 });

Upvotes: 0

raju_odi
raju_odi

Reputation: 1455

In your theme directory: edit sidebar.php and delete the opening 'ul' tag and closing 'ul' tags. I don't recommend this, because it will leave orphaned 'li' tags, which is not well-formed HTML.

Because there is not such way from where you can remove ul from register_sidebar.

Other thing please set 'before_widget' and 'after_widget' to blank like below code because without ul tag li tag is not recommended as per html structure,

register_sidebar(array(
        'name' => 'Before Content Area',
        'id' => 'before-content-area',
        'before_widget' => '',
        'after_widget' => '',
    ));

Upvotes: 0

Johannes
Johannes

Reputation: 67748

I'd rather use wp_nav_menu() for that, where one of the possible arguments is menu_class, whose value (a string) is added as a class to the ul which wraps the menu. (using a ul around the li elements is necessary for valid HTML...)

This also allows to add a wrapper/container and give it a class, see https://developer.wordpress.org/reference/functions/wp_nav_menu/

Upvotes: 1

Related Questions