Comment ajouter des articles personnalisés à des menus WordPress spécifiques

65 commentairesLaisser une réponse

1. Jiří Vaněk

   I like the implementation of the search, where instead of the classic empty field, there is a popup window. It looks like a nice solution. I was also interested in the date and personalization of the logged in user. Thanks for the inspiration.

   Répondre

2. reza

   very helpful and simple
   thanks thanks thanks

   Répondre

   • WPBeginner Support

     Glad our guide was helpful

     Répondre

     Administrateur

3. Denis

   Hello,
   thanks a lot for that code. Is there a way to reorder the MENU? For example I want to have the Log in Log out button at first in the MENU. Just for an example.
   Cheers,
   Denis

   Répondre

   • WPBeginner Support

     For the moment with this code, we do not have a simple method for reordering where the additions are placed compared to the menu items at the moment.

     Répondre

     Administrateur

   • Ben Short

     I’m sure this is too late for Denis! But in case anyone else wants their menu item to come FIRST in the list of menu items, rather than LAST, here’s an example of code I’ve used for this purpose:

     add_filter( ‘wp_nav_menu_items’, ‘your_custom_menu_item’, 10, 2 );
     function your_custom_menu_item ( $items, $args ) {
     if (is_single() && $args->theme_location == ‘primary’) {
     $oldItems = $items;
     $items = ‘Show whatever’;
     $items .= $oldItems;
     }
     return $items;
     }

     Répondre

4. Karen

   Is there a way to have an entry on your menu bar set to appear at a certain time and another item set to expire?

   Répondre

   • WPBeginner Support

     Unless I hear otherwise, we do not have a recommended time based conditional display that we would recommend.

     Répondre

     Administrateur

5. Mary

   How to add in my secondary menu footer class li items in functions.php…?

   Répondre

6. Saurabh Saneja

   Hi,

   How can I add a search form at the beginning of the menu items list?

   Thanks,

   Saurabh

   PS: big fan of your tuts

   Répondre

7. Igor

   This is great. But would it be possible to add a menu within a menu?
   I want to append a language menu to my primary menu.
   I get the language menu on the page but not in the desired place.

   instead of

   Répondre

8. Annemarie

   Thank you for this! Just what I needed in a project.

   Répondre

9. Tasneem

   I used the code for teh search box it works perfect.

   Répondre

10. Anuj

    Nice article, Help me alot.

    Répondre

