WordPress.org

Ready to get started?Download WordPress

Forums

wp_nav_menu (9 posts)

  1. salmoliv
    Member
    Posted 3 years ago #

    Hello,

    At the moment, my menu / sub-menu is as follow:
    <div id="menuprincipal" class="menu-ville-container">
    <ul id="menu">
    <li id="menu-item-39" class="menu-item menu-item-type-post_type menu-item-39">
    <a href="http://">Lien</a>
    <ul class="sub-menu">
    <li id="menu-item-37" class="menu-item menu-item-type-post_type menu-item-37">
    <a href="http://">Sous lien</a>

    I've done it as follow, from my header.php file:

    <?php wp_nav_menu( array( 'container_id' => 'menuprincipal', 'container_class' => '', 'menu_id' => 'menu', 'menu_class' => '') ); ?>

    I would like to have in fact:
    <div id="menuprincipal">
    <ul id="menu">
    <li id="menu-item-39">
    <a href="http://" class="lienmenu">Lien</a>
    <ul class="sub-menu">
    <li>
    <a href="http://">Sous Lien</a>

    Can I do it by changing my theme (header) ?

    Thank you

  2. stvwlf
    Member
    Posted 3 years ago #

    All of those classes come from WordPress itself, not a theme. So the answer is, unless you filter the output of wp_nav_menu using PHP str_replace what you are getting is what you are going to get. Google for tutorials on filtering the output of wp_nav_menu

  3. salmoliv
    Member
    Posted 3 years ago #

    Ok, maybe my question wasn't enough clear.

    I know that all the classes come from WP. It comes from the file nav-menu-template.php in wp-includes folder.

    I can modify it to have the result I want but would love to avoid that, as it will be overwritten if I upgrade my WP. If I can change the class and ids from the theme, then I'm 'safe'.

    I suppose that the most important for me at the moment is to add the class 'lienmenu' to the anchor ; and I haven't been able to do it using filters.

    So, the question is, how to add a class to an anchor (part of a menu / sub-menu)?

    Hope this make more sense now !

    Thanks

  4. stvwlf
    Member
    Posted 3 years ago #

    Within the WP custom menu screen itself you could add the class lienmenu to the LI that contains the A tag.

    So it would be

    <li id="menu-item-39" class="lienmenu">
    <a href="http://">Lien</a>

    That's not exactly what you want but you could still target the A tag with CSS or Javascript.

    li.lienmenu a { ... }

    On the menu page, click Screen Options at the very top of the page. Put a check in Link Target and CSS Classes. You will now see two more fields on each menu item. You can add the class lienmenu to the menu item that is number 39. Then it will show up as
    <li id="menu-item-39" class="lienmenu">

    Does this accomplish what you want?

  5. salmoliv
    Member
    Posted 3 years ago #

    It's a workaround. Thanks.
    I was already aware of that option. I thought we could have a filter in the wp_nav_menu function.
    Maybe in the future release of WP ;-)

  6. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    What are you trying to accomplish, that you need/want to add a class to the anchor inside the LI? Perhaps there might be an easier way to do what you're wanting to do?

  7. salmoliv
    Member
    Posted 3 years ago #

    Hi Chip.

    I'm trying to achieve that menu: http://www.pukkafish.com/projects/chateaurenault/ (which works right now, but because I've hack a bit the code !)

  8. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    You don't need to add classes to the anchors inside the LI tags in order to create such a menu.

    Target those anchors like this:

    #menu li a {
         /* CSS style definitions go here */
    }

    If you need to change the styles of the submenus, target those anchors like this:

    #menu li ul li a {
         /* CSS style definitions go here */
    }
  9. jochani
    Member
    Posted 3 years ago #

    hi samoliv

    i am facing the same issue can you please let me know how did you resolve it.

    it would be great if you send me the js files and code also for your menu.

    Because i need to implement same for my website.

    Regards
    Jayant

Topic Closed

This topic has been closed to new replies.

About this Topic