Quest for popoln meni ...

To je del 1 tutorial
Del 2 tega Tutorial uči kako zgraditi vertikalni menu + temno barvno paleto za horizontalnih

Odločil sem se, da bi dobili Thesis tema , saj je eden od mojih strank me obvestili o težavah z združljivostjo med Thesis in moje strani WordPress plugin članstvo MemberWing. Popravil sem in nato odločil, da sprejme bližje pogled na Thesis in dejansko moti, da gledajo video posnetke na prvi strani glavnega mesta Thesis - Diythemes.com .
Kaj me je najbolj navdušil, je pozornost do detajlov, prijaznosti do uporabnika in predvsem - SEO funkcij, ki so tako dobro misel.
MemberWing članstvo plugin je bil zasnovan od tal navzgor za članstvo straneh, ki bi morali vleči toliko SEO soka, kot je mogoče. Zato sem plačal veliko pozornosti množice SEO izboljšave in popolnosti v MemberWing. Veliko moje stranke se sprašuje o različnih temah za uporabo in s temo, ki je bil tako dobro SEO optimizirana iz globoke notranjosti bi se odlično prilegajo za podjetnike članstvo portal.

Združevanje moči SEO od MemberWing s pooblastili SEO od teme Teza bi dal najboljše možnosti za uvrstitev moje stranke. Tako sem dobil Thesis in igral z njim za en dan.

To je odlična tema v vseh njenih oblikah. Del navigacije za to, čeprav je nekoliko omejena v funkciji. Od Thesis 1.5 + je en nivo menija samo. Moja želja je običajno, da bi lahko prilagodite navigacijo toliko kot je potrebno. Nekatera mesta so le nekaj strani, mnogi drugi so ton statične strani + zillions člankov / prispevkov + veliko kategorij.
Torej, v idealnem svetu, ki imajo priložnost, da ustvari lepo videti hierarhično organizirani uporabniku prijazen navigacijski meni je treba. Teza pravico off kij je dobro videti navigacijo, ampak sem opazil, da so vsi Thesis osnovi spletnih straneh, so videti kot dvojčici. Prilagajanje menija Thesis navigacija ni res enostavno tako večina ljudi samo pustite kot je. Ni načina, da spremenite vrstni red kategorij v meniju ali pa jih položaj med stranmi. In spet, zmožnost ustvarjanja ugnezdenih struktur meni manjka. Zato sem se odločil, kaj je mogoče storiti glede tega.
Po približno pol ducata poskušajo menu / navigacija, povezanih plugins sem se moja izbira na Wordpress Seznam Navigation NAVT Plugin .
NAVT plugin je v bistvu neurejen seznam generator s super fancy in malce težko slika netradicionalna admin vmesnik. Kaj zavajajoče pa je, da dejansko ne ustvarjajo fancy videti menijev, ki jih sama. To pa najtežji del delovnih mest, čeprav - vam daje možnost, da vizualno potegnite skupaj, in ustvariti neurejen seznam - okostje vaš menu-to-je. In morda boste ustvarili veliko menijev preveč. Morda potegnite vse vrste stvari Wordpress v navigacijski meni: strani, objave, članki, kategorije, uporabniki, blokov kode, zunanje povezave, delilniki, ločila in premeša in se ujemajo in gnezdo in poskrbi ter jih prilagodite v vsakem drevesu podobni strukturi vas želijo.
NAVT ustvarja za vas povzročilo HTML neurejen seznam. Drugi lepota NAVT je, da vam pomaga, da vstavite svoj nov meni v vašo temo preko znanih JQuery na logiko, vendar brez potrebe po spremembi koli kodo! NAVT vam omogoča, da določite: "nadomestijo ta element # z mojo novo menu NAVT". # Element bi se id ali razred poti obstoječih menija ali tag div element, ki se ustvari z vašo trenutno temo. Torej NAVT pa to zamenjavo, ne da bi za vas prisili, da greš v kodo tema in da bo bolj grdo kot je že to. Če to vse zveni kot žlobudranje - ne skrbite - bom vodič vas korak za korakom kmalu. Zahtevna dela NAVT za vsakogar je, da boste morali prišli do dejanske CSS + slike + javascript kodo za vaš jedilnik sami. In to je odvisno od vas, da ugotovimo, kje in kako vključiti te datoteke in da te stvari pravilno dobili skupaj povezano.
S spoštovanjem, ne da bi vedel JQuery + nekaj PHP + CSS +, ki imajo izkušnje s spodobno Wordpress - ta stvar je težko potegniti.
Z veseljem vem, te stvari malo zato sem se odločil, da ugriz bullet in vodnik človeštva do svobode pri oblikovanju najboljši med najboljšimi navigacijo menijev za Wordpress. Sem potreben, če želite izvedeti vir nekaterih lepo videti horizontalni menije CSS. Pobral sem dinamično vožnjo spletne strani za najboljši izbor, predstavitve in viri.

