Chcete do svého tématu WordPress přidat vlastní navigační nabídky? Navigační nabídky jsou horizontální seznamy odkazů zobrazené v horní části většiny webových stránek.
Ve výchozím nastavení jsou témata WordPressu dodávána s předdefinovanými umístěními a rozvrženími nabídek, ale co kdybyste chtěli přidat vlastní navigační nabídky?
V tomto článku vám ukážeme, jak snadno vytvořit a přidat vlastní navigační nabídky ve WordPressu, abyste je mohli zobrazit kdekoli ve svém tématu.
- Kdy potřebujete tento návod na navigační menu WordPressu?
- Vytvoření vlastních navigačních nabídek v tématech WordPressu
- Zobrazení vlastních navigačních nabídek v tématech WordPressu
- Přidání vlastního navigačního menu ve WordPressu pomocí nástroje pro tvorbu stránek
- Vytvoření responzivních nabídek pro mobilní zařízení ve WordPressu
- Dělejte více s navigačními menu ve WordPressu
Většina témat WordPressu obsahuje alespoň jedno místo, kde můžete zobrazit navigační odkazy webu v menu.
Položky menu můžete spravovat ze snadno použitelného rozhraní uvnitř oblasti administrace WordPressu.
Pokud chcete navigační menu na své webové stránky teprve přidat, pak jednoduše postupujte podle našeho návodu pro začátečníky, jak přidat navigační menu ve WordPressu.
Cílem tohoto návodu je pomoci kutilům / středně pokročilým uživatelům přidat vlastní navigační menu do jejich témat WordPressu.
V tomto článku se budeme zabývat následujícími tématy:
- Vytvoření vlastního navigačního menu v tématech WordPressu
- Zobrazení vlastního navigačního menu v tématu WordPressu
- Přidání vlastního navigačního menu ve WordPressu pomocí nástroje pro tvorbu stránek
- Vytvoření mobilních responzivních menu ve WordPressu
- Další věci, které můžete dělat s navigačními menu WordPressu
Když už jsme to řekli, pojďme se podívat na to, jak přidat vlastní navigační nabídky WordPress do vašeho tématu.
Navigační nabídky jsou součástí témat WordPressu. Každé téma může definovat vlastní umístění a podporu menu.
Chcete-li přidat vlastní navigační menu, musíte nejprve zaregistrovat nové navigační menu přidáním tohoto kódu do souboru functions.php vašeho tématu.
function wpb_custom_new_menu() { register_nav_menu('my-custom-menu',__( 'My Custom Menu' ));}add_action( 'init', 'wpb_custom_new_menu' );
Nyní můžete přejít na stránku Vzhled “ Nabídky v administraci WordPressu a zkusit vytvořit nebo upravit novou nabídku. Jako možnost umístění tématu se zobrazí „Moje vlastní menu“.
Pokud chcete přidat více než jedno nové umístění navigačního menu, pak byste museli použít následující kód:
function wpb_custom_new_menu() { register_nav_menus( array( 'my-custom-menu' => __( 'My Custom Menu' ), 'extra-menu' => __( 'Extra Menu' ) ) );}add_action( 'init', 'wpb_custom_new_menu' );
Pokud jste přidali umístění menu, pokračujte a přidejte některé položky menu v administraci WordPressu podle našeho návodu, jak přidat navigační menu pro začátečníky.
To nám umožní přejít k dalšímu kroku, kterým je zobrazení nabídky v tématu.
Následující krok je zobrazení nové navigační nabídky v tématu WordPressu. Nejčastějším místem, kde se navigační nabídky obvykle umisťují, je část záhlaví webu hned za názvem webu nebo logem.
Navigační menu však můžete přidat kamkoli budete chtít.
Tento kód musíte přidat do souboru šablony vašeho tématu, kde chcete menu zobrazit.
<?phpwp_nav_menu( array( 'theme_location' => 'my-custom-menu', 'container_class' => 'custom-menu-class' ) ); ?>
Umístění šablony je název, který jsme vybrali v předchozím kroku.
Třída kontejneru je třída CSS, která bude přidána do vaší navigační nabídky. Vaše menu se bude na webu zobrazovat jako obyčejný seznam s odrážkami.
Pro stylování menu můžete použít třídu CSS .custom_menu_class
. Zde je ukázka CSS, která vám pomůže začít:
div.custom-menu-class ul { margin:20px 0px 20px 0px; list-style-type: none; list-style: none; list-style-image: none; text-align:right;}div.custom-menu-class li { padding: 0px 20px 0px 0px; display: inline;} div.custom-menu-class a { color:#FFFFFF;}
Chcete-li se o stylování navigačního menu dozvědět více, podívejte se na náš podrobný návod, jak stylovat navigační menu ve WordPressu
Pokud vytváříte vlastní rozvržení vstupní nebo domovské stránky, pak by vám použití pluginu pro tvorbu stránek WordPress celou věc značně usnadnilo.
Doporučujeme použít Beaver Builder, což je nejlepší nástroj pro tvorbu stránek WordPress na trhu. Umožňuje vytvořit jakýkoli typ rozvržení stránky pomocí jednoduchých nástrojů pro přetahování (bez nutnosti kódování).
To zahrnuje také přidání vlastního navigačního menu do rozvržení stránky.
Nejprve je třeba nainstalovat a aktivovat doplněk Beaver Builder. Podrobnější informace naleznete v našem průvodci instalací pluginu WordPress krok za krokem.
Po aktivaci je třeba vytvořit novou stránku nebo upravit stávající, na kterou chcete přidat navigační menu. Na obrazovce editoru příspěvků klikněte na tlačítko „Spustit nástroj Beaver Builder“.
Pokud se jedná o novou stránku, můžete použít jednu z připravených šablon, které jsou součástí nástroje Beaver Builder. Odcházející stránku můžete také ihned upravit.
Následuje přidání modulu Menu a jeho přetažení na stránku na místo, kde chcete menu zobrazit.
Tím se ve vyskakovacím okně zobrazí nastavení modulu Menu. Nejprve je třeba vybrat navigační menu, které chcete použít. Vždy můžete vytvořit nové menu nebo upravit stávající menu tak, že navštívíte stránku Vzhled “ Menu v oblasti administrace WordPressu.
Můžete si prohlédnout i další nastavení. Nástroj Beaver Builder umožňuje zvolit vlastní barvy, pozadí a další vlastnosti stylu nabídky.
Jakmile budete hotovi, můžete kliknout na tlačítko Uložit a prohlédnout si své menu.
Vytvoření responzivních nabídek pro mobilní zařízení ve WordPressu
S nárůstem používání mobilních zařízení můžete chtít, aby vaše nabídky byly přizpůsobeny mobilním zařízením přidáním jednoho z mnoha populárních efektů.
Můžete přidat vysouvací efekt (výše), rozbalovací efekt, a dokonce i přepínací efekt pro mobilní menu.
Máme podrobný návod krok za krokem, jak vytvořit mobilní responzivní menu ve WordPressu.
Navigační menu jsou mocným nástrojem webového designu. Umožňují nasměrovat uživatele na nejdůležitější části webu.
WordPress vám umožňuje mnohem více než jen zobrazovat odkazy v menu. Vyzkoušejte tyto užitečné návody, které rozšíří funkčnost navigačních nabídek na vašem webu WordPress.
- Jak přidat obrázkové ikony s navigačními nabídkami ve WordPressu
- Jak přidat podmíněnou logiku do nabídek ve WordPressu
- Jak přidat popisy nabídek do tématu WordPressu
- Jak přidat celoobrazovkovou responzivní nabídku ve WordPressu
- Jak přidat mega nabídku na web WordPress
To je vše, doufáme, že vám tento dokonalý průvodce pomohl naučit se, jak přidat navigační menu ve WordPressu. Možná si také budete chtít prohlédnout náš seznam 25 nejužitečnějších widgetů pro WordPress a náš seznam pluginů pro WordPress, které musíte mít.
Pokud se vám tento článek líbil, přihlaste se k odběru našeho kanálu YouTube pro videonávody pro WordPress. Najdete nás také na Twitteru a Facebooku.