Pátrání po dokonalé vertikální menu ...
Část 1 tohoto kurzu je popsáno krok za krokem proces budování horizontální víceúrovňové vnořené menu pro téma práce Wordpress . Část 2 bude pokračovat v posílení této funkce. Zde přidáme "temná" verze horizontální navigační menu a já vás naučí, jak se přepínat mezi "světlé" a "temné" verze. Část 2 je podmnožinou části 1. Zahrnuje všechny z části 1 + přidává další super věci.
Hlavní myšlenka, že bych chtěl prezentovat přidává vertikálním menu na téma disertační práce (a Wordpress obecně). Hledal jsem opravdu flexibilní, SEO přátelská a multi-kompatibilní se všemi prohlížeči vertikálním menu, které by umožnily vytvořit neomezené úrovní vnoření.
Web má spoustu stránek na dané téma, ale když jsem se začal snažit Všechny tyto vzorky - buď se porouchala, rozpadla, podporuje pouze omezený počet úrovní a zlobil v Gates + junksplorer Ballmer 6. Nakonec jsem se vrátil do osvědčené Dynamic Drive menu jako vertikální vzorků prokázaly, že je hezké věci, které se hodí moje přísné požadavky. Musel jsem na podstatnou změnu je však, aby se ujistili, že práce odpovídá model.
Snaha po dokonalosti pokračuje ...
Jsem strávil asi 16 hodin hledání, montáž, zkoušení, stanoví, leštění a ladění vertikálním menu na CSS a. Js kód a 3 / 4 času strávil dělat to pracovat v MSIE 6.
Mimochodem, byl jsem spokojený s konečným výsledkem. Výsledkem vertikální navigační menu má všechny stejné výhody , které má horizontální menu.
S možností přidávat vertikálním menu je velmi důležité, aby o 70-80% portálů na internetu. Horizontální menu má omezenou "prostor" pro umístění nabídky mnoha možností, ale vertikální menu nemá, a toto omezení by pomohlo značně. Tak jdeme na to.
Mnoho kroků, aby se to stalo, jsou již bylo popsáno v části 1 tutorial , takže to bude dělat to o trochu kratší, ale s mnohem více výsledků nabitý funkcemi.
Tak tady to jde:
Stavební SEO friendly, vertikální, víceúrovňový, hierarchicky vnořené menu pro Wordpress a téma disertační práce . Krok za krokem
(... To, co jste nikdy nenapadlo, že to možné ...)
- Instalace php exec plugin a aktivovat. Budeme potřebovat, protože budu používat PHP v udělátku Text vydávat vertikální menu "HTML kód.
- Proveďte kroky 1 - 6 z části 1 tutorial . V podstatě je třeba nainstalovat a aktivovat použití NAVT plugin + vizuálně vytvářet menu. Ujistěte se, že nabídka je název skupiny "menu1". Toto jméno je napevno v custom_functions.php
- Klikněte na "zařízení" ikonu "menu1" skupiny upravit jeho vlastnosti:
- Následující kroky 7,1 -7,3 části 1 tutorial pro nastavení "Options", "Zobrazit" a "CSS" záložek nastavení.
- Nyní klikněte na "téma" záložce dialogu. My přepíše počet nastavení je (pokud jste postupovali podle kroku 1). To je v pořádku - Neztratíte nic - ale tyto změny jsou potřebné, protože jsem změnil nějaký kód z kroku 1.
Zde je návod, jak tento dialog musí být vyplněny:- Uvnitř "Téma XPath:" oblast zadejte tento kód (to příkazy nahradit značku těchto skupin):
.jquerycssmenu, .jqueryslidemenu - Set "Akce" na "Nahradit"
- Uvnitř "Přidat do navigace značek skupiny" oblast zadejte tento kód:
<div class='jquerycssmenu' style='margin-top:5px;'> - Uvnitř "Přidat značek navigaci skupina" oblasti, zadejte tento kód:
<br style='clear: left' /></div> - Klikněte na [Uložit / Zavřít].
- Uvnitř "Téma XPath:" oblast zadejte tento kód (to příkazy nahradit značku těchto skupin):
- Nyní přejděte do Wordpress admin panel -> Vzhled -> Widgety.
- Přetáhněte "Text" widget (z velké "K dispozici widgety" oblast) do "Sidebar 1" na pravé. Budeme přidávat kód do textového widgetu, které nám pomohou k uskutečnění vertikálního menu.
Poznámka: Předpokládám, že jste "Sidebar 1" v existenci. Práce volba umožňuje vypnout - ale pro účely tohoto tutoriálu nechat tak, aby byl. - Jakmile jste přetáhnout tento widget - bude se otevře jako květ (mám pocit, že se romantická MSIE boj je u konce).
- V "hlavě" oblast Enter "nejlepších světových vertikální menu" ... No, neváhejte využít svou kreativitu - že text půjde především nově narozené vertikální menu.
- Ve velkých prostor pro text - zadání tohoto kódu PHP:
<?php
if (function_exists('navt_getlist'))
$menu_html = navt_getlist ('menu1', false, '', 'ul id="dd_vertical"');
else
$menu_html = "";
$menu_html = preg_replace ('#class=[\'\"]jquery(css|slide)menu[\'\"]#', 'class="dd_vertical"', $menu_html);
echo $menu_html;
?> - Stiskněte tlačítko [Uložit], klikněte na tlačítko "Close" link.
- Stáhněte si aktualizovanou sadu souborů zde .
Tento archiv obsahuje:- Aktualizovaná verze "jasný" horizontální menu kód
- "Dark" verze horizontální menu
- Vertikálním menu kódy
- Aktualizovaná verze custom_functions.php
- Nyní je potřeba tento archiv rozbalit a nahrát jej do "vlastního" adresáři téma disertační práce .
Poznámka: pokud jste udělali všechny úpravy uvnitř custom_functions.php - budeš muset sloučit je. Pokud tomu tak není - nebojte se přepsat to na verzi. - Voila! Nyní si můžete znovu načíst vaše webové stránky a uvidíte stejnou "jasné" horizontální menu + neato vertikálním menu v levém sloupci.
- BONUS úkol: Let změny "jasný" horizontálním menu na "temné" barevné schéma.
- Uvnitř custom_functions.php soubor:
nahradit tento kód:
echo "<div class=\"jquerycssmenu\">$menu_html</div>"; // "Bright" menu
//echo "<div class=\"jqueryslidemenu\">$menu_html</div>"; // "Dark" menu
s tímto kódem:
//echo "<div class=\"jquerycssmenu\">$menu_html</div>"; // "Bright" menu
echo "<div class=\"jqueryslidemenu\">$menu_html</div>"; // "Dark" menu
V podstatě jsme komentářů se jeden řádek a odkomentováním druhý. - Nyní přejděte do Wordpress admin-> Nástroje-> NAVT seznamy a klikněte na výše uvedené "rychlost" ikonu upravovat vlastnosti vaší "menu1" skupiny.
- Klikněte na "téma" tab.
- Uvnitř "Přidat do navigace značek skupiny" oblast zadejte tento kód:
<div class='jqueryslidemenu' style='margin-top:5px;'> - Nyní - reload stránky - a hlavní horizontální navigační menu "magicky" potemněla, něco takového:
Téma disertační práce - multilevel vložené CSS menu - tmavá paletu
Tmavá paletu barev může být vhodnější pro určité stránky, než je barva světla jeden. Nyní máte možnost volby ve svém životě!
- Abych se vrátil k "jasné" barevné schéma - jen undo výše uvedené kroky "Bonus".
- Uvnitř custom_functions.php soubor:
- Závěr:
Miluji Téma disertační práce , mám rád Wordpress a já jsem rád, že máme slušné způsoby, jak přidat navigační menu pro naše portály.
20 dolarů
Užijte si to!
Gleb esper
comments } { 5 komentářů }
