Contents
So lets start:
- Step: 1 : On Menus page under Appearance category. Click Screen Options on top right corner.
- Step: 2 : then check CSS classes checkbox, you will see CSS classes input box in nav-menu options.
- Step: 3 : Add your custom class here and it will display on frontend.
How to add class to anchor tag in wp_ nav_ menu?
php wp_nav_menu(array( ‘theme_location’ => ‘header-menu’, ‘menu_class’ => ‘navbar-nav’, ‘container’ => ‘false’ ) ); ?> and apply a class to the menu that way, and remove the containing div. 2/ I then use the WordPress Appearances > Menu UI to apply “nav-item” class to li tags.
How to add class in WordPress menu anchor?
How to Add a Custom Class to a WordPress Menu Item
- In Appearance > Menus, click the Screen Options tab.
- Under Show advanced menu properties, check CSS Classes.
- Now expand any menu item to reveal the CSS Classes (optional) text input.
- Enter your class name and save your menu to apply the class to the menu item.
To add a custom navigation menu, the first thing you need to do is register your new navigation menu by adding this code to your theme’s functions. php file. add_action( ‘init’ , ‘wpb_custom_new_menu’ ); You can now go to Appearance » Menus page in your WordPress admin and try to create or edit a new menu.
What are CSS classes WordPress?
CSS or Cascading Style Sheets is a style sheet language used to define visual appearance and formatting of HTML documents. WordPress themes use CSS and HTML to output the data generated by WordPress. Every WordPress theme contains a style.
How do I register the footer menu in WordPress?
Create the Menu
- Go to Appearance -> Menus and click the + to create a new menu.
- Name the menu e.g. “footer”
- Add published pages such as contact, sitemap, privacy policy to the menu.
- Drag and drop menu items to order them.
- Save the menu.
Adds a class https://codex.wordpress.org/Plugin_API/Filter_Reference/nav_menu_link_attributes After creating some WordPress sites based on the Bootstrap framework, i’ve come up with a solution of easily manipulating the WordPress navigation output by initializing the classes you want.
How to add class to link in WP _ Nav _ menu?
Step: 1 : On Menus page under Appearance category. Click Screen Options on top right corner. Step: 2 : then check CSS classes checkbox, you will see CSS classes input box in nav-menu options. Step: 3 : Add your custom class here and it will display on frontend. then use jquery to inject the missing class.
How to add CSS classes to custom menu?
In the upper area of Appearance -> Menus page, click to expand the Screen Options, check the checkbox of CSS Classes. Now when you expand each of the added menu item, you’ll see a CSS Classes (optional) field. Thanks for contributing an answer to WordPress Development Stack Exchange!
Now, you only set $_request [“id\\ == “home” thì echo “class=’active'” , then we can do same with others. I think it is useful with you. And you want the “SHOP” li link to get class “active” so you can visually indicate it’s the active navigation, even if you’re at the sub page of “shop” at “detail_shop”.