Подменю pathe.nl

Question

Я использую Wordpress, и я хочу создать хорошее подменю для своих пользователей. Я просматривал Интернет и обнаружил здесь хорошее подменю: www.pathe.nl

Как бы я создал такое меню с помощью jQuery, или для этого существует плагин Wordpress?

Любая помощь будет принята с благодарностью.

Мой стиль меню:

<div class="menu-main-nav-container">
   <ul id="menu-main-nav" class="menu">
      <li id="menu-item-51" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-51">
         <a href="/">Home</a>
       </li>
       <li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-23 current_page_item menu-item-50">
           <a href="/locaties/">Locaties</a>
       </li>
       <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49">
           <a href="/acties/">Acties</a>
           <ul class="sub-menu" style="display: block;">
              <li id="menu-item-79" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-79">
                 <a href="/tim/">tim</a>
              </li>
           </ul>
        </li>
        <li id="menu-item-48" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-48">
           <a href="/over/">Over</a>
        </li>
        <li id="menu-item-47" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-47">
            <a href="/contact/">Contact</a>
        </li>
        </ul>
</div>

Это меню, которое я получаю, когда звоню:

 <?php wp_nav_menu( array('menu' => 'Main Nav') ); ?>

Answer 1

Я использовал superfish jquery плагин, чтобы создать меню, похожее на pathe.nl. Разметка вашего меню прекрасно вписывается в этот плагин. Он также поддерживает вложенные пункты меню.

Я никогда не работал с Wordpress самостоятельно, но я предполагаю, что реализовать плагин тривиально. Единственное, что вам нужно добавить на свою страницу, это

<script> 

    $(document).ready(function(){ 
        $("ul.sf-menu").superfish(); 
    }); 

</script>