Paano Magdagdag ng Mga Custom na Mga menu sa Pag-navigate sa Mga Tema ng WordPress

Nais mo bang magdagdag ng mga pasadyang menu ng nabigasyon sa iyong WordPress tema? Ang mga menu ng Navigation ay ang pahalang na listahan ng mga link na ipinapakita sa tuktok ng karamihan sa mga website.


Bilang default, ang mga tema ng WordPress ay may pre-tinukoy na mga lokasyon at mga layout ng menu, ngunit paano kung nais mong magdagdag ng iyong sariling pasadyang mga menu ng nabigasyon?

Sa artikulong ito, ipapakita namin sa iyo kung paano madaling lumikha at magdagdag ng mga pasadyang menu ng nabigasyon sa WordPress, upang maipakita mo ang mga ito kahit saan sa iyong tema.

Pagdaragdag ng mga pasadyang menu ng nabigasyon sa mga tema ng WordPress

Kailan mo Kailangan ang tutorial na Menu ng Pag-navigate ng WordPress na ito?

Karamihan sa mga tema ng WordPress ay may kahit isang lugar kung saan maaari mong ipakita ang mga link sa pag-navigate ng iyong site sa isang menu.

Maaari mong pamahalaan ang mga item sa menu mula sa isang madaling gamitin na interface sa loob ng iyong WordPress admin area.

Kung naghahanap ka lamang upang magdagdag ng mga menu ng nabigasyon sa iyong website, pagkatapos ay sundin lamang ang gabay ng aming nagsisimula sa kung paano magdagdag ng menu ng nabigasyon sa WordPress.

Ang layunin ng tutorial na ito ay upang matulungan ang mga DIY / intermediate na mga gumagamit na magdagdag ng mga pasadyang menu ng nabigasyon sa kanilang mga tema ng WordPress.