Jaz posvečen dan za študij Thesis in se igral z plugin NAVT. Na koncu sem ponosno ustvaril po meri, prilagodljivi, SEO optimizirana, več ravneh, ugnezdena nagivation struktura za moje Wordpress + Thesis na mestu.

Seznam funkcij na več ravneh, ugnezdenih Wordpress navigacijski menu za Theme Thesis
(Moraš ljubiti te stvari):

• Professional, čist videz in občutek.
• Podpora za vse sodobne brskalnike, vključno z MSIE 6,7, Opera, Safari, Firefox 3.x, Google Chrome tako v javascript in ne-javascript načine.
• Milina downgradable za ne-javascript brskalnikov. Ti meni bodo uporabne, vidno podobni in delajo celo za invalide brskalnikov javascript (čeprav samo, da bo na najvišji ravni navigacijo biti vidna in ni flyouts se bo zgodilo, seveda, saj so, ki jih je javascript).
• SEO prijazne funkcije - neurejen seznam menu koda je ustvarjen v HTML. Google in drugi iskalnik pajki bo lahko indeks vaše navigacijske strukture in našli povezave na notranje strani.
• Podpora za neomejeno gnezdijo ravni in podravni.
• Podpora za vsako naročilo ali strani, prispevkov (via uporabniško določeno URI), kategorije, uporabniki, po meri blokov kode in zunanje povezave v meniju.
• Podpora besedila, kot tudi slika, ki temelji menu elementi. (Imam še, da bi poskušali te čeprav).
• Meni strukture in vsebine, je vizualno nastavljiva preko admin območja NAVT.
• Compact: JQuery temelji flyouts za ugnezdenih ravni.
• Fast: JQuery za menu je naložen z Google strežnikov (Zelo rad Thesis sam, da storijo enako, namesto da ga vleče na lokalni ravni). To bi pospešilo stvari malo.
• Razširljivost - Ta vrsta meni je mogoče urejati in nastavljiv v vsakem trenutku preko NAVT nastavitve plugin brez potrebe kodiranja kjerkoli.

Včasih sem to odlično menu z dinamično vožnjo portal kot osnovo. Moral sem, da prilagodite javascript kodo bit vključeval pa bo tudi kos PHP v custom_functions.php da bi bilo delo z Thesis. Prav tako je bilo število že obstoječih strani, kategorije in prispevke iz moje strani se uporabljajo za sestavljanje strukture menija. Vaša spletna stran specifike bodo različni - toda koncepti bodo enake.
Torej nadaljuje, prav?

Korak za korakom navodila za namestitev NAVT temelji ugnezdena, prilagodljiv, več ravneh, SEO prijazno
in samo navaden svež ki je videti navigacijski meni za Wordpress in Thesis Theme

1. Pojdi na plošči Wordpress admin. Plugins-> Dodaj novo, iskanje za "navt". Plugin bo prikazan. Kliknite [Install], [Namesti zdaj], "Activate Plugin".
2. Tools-> NAVT seznami, Inside "Navigation Group" območje find "ime skupine" in vpišite: "menu1" na tem področju, pritisnite [Create] gumb. "Menu1" pravokotnik območje got ustvarili.
   Ta "menu1" območje bo glavno igrišče za gradnjo meni. Boste lahko povlečete in spustite tukaj vaš jedilnik elemente.
