Adding ul class to main menu

Where the menu code is located depends on the theme you’re using but in most cases you’ll find it in header.php of your theme.

Look in the header.php file for the wp-nav-menu code and then add the
'items_wrap' => '<ul id="mymenu">%3$s</ul>'
part to the array there. Usually some parameters are already added to the array so make sure to add it in correctly.

Feel free to share your nav code here in case you’re unsure. (Just the wp-nav-menu part, you can use off site code sharing tools if you want to link your whole header.php file)

Thanks so much Eva.
I did find it in the header.php for my child theme. There were three instances of wp_nav_menu so included the entire section of code.

Here it is. Still not sure where to add the ul class “bmenu” I want to add.

<div class="et_pb_fullscreen_nav_container">
				<?php
					$slide_nav = '';
					$slide_menu_class = 'et_mobile_menu';

					$slide_nav = wp_nav_menu( array( 'theme_location' => 'primary-menu', 'container' => '', 'fallback_cb' => '', 'echo' => false, 'items_wrap' => '%3$s' ) );
					$slide_nav .= wp_nav_menu( array( 'theme_location' => 'secondary-menu', 'container' => '', 'fallback_cb' => '', 'echo' => false, 'items_wrap' => '%3$s' ) );
				?>

				<ul id="mobile_menu_slide" class="<?php echo esc_attr( $slide_menu_class ); ?>">

				<?php
					if ( '' == $slide_nav ) :
				?>
						<?php if ( 'on' == et_get_option( 'divi_home_link' ) ) { ?>
							<li <?php if ( is_home() ) echo( 'class="current_page_item"' ); ?>><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php esc_html_e( 'Home', 'Divi' ); ?></a></li>
						<?php }; ?>

						<?php show_page_menu( $slide_menu_class, false, false ); ?>
						<?php show_categories_menu( $slide_menu_class, false ); ?>
				<?php
					else :
						echo( $slide_nav );
					endif;
				?>

				</ul>
			</div>
		</div>
	<?php endif; // true ==== $et_slide_header ?>

		<header id="main-header" data-height-onload="<?php echo esc_attr( et_get_option( 'menu_height', '66' ) ); ?>">
		   <?php echo do_shortcode('[et_pb_section global_module="201601"][/et_pb_section]'); ?>
			<div class="container clearfix et_menu_container">
			<?php
				$logo = ( $user_logo = et_get_option( 'divi_logo' ) ) && '' != $user_logo
					? $user_logo
					: $template_directory_uri . '/images/logo.png';
			?>
				<div class="logo_container">
					<span class="logo_helper"></span>
					<a href="<?php echo esc_url( home_url( '/' ) ); ?>">
						<img src="<?php echo esc_attr( $logo ); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" id="logo" data-height-percentage="<?php echo esc_attr( et_get_option( 'logo_height', '54' ) ); ?>" />
					</a>
				</div>
				<div id="et-top-navigation" data-height="<?php echo esc_attr( et_get_option( 'menu_height', '66' ) ); ?>" data-fixed-height="<?php echo esc_attr( et_get_option( 'minimized_menu_height', '40' ) ); ?>">
					<?php if ( ! $et_slide_header || is_customize_preview() ) : ?>
						<nav id="top-menu-nav">
						<?php
							$menuClass = 'nav';
							if ( 'on' == et_get_option( 'divi_disable_toptier' ) ) $menuClass .= ' et_disable_top_tier';
							$primaryNav = '';

							$primaryNav = wp_nav_menu( array( 'theme_location' => 'primary-menu', 'container' => '', 'fallback_cb' => '', 'menu_class' => $menuClass, 'menu_id' => 'top-menu', 'echo' => false ) );

							if ( '' == $primaryNav ) :
						?>
							<ul id="top-menu" class="<?php echo esc_attr( $menuClass ); ?>">
								<?php if ( 'on' == et_get_option( 'divi_home_link' ) ) { ?>
									<li <?php if ( is_home() ) echo( 'class="current_page_item"' ); ?>><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php esc_html_e( 'Home', 'Divi' ); ?></a></li>
								<?php }; ?>

								<?php show_page_menu( $menuClass, false, false ); ?>
								<?php show_categories_menu( $menuClass, false ); ?>
							</ul>
						<?php
							else :
								echo( $primaryNav );
							endif;
						?>
						</nav>
					<?php endif; ?>

Ok, guessing from what I can see from your code output on the site you’re only using the mobile menu? Then you can actually add the class to the ul itself.

It’s this part:

<ul id="mobile_menu_slide" class="<?php echo esc_attr( $slide_menu_class ); ?> bmenu">

Ideally you would copy over the whole header to a child theme to make sure this change doesn’t get undone when your theme updates.

Yes I am only using my mobile menu.
The code I pasted is from the header.php in my child theme so that’s handled. ??

I tried adding the code you suggested but it isn’t showing up when I view the page source code using Chrome DevTools.

When I manually add the ul class I want using DevTools, it works with the css styling I have. Just really struggling with how to have the ul class show up in my code.

That probably means the code in header.php isn’t the one that outputs your menu. Strange.

You’re using Divi theme right? In that case I would go to the author’s theme forum and ask then where the code is located for this menu. They’ll probably have a better idea of what’s going on.

I will see if I can get an answer in the Divi forums.
Thanks for your help.