Saklaw namin ang mga sumusunod na paksa sa artikulong ito:

    Pagkasabi nito, tingnan natin kung paano magdagdag ng mga pasadyang mga menu sa pag-navigate sa WordPress sa iyong tema.

    Paglikha ng Pasadyang Mga menu sa Pag-navigate sa Mga Tema ng WordPress

    Ang mga menu ng Navigation ay isang tampok ng mga tema ng WordPress. Ang bawat tema ay maaaring tukuyin ang sariling mga lokasyon ng menu at suporta sa menu.

    Upang magdagdag ng isang pasadyang menu ng nabigasyon, ang unang bagay na kailangan mong gawin ay irehistro ang iyong bagong menu ng nabigasyon sa pamamagitan ng pagdaragdag ng code na ito sa mga function.php file ng iyong tema.

    gumana wpb_custom_new_menu () {
    rehistro_nav_menu (‘my-pasadyang-menu’, __ (‘Aking Pasadyang Menu’));
    }
    add_action (‘init’, ‘wpb_custom_new_menu’);

    Maaari ka na ngayong pumunta Hitsura »Mga menu pahina sa iyong WordPress admin at subukang lumikha o mag-edit ng isang bagong menu. Makikita mo ang ‘Aking Pasadyang Menu’ bilang pagpipilian sa lokasyon ng tema.

    Idinagdag ang pasadyang menu ng nabigasyon sa tema

    Kung nais mong magdagdag ng higit sa isang bagong lokasyon ng menu ng nabigasyon, pagkatapos ay kakailanganin mong gumamit ng isang code tulad nito:

    gumana wpb_custom_new_menu () {
    magparehistro_nav_menus (
    laruan
    ‘my-custom-menu’ => __ (‘Aking Pasadyang Menu’),
    ‘extra-menu’ => __ (‘Dagdag na Menu’)
    )
    );
    }
    add_action (‘init’, ‘wpb_custom_new_menu’);

    Kapag naidagdag mo ang lokasyon ng menu, magpatuloy at magdagdag ng ilang mga item sa menu sa admin ng WordPress sa pamamagitan ng pagsunod sa aming tutorial sa kung paano idagdag ang mga menu ng nabigasyon para sa mga nagsisimula.

    Papayagan kaming mag-move on sa susunod na hakbang na nagpapakita ng menu sa iyong tema.

    Pagpapakita ng Mga Custom na Mga menu sa Pag-navigate sa Mga Tema ng WordPress

    Susunod, kailangan naming ipakita ang bagong menu ng nabigasyon sa iyong WordPress tema. Ang pinakakaraniwang lugar kung saan karaniwang inilalagay ang mga menu ng pag-navigate ay nasa seksyon ng header ng isang website pagkatapos lamang ng pamagat ng site o logo.

    Gayunpaman, maaari mong idagdag ang iyong menu ng pag-navigate saanman gusto mo.

    Kailangan mong magdagdag ng code na ito sa template file ng iyong tema kung saan nais mong ipakita ang iyong menu.

    <?php
    wp_nav_menu (array
    ‘theme_location’ => ‘my-pasadyang-menu’,
    ‘container_class’ => ‘pasadyang-menu-klase’));
    ?>

    Ang lokasyon ng tema ay ang pangalan na napili namin sa nakaraang hakbang.

    Ang klase ng lalagyan ay ang klase ng CSS na idadagdag sa iyong menu ng nabigasyon. Lilitaw ang iyong menu bilang isang simpleng bullet list sa iyong website.

    Pasadyang ipinakita bilang isang simpleng listahan

    Maaari mong gamitin ang klase ng CSS .custom_menu_class upang i-style ang iyong mga menu. Narito ang isang halimbawang CSS upang matulungan kang magsimula:

    div.custom-menu-class ul {
    margin: 20px 0px 20px 0px;
    type-style-type: wala;
    istilo ng listahan: wala;
    list-style-image: wala;
    pag-align ng teksto: tama;
    }
    div.custom-menu-klase li {
    padding: 0px 20px 0px 0px;
    display: inline;
    }
    div.custom-menu-klase ng isang {
    kulay: #FFFFFF;
    }

    Naka-istilong naka-istilong menu

    Upang malaman ang higit pa tungkol sa pag-istilo ng isang menu ng nabigasyon, tingnan ang aming detalyadong tutorial sa kung paano istilo ang mga menu ng pag-navigate sa WordPress

    Pagdaragdag ng isang Custom na Navigation Menu sa WordPress Paggamit ng Tagabuo ng Pahina

    Kung lumilikha ka ng isang pasadyang landing page o layout ng home page, pagkatapos ay gamit ang isang plugin ng tagabuo ng WordPress ay gagawing mas madali ang buong bagay..

    Inirerekumenda namin ang paggamit ng Beaver Builder, na siyang pinakamahusay na tagabuo ng pahina ng WordPress sa merkado. Pinapayagan ka nitong lumikha ng anumang uri ng layout ng pahina gamit ang simpleng pag-drag at pag-drop ng mga tool (walang kinakailangang coding).

    Kasama rin dito ang pagdaragdag ng isang pasadyang menu ng nabigasyon sa layout ng iyong pahina.

    Una, kakailanganin mong i-install at i-activate ang plugin ng Beaver Tagabuo. Para sa higit pang mga detalye, tingnan ang aming hakbang-hakbang na gabay sa kung paano mag-install ng isang plugin ng WordPress.

    Sa pag-activate, kailangan mong lumikha ng isang bagong pahina o mag-edit ng isang umiiral na kung saan nais mong idagdag ang menu ng nabigasyon. Sa screen ng post editor, mag-click sa pindutan ng ‘Ilunsad ang Beaver Tagabuo’.

    Ilunsad ang Beaver Tagabuo

    Kung ito ay isang bagong pahina, pagkatapos ay maaari mong gamitin ang isa sa mga yari na template na kasama ng Beaver Builder. Maaari mo ring mai-edit kaagad ang iyong paglabas ng pahina.

    Pumili ng isang template

    Susunod, kailangan mong magdagdag ng module ng Mga menu at i-drag at i-drop ito sa iyong pahina sa lugar kung saan nais mong ipakita ang menu.

    Magdagdag ng module ng menu sa iyong pahina

    Dadalhin nito ang mga setting ng module ng Menu sa isang popup. Una, kailangan mong piliin ang nabigasyon menu na nais mong gamitin. Maaari kang palaging lumikha ng mga bagong menu o i-edit ang isang umiiral na menu sa pamamagitan ng pagbisita Hitsura »Mga menu pahina sa lugar ng admin ng WordPress.

    Mga setting ng module ng menu

    Maaari mo ring suriin ang iba pang mga setting. Pinapayagan ka ng Beaver Builder na pumili ng mga pasadyang kulay, background, at iba pang mga katangian ng estilo para sa iyong menu.

    Kapag tapos ka na, maaari kang mag-click sa pindutan ng I-save at i-preview ang iyong menu.

    I-preview ang isang pasadyang menu ng nabigasyon na idinagdag sa Beaver Builder

    Paglikha ng Mga Menu na Nakikiramay sa Mobile sa WordPress

    Sa pagtaas ng paggamit ng mga mobile device, maaaring nais mong gawin ang iyong mga mobile-friendly na mga menu sa pamamagitan ng pagdaragdag ng isa sa maraming tanyag na mga epekto.

    Halimbawa ng tumutugon menu

    Maaari kang magdagdag ng isang slide-out na epekto (sa itaas), epekto ng pagbagsak, at kahit na isang toggle effect para sa mga mobile na menu.

    Mayroon kaming isang detalyadong hakbang-hakbang na gabay sa kung paano gumawa ng mga mobile na handa na tumutugon na mga menu ng WordPress.

    Gumawa ng Higit Pa Sa Mga WordPress Navigation menu

    Ang mga menu ng Navigation ay isang malakas na tool sa disenyo ng web. Pinapayagan ka nilang ituro ang mga gumagamit sa pinakamahalagang mga seksyon ng iyong website.

    Pinapayagan ka ng WordPress na gumawa ng higit pa kaysa sa pagpapakita lamang ng mga link sa iyong menu. Subukan ang mga kapaki-pakinabang na tutorial na ito upang mapalawak ang pag-andar ng mga menu ng nabigasyon sa iyong WordPress site.

    • Paano magdagdag ng mga icon ng imahe na may mga menu ng nabigasyon sa WordPress
    • Paano magdagdag ng kondisyong lohika sa mga menu sa WordPress
    • Paano magdagdag ng mga paglalarawan sa menu sa iyong tema ng WordPress
    • Paano magdagdag ng isang fullscreen na tumutugon menu sa WordPress
    • Paano magdagdag ng isang menu ng mega sa iyong WordPress site

    Iyon lang, inaasahan namin na ang pangunahing gabay na ito ay nakatulong sa iyo na malaman kung paano magdagdag ng isang menu ng nabigasyon sa WordPress. Maaari mo ring makita ang aming listahan ng 25 pinaka kapaki-pakinabang na mga widget ng WordPress, at ang aming listahan ng mga kinakailangang magkaroon ng mga plugin ng WordPress.

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
      Like this post? Please share to your friends:
      Adblock
      detector
      map