Otsingul täiuslik menüü ...
See on 1. osa tutorial
2. osa see Juhendaja õpetab, kuidas ehitada vertikaalne menüü + tumedat värvi palett horisontaalne
Ma otsustasin, et saada doktoritöö teema , sest üks minu kliendid teavitas mind ühilduvuse probleeme vahel doktoritöö ja minu WordPress liikmeks kohas plugin MemberWing. Ma tegin seda ja siis otsustas võtta lähemalt doktoritöö ja tegelikult viitsi vaadata videoid esilehel põhitees site - Diythemes.com .
Mis muljet mulle kõige rohkem see, tähelepanu detailidele, kasutajasõbralikkuse ja mis kõige tähtsam - SEO funktsioone, mis on nii hästi mõelnud.
MemberWing liikmeks plugin oli projekteeritud maapinnast kuni liikmeks saite, mis oleks vaja tõmmata nii palju SEO mahla kui võimalik. Nii et ma makstud palju tähelepanu paljude SEO lisaseadmete ja täiuslikkuse in MemberWing. Paljud minu kliendid küsivad umbes erinevaid teemasid kasutada ja millel on teema, mis oli nii hästi SEO optimeeritud sügavale oleks suurepärane sobivus liikmeks portaal ettevõtjatele.
Ühendades SEO volitused MemberWing SEO volitused doktoritöö teema annaks parima reitingu võimalusi oma klientidele. Nii et ma sain doktoritöö ja mängitakse seda päeva.
See on suurepärane teema igal viisil. Navigatsiooni osa, kuigi on natuke piiratud funktsioon. Alates Thesis 1,5 + see on ühe taseme menüüs ainult. Minu tavaline soov on, et oleks võimalik kohandada navigation nii palju kui vaja. Mõned saidid on vaid paar lehekülge, paljud teised on tonni staatilisi lehekülgi + zillions artikleid / postitusi + palju kategooriaid.
Nii ideaalne maailm, millel on võimalus luua kena välimusega hierarhiliselt korraldatud kasutajasõbralik navigatsioonimenüü on must. Thesis õigus ära nahkhiir on stiilne navigation kuid ma märkasin, et kõik Lõputöö põhinevad veebilehed otsivad nagu kaksikud. Kohandamine doktoritöö navigatsioonimenüü ei ole tõesti lihtne nii enamik inimesi lihtsalt jätke see nagu on. Ei ole nii, et muuta järjekorras kategooria menüüst või paigutada neid lehekülgede vahel. Ja jälle on võime luua nested menüü struktuurid on puudu. Nii et ma otsustasin vaadata, mida saab teha midagi.
Pärast üritavad umbes pool tosinat menüü / navigeerimise seotud pluginad seadsin minu valik WordPress Navigation Nimekiri Plugin NAVT .
NAVT plugin sisuliselt Tavalise nimekirja generaator super fancy ja veidi raskesti aru ebatraditsiooniline admin liides. Mida eksitav on see, et see ei ole tegelikult luua väljamõeldud otsin menüüd ise. See kõige raskem osa töö küll - annab teile võime visuaalselt koondada ja tekitada Tavalise nimekirja - skelett oma menüü-to-be. Ja võite luua mitu menüüd liiga. Võite tõmmake igasugu WordPress kraami navigatsioonitee: lehti postitusi, artiklid, kategooriad, kasutajate, kood plokid, väliseid linke, sirkel, separaatorid ja segada ja sobitada ja pesa ja korraldada ja kohandada neid iga puu-like struktuur teil tahad.
NAVT genereerib teile tulemuseks HTML Tavalise nimekirja. Teiseks ilu NAVT on, et see aitab teil lisada oma uus menüü oma teema kaudu tuntud jQuery loogika, kuid ei ole vaja muuta ühtegi koodi! NAVT võimaldab määrata: "asendada see # element minu uus NAVT menu". # Element võiks olla id või klassi tee olemasoleva menüü või div element tag mis on loodud oma praeguse teema. Nii NAVT teeb seda sulle vahetust ilma sunnib teid minna teema kood ja teha see räpane kui ta juba on. Kui see kõik kõlab nagu plära - ärge muretsege - ma juhendab teid samm-sammult varsti. Raske osa NAVT kõigile on see, et sa pead tulla tegelike CSS + pildid + javascript kood oma menüü ise. Ja see on sinust aru saada, kus ja kuidas integreerida neid faile ja teha seda kraami korralikult saada ühendatud.
Lugupidamisega tundmata jQuery + mõned PHP + CSS + võttes korralik kogemus WordPress - see asi on raske tõmmata.
Rõõmuga ma tean seda kraami natuke nii et ma otsustasin hammustavad kuuli ja juhend inimkonna vabaduse hoone parimatest parimad navigation menüüd WordPress. Ma lihtsalt vaja teada, allikad mõned kena välimusega horisontaalne CSS menüüsid. Ma valisin dünaamiline sõita veebilehel oma parimad valikud, demod ja allikatest.
Ma pühendatud päev õppida Thesis ja mängida NAVT plugin. Lõpus ma uhkelt loodud kohandatud, paindlik, SEO optimeeritud, mitmetasandiline, nested nagivation struktuur minu WordPress + doktoritöö põhineb sait.
Nimekiri funktsioone mitmetasandilise, nested WordPress navigatsioonimenüü doktoritöö teema
(Sa pead armastama seda kraami):
- Professional, puhas välimus ja meeleolu.
- Toetus kõik kaasaegsed brauserid, sealhulgas MSIE 6,7, Opera, Safari, Firefox 3.x, Google Chrome nii javascript ja mitte-javascript režiimides.
- Nõtkelt downgradable mitte-javascript brauseritega. Sa menüü on kasutatav, visuaalselt sarnased ja töötab isegi JavaScript keelatud brauseritega (kuigi ainult tipptasemel navigatsioon on nähtav ja ei flyouts juhtub muidugi, kui need on tehtud javascript).
- SEO friendly funktsioonid - Tavalise nimekirja menüü kood genereeritakse jooksul HTML. Google'i ja teiste otsingumootori Spiders suudab indeks navigation struktuuri ja leida linke sisemine lehekülgedel.
- Toetus piiramatu pesitsevate tase ja alatasemed.
- Toetus suvalises järjekorras või lehti postitust (via kasutaja määratletud URI), kategooriad, kasutajate, kohandatud koodi plokid ja väliseid linke jooksul menüü.
- Toetus teksti-kui ka pildi-põhine menüü elemente. (Ma ei ole veel proovida neid küll).
- Menüü struktuur ja sisu on visuaalselt akende kaudu NAVT admin piirkonnas.
- Kompaktne: jQuery põhinevate flyouts Pesastatud tasanditel.
- Fast: jQuery menüü laaditud Google serverid (ma armastan Lõputöö ise sama teha asemel tõmmates seda kohapeal). See kiirendab asju natuke.
- Mastaapsuse - Seda tüüpi menüü on muudetav ja kohandatav igal ajal läbi NAVT plugin seadeid ilma vajaduseta kodeerimist kuhugi.
Ma kasutasin seda suurepärast menüü dünaamiline sõita portaal baasina. Pidin kohandada javascript koodi natuke samuti sisaldama patakas PHP arvesse custom_functions.php teha seda tööd koos väitekirja. Ka mitmeid olemasolevaid lehti, kategooriad ja postitusi sivustoni kasutati kokku menüü struktuuri. Saidi eripära on erinevad - kuid mõisted on sama.
Nii et edasi, eks?
Samm-sammult juhiseid, et setup NAVT põhinev nested, kohandatav, mitmetasandiline, SEO friendly
ja lihtsalt lahe vaadata navigatsioonimenüü WordPress ja doktoritöö teema
- Mine WordPress admin panel. Plugins-> Lisa uus otsing "navt". Plugin näidatakse. Klõpsake [Install] [Install now] "Aktiveeri plugin".
- Tööriistad-> NAVT loendid Inside "Navigation Group" ala leida "grupi nimi" ja sisesta "menu1" valdkonnas, press [Loo] nuppu. "Menu1" ristküliku pindala sai loodud.
See "menu1" ala on peamine mänguväljak menüü ehitus. Sul pukseerige siin teie menüü elemente. - In "vara" ala leida "muu" nimekirjakast ja vajuta "Home" valik. "Home" thingie ilmub sees "määramata" piirkonnas. Weird, eh? Ära muretse, kui see toimib - ja see tahe meie jaoks.
- Lohista see "Home" thingie alates "vara" piirkond, "menu1" ristküliku pindala. Sellest saab "Home" menüüst elemendi.
- Korrake samme 3-4 mõned lehed "Pages" piirkonnas, samuti kategooriasse "kategooriatesse" piirkonnas. Lohista muid objekte, et sa tahad olla oma menüü sees "menu1" ristkülik. Te võite klõpsata lehekülgedel, kategooriad, kasutajate ja mõned kohandatud elemendid, nagu "nimekirja jagaja" ja "koodiestossa". Kood plokk on lahe võimalus lisada custom klippe sees menüüs.
- Sa võid lohistada menüü sees "menu1" ala ümber nende järjekord.
- Te võite kohandada hierarhiline positsioon iga menüü koos "<" ja ">" nooli.
- Klõpsates tekst nimi iga menüü - avab meeles Arusaamatu pildi kohandamine dialoog selle objekt. Ma enamasti kasutada vaikimisi, kuid tehniliselt saab hulluks minna ja hakata pilt põhinev menüü valikuid ja lisada tükkideks HTML kood ta. Sõita ettevaatlikult küll.
- Sest linkless unclikable alammenüüd, mis toimib "vanemad" teiste "all-lapsed" Ma "Code block"-tüüpi. Näiteks kui customizing selline koodiestossa kirje astusin jaoks "menüü alias" = "MemberWing" ja "Enter koodiestossa:" = "<a href='#'> MemberWing </ a>." Võttes href = "#" teeb mitte klikitav kuid keda kehtiv "vanem" menüü valik.
- Siin on, kuidas mu NAVT "menu1" build struktuur tundus peaaegu valmis:
- Valmis esialgne hoone ja seejärel nupul "käik" ikoon, et kohandada oma menüü ülesehitus:
- See avab dialoogi, kus 4 kaarti: Valikud, Display, CSS teema.
- Vajuta "Options" sakk ja veenduge, et kõik on märkimata ja "grupi nimi" ütleb: "menu1"
- Mine "Ekraan" tab ja veendumaks, et kõik on "Näita sisukorda rühma ..." ala on kontrollitud [x]. Jäta ülejäänud on vaikimisi.
- Mine "CSS" tab ja valige nupp (x) "Ärge CSS klasse".
- Mine "Theme" tab ja täitke see niimoodi:
Lisada "Lisa sildid enne ..." ala see kood:
<div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
Lisada "Lisa sildid peale ..." ala see kood:
<br style='clear: left' /></div> - Vajutage [salvestada / sulgeda] nuppu
- Siinkohal menüü hoone seest NAVT plugin valikud on valmis.
Nüüd on aeg teha vähe tune up doktoritöö teema, et saada see valmis. Selleks on meil vaja lisada mõned custom faili - CSS ja JavaScript, mis kuulub menüü ja ajakohastatud doktoritöö "custom_functions.php - Lae alla täielik kogum faile siia .
- Unzip arhiivi. Kui olete oma custom_functions.php koos muokkauksesi - teil on vaja liita need minu kraam. Ma jätan selle sulle.
Kui te pole seda puudutanud - julgelt asendada selle minu. Pange tähele: ma eelistasin positsioneerida menüü all veebisaidi päisesse (vaikimisi eespool) - nii minu korrigeerimine ka seda eelistust samuti. - Täiendava arhiiv sealhulgas kõik alamkataloogid ja failid alla oma doktoritöö teema "custom" kataloog, näeb välja selline:
.../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
Ma ei ole puudutanud custom.css - Ma eelistan hoida menüü konkreetse CSS omal kohtades, et ei tekiks jama sees custom.css - Sel hetkel võite laadida oma kodulehel ja vaadake uus ilus uus mitmetasandiline, nested, SEO optimeeritud menüü.
- Te võite alati minna tagasi NAVT seaded ja kohandada oma menüü rohkem valikuid või asetada midagi. See kajastub otsesaidil automaatselt.
Tee ees ...
See õpetus ka loominguline näiteks üht tüüpi menüü. Ma mängisin teisega - lihtsalt näha, kuidas tume menüü näeks:
Lõputöö teema - mitmetasandiline nested CSS menüü - pimedas palett
Ma arvan, et see on päris kena. Seal on palju rohkem navigatsiooni proovide saadaval Dynamic Drive - need kõik on võimalik kohandada jaoks doktoritöö ja muude WordPress teemad mõned jõupingutusi:
Dynamic Drive Horisontaalne menüüd
Loodan, et sa leiad selle juhendaja kasulik ja kasulik. Nagu ma ütlesin, see on võimalik kohandada mis tahes nende menüüsid Lõputöö - mis on antud aega ja soovi, et see juhtuks.
Ma võiks seda teha tööd teile lepingu alusel. Lihtsalt vali menüüst sulle meeldib, võtke mind ja ma tööd koodi ja juhiseid oma veebilehel.
$ 20
Ja muidugi, kui sa oled kuni hoone super SEO optimeeritud Premium Wordpress liikmeks portaal - parim lahendus see:
Doktoritöö teema + MemberWing liikmeks plugin + ise hostitud WordPress muidugi.
Kommentaarid selle kirje on suletud.