How to make a dropdown menu in wordpress?

Asked

Viewed 159 times

0

I have an html code of a website I’m developing.

<!-- mega menu -->
<div class="menu">
  <!-- menu start -->
  <nav id="menu-1" class="mega-menu dark">
    <!-- menu list items container -->
    <section class="menu-list-items">
      <div class="container">
        <div class="row">
          <div class="col-lg-12 col-md-12">
            <!-- menu logo -->
            <ul class="menu-logo">
              <li class="head-info">
                <a href="<images/dara_images/logo3.png" alt="logo Sushidara"> </a>
                <div class="head-info-content">
                  <div class="info-left pull-left">
                    <div class="time">
                      <h6>SEG – SEX</h6>
                      <p>Horário: 18:00 – 00:00</p>
                      <h6>SAB – DOM</h6>
                      <p>Horário: 12:00 – 00:00</p>
                      <p>Rua Catete </p>
                      <p> (21) 2222-3333 </p>

                    </div>

                  </div>
                  <div class="info-right pull-right">
                    <div class="address">

                      <p>[email protected] </p>
                       <p>20.550-000 </p>



                      <a href="#"><i class="fa fa-map-o pr-10"></i> Onde estamos</a>
                      <ul class="list-inline mt-15">
                        <li><a href="#"> <i class="fa fa-facebook"></i> </a> </li>
                        <li><a href="#"> <i class="fa fa-instagram"></i> </a> </li>

                      </ul>
                    </div>
                  </div>
                </div>
              </li>
            </ul>


       <!-- menu links -->
            <ul class="menu-links">
              <!-- active class -->
              <li>
                <a class="active" href="index.html"> Home </a>
              </li>
              <li>
                <a href="quem_somos.html"> Quem Somos </a>

              </li>
              <li>
                <a href="javascript:void(0)"> Cardápio <i class="fa fa-angle-down fa-indicator"></i> </a>
                <!-- drop down multilevel  -->
                <ul class="drop-down-multilevel">
                  <li><a href="menu-entradas.html">Entradas</a></li>
                  <li><a href="menu-rollmakimonos.html">Rolls Makimonos</a></li>
                  <li><a href="menu-temakis.html">Temakis</a></li>
                  <li><a href="menu-robatas.html">Robatas</a></li>
                  <li><a href="menu-sashimi.html">Sashimi</a></li>
                  <li><a href="menu-sushiduplas.html">Sushi Duplas</a></li>
                  <li><a href="menu-pratos_quentes.html">Pratos Quentes</a></li>
                  <li><a href="menu-teppan_yaki.html">Teppan Yaki</a></li>
                  <li><a href="menu-yakissoba.html">Yakissoba</a></li>
                  <li><a href="menu-tempura.html">Tempura</a></li>
                  <li><a href="menu-combinados.html">Combinados</a></li>
                  <li><a href="menu-sushidara.html">Sushi Dara</a></li>
                  <li><a href="menu-guarnicoes.html">Guarnições</a></li>
                  <li><a href="menu-sobremesas.html">Sobremesas</a></li>
                  <li><a href="menu-bebidas.html">Bebidas</a></li>

                </ul>
              </li>

            <li>
              <a href="eventos.html"> Eventos  </a></li>


            <li><a href="contato.html"> Contato</a></li>

            <li><a href="promocao.html">Promoções </a></li>

            <li><a href="blog.html">blog </a></li>


             </ul><!-- menu links -->
            <ul class="menu-links">
              <!-- active class -->
              <li>
                <a class="active" href="index.html"> Home </a>
              </li>
              <li>
                <a href="quem_somos.html"> Quem Somos </a>

              </li>
              <li>
                <a href="javascript:void(0)"> Cardápio <i class="fa fa-angle-down fa-indicator"></i> </a>
                <!-- drop down multilevel  -->
                <ul class="drop-down-multilevel">
                  <li><a href="menu-entradas.html">Entradas</a></li>
                  <li><a href="menu-rollmakimonos.html">Rolls Makimonos</a></li>
                  <li><a href="menu-temakis.html">Temakis</a></li>
                  <li><a href="menu-robatas.html">Robatas</a></li>
                  <li><a href="menu-sashimi.html">Sashimi</a></li>
                  <li><a href="menu-sushiduplas.html">Sushi Duplas</a></li>
                  <li><a href="menu-pratos_quentes.html">Pratos Quentes</a></li>
                  <li><a href="menu-teppan_yaki.html">Teppan Yaki</a></li>
                  <li><a href="menu-yakissoba.html">Yakissoba</a></li>
                  <li><a href="menu-tempura.html">Tempura</a></li>
                  <li><a href="menu-combinados.html">Combinados</a></li>
                  <li><a href="menu-sushidara.html">Sushi Dara</a></li>
                  <li><a href="menu-guarnicoes.html">Guarnições</a></li>
                  <li><a href="menu-sobremesas.html">Sobremesas</a></li>
                  <li><a href="menu-bebidas.html">Bebidas</a></li>

                </ul>
              </li>

            <li>
              <a href="eventos.html"> Eventos  </a></li>


            <li><a href="contato.html"> Contato</a></li>

            <li><a href="promocao.html">Promoções </a></li>

            <li><a href="blog.html">blog </a></li>


             </ul>


      </div>
     </div> 
    </div>
   </section>
  </nav>
 <!-- menu end -->
 </div>

but when I want to include in wordpress I do so:

<!-- mega menu -->
<div class="menu">
  <!-- menu start -->
  <nav id="menu-1" class="mega-menu dark">
    <!-- menu list items container -->
    <section class="menu-list-items">
      <div class="container">
        <div class="row">
          <div class="col-lg-12 col-md-12">
            <!-- menu logo -->
            <ul class="menu-logo">
              <li class="head-info">
                <a href="<images/dara_images/logo3.png" alt="logo Sushidara"> </a>
                <div class="head-info-content">
                  <div class="info-left pull-left">
                    <div class="time">
                      <h6>SEG – SEX</h6>
                      <p>Horário: 18:00 – 00:00</p>
                      <h6>SAB – DOM</h6>
                      <p>Horário: 12:00 – 00:00</p>
                      <p>Rua Catete </p>
                      <p> (21) 2222-3333 </p>

                    </div>

                  </div>
                  <div class="info-right pull-right">
                    <div class="address">

                      <p>[email protected] </p>
                       <p>20.550-000 </p>



                      <a href="#"><i class="fa fa-map-o pr-10"></i> Onde estamos</a>
                      <ul class="list-inline mt-15">
                        <li><a href="#"> <i class="fa fa-facebook"></i> </a> </li>
                        <li><a href="#"> <i class="fa fa-instagram"></i> </a> </li>

                      </ul>
                    </div>
                  </div>
                </div>
              </li>
            </ul>


       <!-- menu links -->

       **<?php get_template_part('partials/menu', 'topo' ); ?>**


      </div>
     </div> 
    </div>
   </section>
  </nav>
 <!-- menu end -->
 </div>

Menu-top.php file

<?php     
    wp_nav_menu(    
      array(
            'theme-location' => 'menu-primario',
            'container' => '',
            'menu_class' => 'menu-links'
           )
      );
?>

On the site it looks like this:

[1]: ![images][1] !

Can someone help me ?

  • Isac put in your question the link to your site or its code.

  • www.sushidara.com.br -- this is the site in html, css, , and this is the site inside wordpress, where I am passing the code to be dynamic editable in wordpress http://sushi.tecnologia.ws/

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.