Pátranie po dokonalej vertikálnej menu ...

Časť 1 tohto návodu popísané krok za krokom pri budovaní viacúrovňového horizontálne vnorené menu pre tému práce Wordpress . Časť 2 bude pokračovať na posilnenie tejto funkcie. Tu budeme pridávať "tmavý" verziu horizontálne navigačné menu a ja vás naučí, ako sa prepínať medzi "svetlé" a "tmavý" verziu. Časť 2 je podmnožinou časti 1. To zahŕňa všetko od časti 1 + pridáva ďalšie cool veci.

Hlavná myšlienka, že by som chcel prezentovať pridáva vertikálne menu na tému práce (a Wordpress všeobecne). Hľadal som naozaj flexibilné, SEO priateľský a multi-kompatibilný so všetkými prehliadačmi vertikálne menu, ktoré by umožnilo vytvoriť neobmedzené hniezdenia úrovne.

Web má veľa stránok na túto tému, ale keď som sa začal snažiť všetky tieto vzorky - buď sa pokazili, rozpadla, podporovaná len obmedzený počet úrovní a hneval sa Gates a viac junksplorer Ballmer je 6. Nakoniec som sa vrátil do osvedčené Dynamic Drive menu ako ich vertikálne vzoriek ukázal byť pekný prípad, ktorý sa hodí svoje prísne požiadavky. Musel som sa výrazne upravovať aj keď sa uistiť, že padne Diplomový model.
Pátranie po dokonalosti pokračuje ...

Som strávil asi 16 hodín hľadania, montáž, skúšanie, ktorým sa ustanovuje, leštenie a ladenie vertikálne menu na CSS a JS kód týždeň a 3/4 času trávili čo je pre prácu v MSIE 6.
Tak ako tak, bol som spokojný s konečným výsledkom. Výsledkom vertikálnej navigačné menu má všetky rovnaké výhody , že horizontálne menu má.

S možnosť pridať vertikálne menu je veľmi dôležité, aby o 70-80% portálov na internete. Horizontálne menu majú obmedzené "medzera" ubytovať veľa možností menu, ale vertikálne ponuke nemá toto obmedzenie a pomohlo by značne. Tak ideme na to.

Veľa kroky, aby sa to stalo už popísané v časti 1 tutoriálu tak to bude to pre trochu kratšie, ale s oveľa viac funkcií bohatých výsledkov.

Tak tu to ide:

Stavebné SEO priateľský, vertikálne, viacúrovňové, hierarchicky vnorené menu pre Wordpress a tému práce . Krok za krokom
(... To, čo ste nikdy nenapadlo, že to možné ...)

1. Inštalácia php exec plugin a aktivovať. Budeme ho potrebovať, pretože budem používať PHP vnútri textového widgetu vydávať vertikálne menu 'HTML kód.
2. Vykonajte kroky 1 - 6 z časti 1 tutoriálu . V podstate je potrebné nainštalovať a aktivovať pomocou NAVT plugin + vizuálne vytvárať svoje ponuky. Uistite sa, že vaša ponuka je názov skupiny "menu1". Toto meno je napevno v custom_functions.php
3. Kliknite na tlačidlo 'prevodovky' icon pre vášho 'menu1 "skupinou ho upraviť vlastnosti:
   
4. Vyplýva kroky 7.1 -7.3 časti 1 tutoriál k nastaveniu "Options", "Display" a "CSS" záložiek nastavenia.
5. Teraz kliknite na "tému" záložke tohto dialógu. My prepíše počet nastavenia (pokiaľ ste tam boli po kroku 1). To je v poriadku - nestratíte nič - ale tieto zmeny sú nevyhnutné, pretože som zmenil nejaký kód z kroku 1.
   Tu je návod, ako tento dialóg musí byť vyplnené:
   1. Vnútri "Theme XPath:" Oblasť zadanie Tento kód (to prikazuje nahradiť akúkoľvek značku týchto tried):
      .jquerycssmenu, .jqueryslidemenu
   2. Nastavte "akcie" na "Nahradiť"
   3. Vnútri "Pridať značky, ako navigácia skupiny" oblasti zadajte tento kód:
      <div class='jquerycssmenu' style='margin-top:5px;'>
   4. Vnútri "Pridať značiek navigáciu skupiny" oblasti zadajte tento kód:
      <br style='clear: left' /></div>
   5. Kliknite na [Save / zatvoriť] tlačidlo.
