WordPress.org

Ready to get started?Download WordPress

Forums

Menubar Widgets
[resolved] Drop Down Menu Icons Show Up After Activating (3 posts)

  1. After activating this plugin on WordPress 3.9 beta 3 using a child theme of Stargazer, all of my menu items had a drop down indicator next to them, even if they didn't have any sub-menus.

    https://cloudup.com/cNsgBPTfNzd

    Anything dealing with a menu item has a drop down menu icon. The icons disappear when I deactivate the plugin.

    https://wordpress.org/plugins/menubar-widgets/

  2. hadi khosrojerdi
    Member
    Plugin Author

    Posted 1 month ago #

    At default menubar-widgets adds the tag's
    <span class='menu-item-description' ></span> and <i class="your-custom-css-classes" ></i>
    to menu items such as:

    .

    <li>
    <a href="#">Cart</a><br />
    <i class="fa fa-shopping-cart "></i><br />
    <span class="menu-item-description">Cart Details</span>
    </li>

    .

    And if there is any other tag here except a tag in li tag, your theme adds a drop down indicator icon to it.

    If you don't need the "description" in menu items, you can disable it by mbw_menu_item_desc_depth hook like:

    .
    add_filter("mbw_menu_item_desc_depth", "__return_false");
    .

    If you don't need to add the icon fonts to menu items, you can following way to disable it.

    .
    add_filter("mbw_menu_item_icon_depth", "__return_false");
    .

    Also you can change the position <span>, <i> tags in menu items, for example:

    Before the Changes:

    <li>
    <a href="#">Cart</a><br />
    <i class="fa fa-shopping-cart "></i><br />
    <span class="menu-item-description"></span>
    </li>

    .

    # change the position icon fonts to within 'a' tag<br />
    function change_menubar_icon_position( $args ){
    	$args['link_before'] = '%%menu_icon%%';
    	return $args;
    }
    add_filter("wp_nav_menu_args", "change_menubar_icon_position");

    .
    After the Changes:

    <li>
    <a href="#"><br />
    <i class="fa fa-shopping-cart "></i>
    Cart</a>
    <span class="menu-item-description"></span>
    </li>

    .
    -----------------------------------------------------------
    Before the Changes:

    <li>
    <a href="#">Cart</a>
    <i class="fa fa-shopping-cart "></i>
    <span class="menu-item-description"></span>
    </li>

    .

    # change the position menu description to within 'a' tag
    function change_menubar_desc_position( $args ){
    	$args['link_after'] = '%%menu_icon%%';
    	return $args;
    }
    add_filter("wp_nav_menu_args", "change_menubar_desc_position");<br />

    .
    After the Changes:

    <li>
    <a href="#">Cart<br />
    <span class="menu-item-description"></span>
    </a>
    <i class="fa fa-shopping-cart "></i>
    </li>
  3. hadi khosrojerdi
    Member
    Plugin Author

    Posted 1 month ago #

    WordPress adds menu-item-has-children class to the menu items that have submenu, you can to use of it to detect submenu on your theme.

    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children" >
    <a href="#">Cart</a>
    <i class="fa fa-shopping-cart "></i>
    <span class="menu-item-description"></span>
    
    <ul class="sub-menu">...</ul>
    </li>

    For Example :

    /* the css code adds a drop down indicator icon in your theme */
    .menu li > a:after {
        content: "";
        display: inline-block;
        font: 400 14px/1 Genericons;
        margin: -2px 0 0;
        vertical-align: top;
    }

    .

    /* Must be like this */
    .menu-item-has-children > a:after {
        content: "";
        display: inline-block;
        font: 400 14px/1 Genericons;
        margin: -2px 0 0;
        vertical-align: top;
    }

Reply

You must log in to post.

About this Plugin

About this Topic