3. V "sredstva" območje najti "drugo" seznamsko polje in kliknite na "Home" izbira. Bo "Home" thingie videti notranjost "Slobodna" območje. Čudno, kaj? Brez skrbi, dokler deluje - in to bo za nas.
4. Drag to "Home" thingie iz "sredstva" v območje "menu1" območje pravokotnika. To bo postal "Home", postavko v meniju.
   • Ponovite korake 3-4 za nekaj strani iz "Pages" območje, kot tudi za tiste kategorije, v "kategoriji" območje. Povlecite vse druge elemente, ki jih želite, da se na vaš menu znotraj "menu1" pravokotnik. Lahko kliknete na straneh, kategorijah, uporabniki in nekateri elementi, kot so po meri "seznamu divider" in "kodo blok". Kodeks blok je kul način, da dodate po meri odrezke znotraj menija.
   • Lahko povlečete elemente menija znotraj "menu1" območje preurediti vrstni red.
   • Lahko nastavite hierarhični položaj vsakega menija z "<" in ">" puščice.
   • S klikom na ime besedilo vsakega menija - odpre um boggling dodatno prilagoditev pogovorno okno za to postavko. Sem v glavnem uporabljajo privzete, vendar tehnično lahko greš nor in začeli ustvarjati podobe, ki temelji menu izbir in dodamo kose HTML kode v to. Nadaljujte previdno, čeprav.
   • Za linkless unclikable podmenijev, ki bo služil kot "starši" za druge "sub-otroci" Včasih sem "Code blok" tip. Na primer takrat, ko prilagajamo tako postavko kodo blok sem vstopil za "alias postavko Menu" = "MemberWing" in za "Vnesite kodo blok:" = "<a href='#'> MemberWing </ a>". Ob href = "#", bo mogoče klikniti, temveč deluje kot veljaven "staršev" izbira menija.
5. Takole moj NAVT "menu1" graditi strukture videti kot skoraj končan:
   
6. Finish začetne stavbe in nato kliknite na "orodje" ikono, da prilagodite vaš jedilnik strukturo:
   
7. To bo odprlo pogovorno okno z zavihki 4: Možnosti, Display, CSS, tema.
   1. Pojdi na "Options" zavihek in se prepričajte, vse je nenadzorovano in "ime skupine" pravi: "menu1"
   2. Pojdite na "Display" zavihek in se prepričajte, vse na "skupina Show plovbo na ..." je območje preveriti [x]. Pustite ostalo na privzete vrednosti.
   3. Pojdite na "CSS" jeziček in izberite gumb (x) "Ne uporabljati CSS razrede".
   4. Pojdite na "Theme" zavihek in ga izpolnite, kot je ta:
      
      Vstavi v "Add tags pred ..." območje to kodo:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Vstavi v "Add tags po ..." območje to kodo:
      <br style='clear: left' /></div>
   5. Pritisnite [Save / zapiranje] gumb
8. Na tej točki meni stavba od znotraj NAVT plugin možnosti je končana.
   Zdaj je čas, da to malo intonirati za temo diplomske naloge , da se je pripravljena. Za to moramo dodati nekaj po meri datoteke - CSS in JavaScript, ki pripada meni in posodobitev Thesis "custom_functions.php
9. Prenesite celoten nabor datotek tukaj .
10. Unzip arhiv. Če ne boste posodobili svojih custom_functions.php z vaše prilagoditve - jih morate združiti z moje stvari. Bom dopust do vas.
    Če še niste dotaknili - vas prosimo, da ga prepisali s mine. Prosimo, upoštevajte: sem raje položaj menu v glavi spletne strani (privzeto je zgoraj) - tako da moj prilagoditve vključeni to prednost, kot tudi.
11. Naloži arhiv vključno z vsemi podimeniki in datoteke pod vašim Thesis tema imenik "po meri", kot je ta:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    Nisem dotaknil custom.css - raje, da meni, specifične CSS pod svoje lokacije, da se ne ustvarjajo nered v notranjosti custom.css
12. Na tej točki se lahko osvežite vaše spletne strani in videli nov lep nov več ravneh, ugnezdena, SEO optimizirana menu.
13. Vedno se lahko vrnete na NAVT nastavitve in prilagodite vaš menu z več izbire, ali premakniti ničesar. To se bo odražalo v živo na strani samodejno.

Pot naprej ...

Ta Tutorial vključeni ustvarjalni primer enega tipa menija. Igral sem z drugim - samo da bi videli, kako temno bi barve menu videti takole:

Thesis tema - več ravneh ugnezdenih CSS menu - temna paleta

Mislim, da je zelo lepo. Obstaja veliko več navigacijske vzorcev na voljo na Dynamic Drive - vsi so mogoče prilagoditi za delo in druge teme Wordpress z nekaj truda:

Dynamic Drive Horizontalna menijev

Upam, da boste našli to tutorski koristno in uporabno. Kot sem rekel, da je mogoče prilagoditi kateri koli od teh menijev za Thesis - to je glede na čas in željo, da to uresniči.

Lahko bi to delo za vas na podlagi pogodbe. Samo izberite menu vam je všeč, stik z mano in bom delo na kodo in navodila za vašo spletno stran.

20 $

In seveda, če ste do stavbe super SEO optimizirana premium članstvo wordpress portal - najboljša rešitev za to:
Teza Theme + MemberWing članstvo plugin + samo gostila Wordpress seveda.

comments } { 15 komentarji }