11. Garratt

    Does this code still work? Not seeing anything on my menu, even just using the basic function with text. Not using any special type of menu, just ‘X’ & child theme.

    Répondre

    • Garratt

      never-mind, sorry just read this: « Obviously, you need to have custom menu enabled in your themes before you can proceed any further. »

      Répondre

      • Garratt

        OK so I was still having the problem even though my menu was custom, and messed around until I removed the condition. (IF), once I did that it displayed on all pages including homepage.

        `add_filter( ‘wp_nav_menu_items’, ‘your_custom_menu_item’, 10, 2 );
        function your_custom_menu_item ( $items, $args ) {
        $items .= ‘Show whatever’;
        return $items;
        }

        Répondre

12. sahar

    It worked but it destroyed responsivity…I had to remove code

    Répondre

13. Gerson

    How add this menu item in first position ?

    Répondre

14. Gwen

    Awesome, Thanks you just saved me hours.

    Répondre

15. Dilip

    What is use of 10,2 in the code

    Répondre

    • WPBeginner Support

      10 specifies the order in which the functions associated with a particular action are executed. Lower numbers correspond with earlier execution, and functions with the same priority are executed in the order in which they were added to the action.

      2 is for the number of arguments the function accepts.

      Répondre

      Administrateur

16. Pat

    This is so useful and just what I needed! Thank you very much for sharing.

    Répondre

17. Matt

    The Log-in link won’t show up, just the log out link. What could cause this?

    Répondre

18. Ritchie Pettauer

    This is an awesome, straight-to-the point tutorial. I want an item with today’s date (« headlines | DATE ») in one of my menus.

    I didn’t expect the first posting I found to solve my problem thx guys.

    Répondre

19. Bill Gram-Reefer

    works but (lol) for my situation I want to add « Search » to the primary header as if it were just another item that got checked in

    appearance/menus/add-to-menu

    Everything I’ve seen creates a whole new…what is it a div…(?)

    that adds a whole new row to the header instead of p[lacing the form in the same row as ABOUT, etc. items in the primary navigation edit window.

    AND take the css assigned to the navigation bar.

    Répondre

20. Josalone Wordsworth

    I really liked the post, so useful. However lets say I want to add a login and logout link in the footer with and if condition

    Répondre

21. Hugo Callens

    Related question: how to add a menu item based on a specific user role?
    Say I have a custom user role called « Student » and I would like to add an item to the menu only when the user has the role of « Student »?

    Répondre

22. Monilal

    Its works but current menu item not select

    Répondre

23. james

    is there a way to add it on certain submenu instead of top ul?

    Répondre

    • Jonathan

      I’d like to know the same thing. Anyone have an answer on how to add it in a certain submenu?

      Répondre

24. Gerrit

    Thank you for the How To!

    To be honest I don’t understand how you call the function.

    Especially I am missing a mention what arguments you call the functions with i.e. what wp variables to hand over as $items and $args.

    Could you please detail for a wp-beginner?

    Thank you,

    Gerrit

    Répondre

25. samuel

    hey how if i want to add it to sub menu ?

    Répondre

26. lokitoki

    hm any ideas how i could add html tags to just one wordpress menu item.

    from this:

    Contact

    to this:

    Contact

    it should be only for one menu item. not to all

    Répondre

    • amit

      the option is available on wp admin panel

      Répondre

27. lokitoki

    hm any ideas how i could edit the tag for one wordpress menu item.

    from this:

    Contact

    to this:

    Contact

    it should be only for one menu item. not to all

    Répondre

28. gonzela2006

    Hello,
    How can I add the following classes active and current-menu-item and the id menu-item-id ?

    Répondre

29. Lại Đình Cường

    How about add new custom menu to specific position?

    Répondre

30. Guillermo

    I want put a little image beside left to the menu home, how can put it?
    please help me

    Répondre

31. Pierre Laflamme

    In your examples, you add items to the primary menu (theme_location == ‘primary’).

    How would I add an item in a specific menu in widget area? Where do I get the theme_location?

    Répondre

    • WPBeginner Support

      theme locations are usually defined by your theme, check your theme’s functions.php file or the template where a menu is displayed.

      Répondre

      Administrateur

    • Brad Trivers

      If you want to target a specific menu (not a theme location) then use $args->menu->slug == ‘the_menu_slug’ instead of $args->theme_location == ‘primary’.

      Répondre

      • Xúlio Zé

        Really useful!

        Thank you vary much Brad

        ^-^

        Répondre

      • Peter Lalor

        Hi Brad,
        Would you be able to tell me how I find out what the value of ‘the_menu_slug’ is?
        Thanks,
        Peter

        Répondre

32. razvan

    Hi! I used your tutorial to put a picture as a logo overlapping the menu bar. All is fine but this specific menu has a hover option that makes the color white… So when i hover the mouse on the logo, it also hovers the link which kind of ruins the aspect of the page.

    This is my code:

    if( $args->theme_location == ‘primary’ )
    return « « .$items;

    How can I hide the a href on the page and just display the image with link?

    Thanks in advance

    Répondre

33. Kathy

    Hi, I think your code is close to what I’m looking for, but I’m trying to figure out how i can customize it to do what I’m trying to do!

    What I am trying to do is create a menu item with dropdown list of authors? any idea how i can accomplish that?

    Thanks so much!

    Répondre

    • Erik Mitjans

      Hi Kathy!

      I was working on this since days and I finally got it working.

      Take a look at: http://wordpress.org/support/topic/creating-a-dropdown-in-menu-that-lists-authors/page/2?replies=45#post-5103035

      Also, take into consideration I’m adding extra classes and attributes cause the theme is Bootstrap based. You might not need all that.

      Cheers!
      Eric

      Répondre

34. sachi

    awesome i was searching these codes

    Répondre

35. Brad

    Thanks this was very helpfull,

    However, out of curiosity, I can’t find this valuable filter hook: « ‘wp_nav_menu_items » , I mean where in WP core files is this being called ??

    Thanks much !!

    Répondre

    • WPBeginner Support

      It is located in wp-includes/nav-menu.php, however it is not recommended to modify core files. It is a filter and you can call it in your theme’s functions.php file or a site specific plugin.

      Répondre

      Administrateur

36. Lavinia

    This isn’t work for me

    Répondre

37. Andor Nagy

    How can I place it in front of the first menu item? Otherwise great tutorial!

    Regards,
    Andor Nagy

    Répondre

    • Editorial Staff

      Use the return example of the search bar and move the items towards the end?

      Répondre

      Administrateur

    • Cameron Jones

      add_filter( ‘wp_nav_menu_items’, ‘your_custom_menu_item’, 10, 2 );

      function your_custom_menu_item ( $items, $args ) {

      $custom = ‘Show whatever’;

      $items = $custom.$items;

      return $items;

      }

      Répondre

38. Murugu

    Pardon my ignorance but which php file would I be editing?

    Répondre

    • Editorial Staff

      This would go in your functions.php file.

      Répondre

      Administrateur

      • Murugu

        I added the following to my theme’s functions.php but the search box doesn’t show up like I would expect. Any suggestions?

        add_filter(‘wp_nav_menu_items’,’add_search_box_to_menu’, 10, 2);
        function add_search_box_to_menu( $items, $args ) {
        if( $args->theme_location == ‘header_extras_inner’ )
        return $items. » »;

        return $items;
        }

        Répondre

39. Elliott Wall

    Sorry to be coming into this discussion so late

    I’ve tried the search form part and it works great— thank you! I’m having problems styling it though, for some reason. No matter what I do the placeholder text in the field is gray. I’ve looked at the cascading of the styles and messed with so many things— I can change the background color for example, but no luck in making the text black, so the design continuity of the menu is somewhat compromised. My site is http://elliottwall.com if you care to have a look. Cheers

    Répondre

    • Editorial Staff

      For placeholder text, you have to do something like this:

      ::-webkit-input-placeholder {
         color: red;
      }
      
      :-moz-placeholder { /* Firefox 18- */
         color: red;  
      }
      
      ::-moz-placeholder {  /* Firefox 19+ */
         color: red;  
      }
      
      :-ms-input-placeholder {  
         color: red;  
      }
      

      Hosted with ❤️ by WPCode

      
      1-click Use in WordPress

      Répondre

      Administrateur

      • Elliott Wall

        This worked perfectly— thank you again!

        Répondre

40. Sam

    Can we add custom link before the first item instead of at the end?

    Répondre

    • xafar Ali

      Yes , just concatenate first instead of last.

      $items = « MENU ITEM  » . $items;

      Répondre

      • piomat

        beer!

        Répondre

41. SAcha

    Hi,

    very interesting!
    I added a custom link, but is it possible to add it in a certain position inside the menu? Like « after the first menu item ».

    Thanks

    Répondre

    • Editorial Staff

      Not sure if that is possible.

      Répondre

      Administrateur