
Automatically Hierarchic Categories in Menu Pro
You can see what the plugin does and how it works with the free version. More parameters become available with the Pro version.
You can contact me or text via Telegram to purchase the paid Pro version or to make the plugin compatible with your theme. Each sale is for one website only. There is no time limit, it can be used for lifetime. You can transfer money very quickly using Binance Pay with zero commissions - fees - charges. If you are not a member, you can create an account by following this link (with reference).
Pro features:
⭐ Custom taxonomy compatibility
⭐ Add sub item at the beginning / end of the link text
⭐ Trailing slash on url link
⭐ Removed credits link
⭐ Show the number of posts in a category
⭐ Selecting root items to be included in the menu by ID
⭐ Sorting menu items (Alphabetical ascending - descending)
To-do list:
☐ Add active CSS class to current element
☐ Using the category's image in the menu item (icon, flag etc.)
How to automatically add hierarchic categories in WordPress Navigation Menus ?
You can use this WordPress plugin:
Automatically Hierarchic Categories in Menu - WordPress Plugin
HTML and CSS knowledge may be required depending on the theme.
Some themes using custom html and css rules, like OceanWP, Kadence, Neve ...
Current release is not supporting them, but new versions will. Keep watching.
Usage
Parameters
Parameter Default Description taxonomy category taxonomy type exclude false exclude taxonomy id(s) level 2 hierarchy max level prnt_tag ul parent tag, dom name prnt_cls sub-menu parent tag, class chld_tag li child tag, dom name chld_cls menu-item child tag, class chld_chc menu-item-has-children child tag, has children class chld_cid false add id to class a_cls false default link class subi_bfr false sub item, before for has children item subi_aft false sub item, after has children item nline "\n" new line linkget false extra get parameter after link hide_empty 1 hide categories with empty items
- taxonomy:
- Type of 'taxonomy'. Do not ignore this parameter for post categories. To use WooCommerce product categories as menu items, give the value 'product_cat'. Example:
[autocategorymenu taxonomy="product_cat"]
- exclude:
- Use this parameter for the categories that you want to exclude in the menu. Specify the category IDs that you want to exclude. Combine ID numbers with commas without spaces. Example:
exclude="123,124"
- level:
- Maximum level limit value. If you give the value '
1
', only the items at the top root level are included in the menu. No subcategories are added to the menu. if you set the value '2
', the root categories and the subcategories of these categories are added to the menu. - prnt_tag:
- Parent tag's dom name. The HTML element that will enclose the menu items.
- prnt_cls:
- Parent tag's class. The class value of the HTML element that will contain the menu items.
- chld_tag:
- The HTML element in which the menu items are sorted.
- chld_cls:
- The class value of the HTML element that is a menu item.
- chld_chc:
- The class value of the menu item that has a subcategory.
- chld_cid:
- To add the ID of the menu item to the class of the menu HTML element, give the value '
1
'. - a_cls:
- To assign the class value of the HTML address link element (a), set a value.
- subi_bfr:
- The content before the element (a) of the menu item, which is a subcategory.
- subi_aft:
- The content after the element (a) of the menu item, which is a subcategory.
- nline:
- Adds new lines after each HTML element. It ensures the readability of the source code. Give a null value to minimize the HTML code. Example:
nline=""
- linkget:
- Get extra parameter after link. The link address domain.com/category instead of domain.com/category?reg=val to replace it with, give the value
reg=val
. - hide_empty:
- By default, categories that do not have any posts in them are not added to the menu. To add categories that do not contain posts to the menu, give the value '
0
'.
Paid PRO version parameters
Parameter Default subi_atb false subi_ate false t_slash true txtcount false cntnr_1s false cntnr_1e false prnt_co1 false prnt_ca1 false startids false sortname false fn_custom false
- subi_atb
- Content before the name of the menu item that has the subcategory.
- subi_ate
- Content after the name of the menu item that has the subcategory.
- t_slash
- Add trailing slash end of the link.
- txtcount
- Add total post count to category name. Sample value: "
(%s)
", Sample result: "Travel (5)" - cntnr_1s
- Content before the HTML element enclosing (default ul) the subcategory list.
- cntnr_1e
- Content after the HTML element enclosing (default ul) the subcategory list.
- prnt_co1
- CSS selector value to overwrite after level 1 of the class of the HTML element (default ul) containing the subcategory list.
- prnt_ca1
- CSS selector value to be added after level 1 to the class of the HTML element (default ul) containing the subcategory list.
- startids
- Selection of root items to be included in the menu by ID. Type the ID(s) of the categories. To exclude the category itself and include all its subcategories, type the negative of the ID value. Combine multiple IDs with commas without spaces. For example: "
101,102,-103
" - sortname
- Sort the category items alphabetically. Available values: "
ASC
", "DESC
" - fn_custom
- It is used for special functions written for a fee for theme menus whose structure is not standard.
Demo
Flatsome test environment: Imported "Classic Shop" prebuilt website on theme version 3.15.6, WordPress version 6.2, PHP version 7.4 / 8.2 - Demo
Shortcode Helper
Your shortcode:[autocategorymenu]
Reset
Menu items: | |
Exclude item id(s): | |
Maximum hierarchy level: | |
Extra get parameter after link: |
[autocategorymenu]
This plugin works with most of WordPress themes. Sometimes you have to use some extra parameters. Here are examples for the free version.
<ul id="primary-menu-list" class="menu-wrapper"> <li id="menu-item-16006" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-16006"><a href="#">Lost password</a></li> <li id="menu-item-16004" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-16004"><a href="#">Account</a> <button class="sub-menu-toggle" aria-expanded="false" onClick="twentytwentyoneExpandSubMenu(this)"><span class="icon-plus"><svg class="svg-icon" width="18" height="18" aria-hidden="true" role="img" focusable="false" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 11.2h-5.2V6h-1.6v5.2H6v1.6h5.2V18h1.6v-5.2H18z" fill="currentColor"/></svg></span><span class="icon-minus"><svg class="svg-icon" width="18" height="18" aria-hidden="true" role="img" focusable="false" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 11h12v2H6z" fill="currentColor"/></svg></span><span class="screen-reader-text">Open menu</span></button> <ul class="sub-menu"> <li id="menu-item-16003" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-16003"><a href="#">Address</a></li> <li id="menu-item-16001" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-16001"><a href="#">Orders</a> <ul class="sub-menu"> <li id="menu-item-16002" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-16002"><a href="#">Downloads</a></li> </ul> </li> <li id="menu-item-16005" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-16005"><a href="#">Logout</a></li> </ul> </li> </ul>
level : 2
chld_cls : menu-item menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children
chld_chc : menu-item-has-children
subi_aft : <button class="sub-menu-toggle" aria-expanded="false" onClick="twentytwentyoneExpandSubMenu(this)"><span class="icon-plus"><svg class="svg-icon" width="18" height="18" aria-hidden="true" role="img" focusable="false" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 11.2h-5.2V6h-1.6v5.2H6v1.6h5.2V18h1.6v-5.2H18z" fill="currentColor"/></svg></span><span class="icon-minus"><svg class="svg-icon" width="18" height="18" aria-hidden="true" role="img" focusable="false" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 11h12v2H6z" fill="currentColor"/></svg></span><span class="screen-reader-text">Open menu</span></button>
Shortcode :
[autocategorymenu hide_empty="0" level="2" chld_cls="menu-item menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children" chld_chc="menu-item-has-children" subi_aft='<button class="sub-menu-toggle" aria-expanded="false" onClick="twentytwentyoneExpandSubMenu(this)"><span class="icon-plus"><svg class="svg-icon" width="18" height="18" aria-hidden="true" role="img" focusable="false" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 11.2h-5.2V6h-1.6v5.2H6v1.6h5.2V18h1.6v-5.2H18z" fill="currentColor"/></svg></span><span class="icon-minus"><svg class="svg-icon" width="18" height="18" aria-hidden="true" role="img" focusable="false" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 11h12v2H6z" fill="currentColor"/></svg></span><span class="screen-reader-text">Open menu</span></button>']
<ul class="primary-menu reset-list-style"> <li id="menu-item-6" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6"><a href="#">Bulk 0</a></li> <li id="menu-item-8" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-8"> <a href="#">Bulk 1</a> <span class="icon"></span> <ul class="sub-menu"> <li id="menu-item-9" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-9"><a href="#">Bulk 1 . 1</a></li> <li id="menu-item-10" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-10"><a href="#">Bulk 1 . 2</a></li> </ul> </li> </ul>
subi_aft : <span class="icon"></span>
Shortcode :
[autocategorymenu hide_empty="0" level="3" subi_aft='<span class="icon"></span>']
<div class="menu-main-menu-auto-container"> <ul id="menu-main-menu-auto" class="main-menu" tabindex="0"> <li id="menu-item-6" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6"><a href="#">Bulk 0</a></li> <li id="menu-item-8" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-8"> <a href="#" aria-haspopup="true" aria-expanded="false">Bulk 1</a> <span class="submenu-expand" tabindex="-1"> <svg class="svg-icon" width="24" height="24" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"></path><path fill="none" d="M0 0h24v24H0V0z"></path></svg> </span> <ul class="sub-menu"> <li id="menu-item--1" class="mobile-parent-nav-menu-item menu-item--1"><span class="menu-item-link-return" tabindex="-1"><svg class="svg-icon" width="24" height="24" aria-hidden="true" role="img" focusable="false" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg>Bulk 1</span></li> <li id="menu-item-9" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-9"><a href="#">Bulk 1 . 1</a></li> <li id="menu-item-10" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-10"><a href="#">Bulk 1 . 2</a></li> </ul> </li> </ul> </div>
subi_aft : <span class="submenu-expand" tabindex="-1"><svg class="svg-icon" width="24" height="24" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"></path><path fill="none" d="M0 0h24v24H0V0z"></path></svg></span>
Shortcode :
[autocategorymenu hide_empty="0" subi_aft='<span class="submenu-expand" tabindex="-1"><svg class="svg-icon" width="24" height="24" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"></path><path fill="none" d="M0 0h24v24H0V0z"></path></svg></span>']
<ul id="ast-hf-menu-1" class="main-header-menu ast-nav-menu ast-flex submenu-with-border astra-menu-animation-fade stack-on-mobile"> <li id="menu-item-6" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6"><a href="#" class="menu-link">Bulk 0</a></li> <li id="menu-item-8" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-8"><a href="#" class="menu-link">Bulk 1</a><button class="ast-menu-toggle" aria-expanded="false"><span class="screen-reader-text">Menu Toggle</span></button> <ul class="sub-menu"> <li id="menu-item-9" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-9"><a href="#" class="menu-link">Bulk 1 . 1</a></li> <li id="menu-item-10" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-10"><a href="#" class="menu-link">Bulk 1 . 2</a><button class="ast-menu-toggle" aria-expanded="false"><span class="screen-reader-text">Menu Toggle</span></button> <ul class="sub-menu"> <li id="menu-item-14" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-14"><a href="#" class="menu-link">xx</a></li> </ul> </li> </ul> </li> </ul>
a_cls : menu-link
level : 3
Shortcode :
[autocategorymenu hide_empty="0" level="3" a_cls="menu-link"]
<ul id="primary-menu" class="menu"> <li id="menu-item-6" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6"><a href="#">Bulk 0</a></li> <li id="menu-item-8" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-8"><a href="#">Bulk 1</a> <ul class="sub-menu"> <li id="menu-item-9" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-9"><a href="#">Bulk 1 . 1</a></li> <li id="menu-item-10" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-10"><a href="#">Bulk 1 . 2</a> <ul class="sub-menu"> <li id="menu-item-14" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-14"><a href="#">xx</a></li> </ul> </li> </ul> </li> </ul>
level : 3
Shortcode :
[autocategorymenu hide_empty="0" level="3"]
Shortcode : <nav class="is-horizontal is-content-justification-right is-layout-flex wp-container-2 is-responsive items-justified-right wp-block-navigation" aria-label="Header navigation">
<button aria-haspopup="true" aria-label="Open menu" class="wp-block-navigation__responsive-container-open " data-micromodal-trigger="modal-atakanau-1">
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
<rect x="4" y="7.5" width="16" height="1.5"></rect>
<rect x="4" y="15" width="16" height="1.5"></rect>
</svg>
</button>
<div class="wp-block-navigation__responsive-container " style="" id="modal-atakanau-1">
<div class="wp-block-navigation__responsive-close" tabindex="-1" data-micromodal-close="">
<div class="wp-block-navigation__responsive-dialog" aria-label="Menu">
<button aria-label="Close menu" data-micromodal-close="" class="wp-block-navigation__responsive-container-close">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" aria-hidden="true" focusable="false">
<path d="M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"></path>
</svg>
</button>
<div class="wp-block-navigation__responsive-container-content" id="modal-atakanau-1-content">
<ul class="wp-block-navigation__container">
[autocategorymenu taxonomy0="product_cat" hide_empty="0" prnt_cls="wp-block-navigation__submenu-container" chld_cls="wp-block-navigation-item" chld_chc="has-child open-on-hover-click wp-block-navigation-submenu" a_cls="wp-block-navigation-item__content" subi_aft="<button aria-label='Bulk 1 submenu' class='wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle' aria-expanded='false'><svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' aria-hidden='true' focusable='false'><path d='M1.50002 4L6.00002 8L10.5 4' stroke-width='1.5'></path></svg></button>"]
</ul>
</div>
</div>
</div>
</div>
</nav>
== Changelog ==
= Version 2.0.1 =
* Edited: Info text
* Bumped up "Tested up to: 6.2"
= Version 2.0.0 =
* Added: New option, add item id to menu item class
* Added: Taxonomy list on admin panel
* Added: Expandable with paid Pro version
* Bumped up "Tested up to: 6.1.1"
= Version 1.02 =
* Added: Null array item handler for base category path in PHP
* Fixed: Broken support link
* Bumped up "Tested up to: 6.0.1"
= Version 1.01 =
* Bumped up "Tested up to: 5.9"
= Version 1.00 =
* Initial version released
woodmart category menu, woodmart mobile menu categories, Astra, Avada, Divi, Hello, OceanWP, Sydney, Betheme, GeneratePress, The7, Porto, Phlox, Enfold, X, Uncode, WoodMart, Flatsome, Bridge, Jupiter, Salient, Newspaper, Hestia, OnePress, Neve, Impreza, Go, Kadence WP, TheGem, uDesign, Kallyas, Total, Brooklyn, Kalium, Soledad, Monstroid2, Shopkeeper, Eduma, Oshine, Visualmodo