6. Teraz prejdite do Wordpress admin panelu -> Vzhľad -> Widgety.
7. Pretiahnite "TEXT" Widget (z veľkého "k dispozícii widgety na plochu) do bočného panela" 1 "priestoru na pravej strane. Budeme pridávať kód do textového prvku, ktorý nám pomôže sa zhmotniť vertikálne menu.
   Poznámka: Predpokladám, že máte "Sidebar 1" v existenciu. Práce voľba umožňuje vypnúť - ale pre účely tohto tutoriálu si nechať to byť.
8. Potom, čo pretiahnuť tento widget - bude sa otvorí ako kvet (som pocit, že sa romantická MSIE boj je u konca).
9. V oblasti "Názov" napíšte "najlepšie svetové vertikálne menu" ... No, neváhajte využiť svoju kreativitu - že text pôjde predovšetkým novo narodeného vertikálne menu.
10. Vo veľkom priestore pre text - zadajte tento kód 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;
?>
11. Stlačte tlačidlo [Uložiť], kliknite na tlačidlo na "Zatvoriť" odkaz.
12. Stiahnite si aktualizovanú sadu súborov tu .
    Tento archív obsahuje:

    
    

    • Aktualizovaná verzia "jasný" horizontálnom menu kódu
    • "Dark" verzie horizontálne menu
    • Vertikálne menu kódy
    • Aktualizovaná verzia custom_functions.php
13. Teraz je potreba tento archív rozbaliť a nahrať ho do 'Vlastné' adresára Téma dizertačnej práce .
    Poznámka: ak ste urobili nejaké úpravy vo vnútri custom_functions.php - by ste mali zlúčiť. Ak tomu tak nie je - pokojne ho prepísať s mojou verziu.
14. Voila! Teraz môžete načítať svoje webové stránky a pozrieť sa na rovnakej "jasný" horizontálne menu + NEAT zvislé menu v ľavom stĺpci.
15. BONUS úloha: Nechajte meniť "jasný" horizontálne menu na "tmavý" farebnej schémy.
    1. Vnútri custom_functions.php súboru:
       nahradiť 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ódom:
       //echo "<div class=\"jquerycssmenu\">$menu_html</div>"; // "Bright" menu
echo "<div class=\"jqueryslidemenu\">$menu_html</div>"; // "Dark" menu
       V podstate sme sa komentuje jeden riadok a odkomentováním tú druhú.
    2. Teraz prejdite do Wordpress admin-> Nástroje-> NAVT zoznamy a kliknite na vyššie uvedený "rýchlosť" ikonu upravovať vlastnosti vašej 'menu1 "skupinou.
    3. Kliknite na "tému" kartu.
    4. Vnútri "Pridať značky, ako navigácia skupiny" oblasti zadajte tento kód:
       <div class='jqueryslidemenu' style='margin-top:5px;'>
    5. Teraz - dobíjanie stránku - a váš hlavný horizontálne navigačné menu "magicky" sa stal tmavý, niečo takéto:
       

       Téma dizertačnej práce - viacúrovňové vnorené CSS menu - tmavá Paleta

       Tmavá farba paleta môže byť vhodnejšie pre určité stránky, ako svetlé farby jeden. Takže teraz máte slobodu voľby vo svojom živote!

    6. Dostať sa späť do "jasný" farebnej schémy - stačí vrátiť späť vyššie uvedené kroky "bonus".
16. Záver:
    Milujem Téma dizertačnej práce , milujem Wordpress a mám rád, že máme slušné spôsoby, ako pridať navigačné menu pre naše portály.

20 dolárov

Užite si to!

Gleb Esman

Tagged as: hierarchické menu pre WordPress a ako stavať wordpress navigáciu a viacúrovňové menu pre WordPress a navigačné menu pre WordPress a tému práce a práce motív ponuky a tézy tému tutoriál a wordpress menu a wordpress navigácie a wordpress vnorené menu