Doktoritöö teema - mitmetasandiline, nested, SEO friendly menu - Treening

Doktoritöö teema Juhendaja - lisades mitmetasandiline, nested, SEO friendly navigatsioonimenüü Wordpress

poolt gesman kohta 8. juuli 2009

Quest for täiuslik menüü ...

See on 1. osa juhendaja
2. osa selle juhendaja õpetab, kuidas luua vertikaalne menüü + tumedat värvi palett horisontaalne

Ma otsustasin, et saada Thesis teema , sest üks minu kliendid mulle teada umbes ühilduvuse probleeme vahel doktoritöö ja minu WordPress liikmeks kohas plugin MemberWing. I fikseeritud ja siis otsustas võtta lähemal doktoritöö ja tegelikult viitsi vaadata videoid esilehel põhitees site - Diythemes.com .
Mis mulje mulle kõige rohkem see, tähelepanu detailidele, kasutajasõbralikkuse ja kõige olulisem - SEO funktsioone, mis on nii hästi mõelnud.
MemberWing liikmeks plugin oli kavandatud maapinnast kuni liikmeks saite, mis vajaks tõmmake nii palju SEO mahla kui võimalik. Nii et ma maksta palju tähelepanu paljude SEO lisaseadmeid ja perfections aastal MemberWing. Paljud minu kliendid on küsides erinevaid teemasid kasutada ja millel on teema, mis oli nii hästi SEO optimeeritud alates sügaval sees oleks suurepärane sobivaks liikmeks portaali ettevõtjatele.

Ühendades SEO volitused MemberWing SEO volitused annaks parima hinne võimalused minu kliendid. Nii et ma sain magistritöö ja mängitakse seda päeva.

See on suurepärane teema igal viisil. Navigation osa see küll on veidi piiratud funktsioon. Alates Thesis 1.5 + see ühe taseme menüü ainult. Minu tavaline soov on, et oleks võimalik kohandada navigation nii palju kui vaja. Mõned saidid on vaid paar lehekülge, kuid paljud teised on tonni staatilisi lehekülgi + zillions artikleid / postitusi + palju kategooriaid.
Nii et ideaalne maailm, millel on võimalus luua kena otsin hierarhiliselt organiseeritud kasutajasõbralikud navigatsioonimenüü on must. Doktoritöö õigus Kohe on stiilne navigation kuid märkasin, et kõik doktoritöö põhinev veebilehed otsivad nagu kaksikud. Customizing doktoritöö navigatsioonimenüü ei ole tõesti lihtne mistõttu enamik inimesi lihtsalt jätta nagu on. Ei ole võimalik muuta, et kategooria menüüst või seisukohta nende lehekülgede vahel. Ja jälle oskus luua Pesastatud menüü struktuurid on puudu. Seega olen otsustanud vaadata, mida võiks teha midagi.
Pärast üritavad umbes pool tosinat menüü / navigatsiooniga seotud pluginad ma oma valiku Wordpress Navigation List Plugin NAVT .
NAVT plugin on sisuliselt järjestamata loetelu generaator super fancy ja veidi raskesti joonis ebatraditsiooniline admin liidest. Mis eksitav umbes see on, et see ei ole tegelikult luua väljamõeldud otsin menüüde iseenesest. See ei raskeim osa tööd küll - annab sulle võime visuaalselt koondada ja tekitada järjestamata loend - skelett oma menüü-to-be. Ja võite luua mitu menüüd liiga. Te võite tõmmata igasugu Wordpress kraami arvesse navigatsioonimenüü: lehed, postitused, artiklid, kategooriad, kasutajate koodi plokid, väliseid linke, sirkel, eraldaja ja segada ja sobitada ja pesa ja korraldada ja kohandada neid ühegi puu-like struktuur te tahad.
NAVT tekitab teile tulemuseks HTML Tavalise nimekirja. Teiseks ilu NAVT on, et see aitab teil sisestada oma uue menüü oma teema kaudu tuntud jQuery põhineb loogikal, kuid ilma et oleks vaja muuta mingi koodi! NAVT võimaldab teil täpsustada: "asendada selle # element mu uue NAVT menüü". # Element võiks id või klassi tee olemasoleva menüü või div element tag et on loodud oma praeguse teema. Nii NAVT see asendus sa ilma sundides teid minema teema koodi ja muuta see räpane kui ta juba on. Kui see kõik kõlab plära - ärge muretsege - ma juhendab teid samm-sammult kiiresti. Vaidlustada osa NAVT kõigile on see, et pead tulema koos tegelike CSS + pildid + javascript koodi oma menüü ise. Ja see on sinust aru saada, kus ja kuidas integreerida neid faile ja teha see kraam korralikult internetiühendus koos.
Lugupidamisega tundmata jQuery + mõned PHP + CSS + võttes korralik kogemus Wordpress - see asi on raske tõmmata.
Meelega ma tean seda kraami natuke nii ma otsustasin hammustavad kuuli ja juhtida inimkonna vabaduse hoone parimatest parimad navigatsiooni menüü Wordpress. Ma lihtsalt vaja teada, allikad mõne kena otsin horisontaalne CSS menüüsid. Ma valisin dünaamiline juhtida veebisaidi nende parimad valikud, demod ja allikatest.

Ma pühendatud päev õppida doktoritöö ja mängida NAVT plugin. Lõpus I proudly loonud kohandatud, paindlik, SEO optimeeritud, mitmetasandiline, nested nagivation struktuur minu Wordpress + doktoritöö aluseks saidile.

Nimekiri omadused mitmetasandiline, nested Wordpress navigatsioonimenüü jaoks
(Sa pead armastama seda kraami):

  • Professional, puhas välimus ja meeleolu.
  • Toetus kõik tänapäevased brauserid, sealhulgas MSIE 6,7, Opera, Safari, Firefox 3.x, Google Chrome nii JavaScript ja mitte-javascripti olekutes.
  • Nõtkelt downgradable mittekuuluvate javascript brauseritega. Sa menüüs kasutatav visuaalselt sarnased ja töö isegi javascript keelatud brauseritega (kuigi ainult tipptasemel navigation nähtav ja ei flyouts juhtub muidugi, kui need on tehtud JavaScript).
  • SEO sõbralikud omadused - Tavalise nimekirja menüü koodi tekitatud HTML. Google ja teised otsingumootorid ämblikud saavad indeks teie navigation struktuuri ja leida linke sisemine lehekülge.
  • Toetus piiramatu pesitsevate tasanditel ja sublevels.
  • Toetus suvalises järjekorras või lehti, postid (via kasutaja määratud URI), kategooriad, kasutajate kohandatud koodi plokid ja väliste linkide menüüst.
  • Probleemid teksti-kui ka pildi-põhine menüü elemente. (Ma pole veel proovida neid küll).
  • Menüü struktuur ja sisu on visuaalselt reguleeritav kaudu NAVT admin piirkonnas.
  • Kompaktne: jQuery põhineb flyouts jaoks Pesastatud tasanditel.
  • Kiirlink: jQuery puhul on menüü laadida Google serverid (ma armastan doktoritöö ise tegema sama asemel tõmmates seda kohapeal). See kiirendab asju natuke.
  • Skaalautuvuus - Seda tüüpi menüü on muudetav ja kohandatav igal ajal kaudu NAVT plugin seaded ilma vajaduseta kodeerimise kõikjal.

Ma kasutasin seda suurepärast menüü dünaamiline sõita portaali baasi. Mul oli kohandada javascript koodi natuke samuti sisaldama kärjetükkidega PHP arvesse custom_functions.php teha seda tööd koos doktoritöö. Ka mitmeid olemasolevaid lehti, kategooriate ja ametikohta sivustoni kasutati koguda menüüstruktuuris. Teie saidi eripära on erinev - kuid mõisted on samad.
So let jätkata, peab oleme?

Samm-sammult juhiseid setup NAVT põhinev pesastatud, kohandatav, mitmetasandiline, SEO friendly
ja lihtsalt lahe vaadata navigatsioonimenüü Wordpress ja doktoritöö teema

  1. Mine Wordpress admin paneeli. Plugins-> Lisa uus otsing "navt". Plugin ei kuvata. Vajuta [Install] [Install nüüd] "Aktiveeri Plugin".
  2. Tööriistad-> NAVT loendid Inside "Navigation Group" ala leida "grupi nimi" ja sisestage: "menu1" väljal vajutage [Loo] nupule. "Menu1" ristküliku pindala sai loodud.
    See "menu1" valdkonnas on peamised mänguväljak menüü ehitus. Sul pukseerige siia oma menüü elemente.
  3. In "vara" ala leida "muud" nimekirjakasti ja vajuta "Home" valikut. "Kodu" thingie ilmub sees "määramata" piirkonnas. Weird, eh? Ärge muretsege, nii kaua kui see toimib - ja see meile.
  4. Lohista see "Home" thingie andmebaasist "vara" piirkond, "menu1" ristküliku pindala. Sellest saab "Kodu" kirje menüüst.
    • Korrake samme 3-4 mõnda lehekülgi "leheküljed" valdkonnas, samuti kategooriasse "kategooriatesse" piirkonnas. Lohista muid objekte soovite teie menüü sees "menu1" ristkülik. Te võite klõpsata lehekülgedel, kategooriad, kasutajad ja mõned kohandatud elemendid nagu "nimekirja jagaja" ja "koodiestossa". Kood plokk on lahe võimalus lisada kohandatud pikad sees menüüs.
    • Sa võid lohistada menüükirjetele seest "menu1" ala ümberkorraldamiseks nende järjekorras.
    • Võite kohandada hierarhiline positsioon iga menüü koos "<" ja ">" nooli.
    • Klõpsates tekst nimi iga menüü - avab meeles boggling extra kohandamise dialoog sellel kirjel. Ma enamasti kasutada vaikimisi, kuid tehniliselt saab hulluks minna ja hakata pilt põhinev menüü valikuid ja lisada tükkideks HTML koodi sinna sisse. Tegutsema ettevaatlikult küll.
    • Sest linkless unclikable alammenüüd mis toimib "vanemad" teiste "all-lapsed" ma kasutasin "koodiestossa" tüüp. Näiteks kui customizing selline koodiestossa I punktis kirjendatud "Menüükirje alias" = "MemberWing" ja "Enter koodiestossa:" = "<a href='#'> MemberWing </ a>". Võttes href = "#" teeb ta ei tööta, vaid tegutseb kehtiv "emaettevõte" menüüst valik.
  5. Siin on, kuidas mu NAVT "menu1" ehitada struktuur paistis peaaegu lõpule viidud:
    navt_building_icon
  6. Valmis esialgne hoone ja seejärel nupul "käik" ikoonil kohandada oma menüü struktuur:
    navt_customize_menu
  7. See avab dialoogi, milles on 4 kaarti: Valikud Näita, CSS, teema.
    1. Vajuta "Options" sakk ja veenduge, et kõik on märkimata ja "grupi nimi" ütleb: "menu1"
    2. Vajuta "Display" sakk ja veenduge kõike "Näita navigation rühm ..." piirkonnas kontrollitakse [x]. Jäta puhata vaikeseaded.
    3. Vajuta "CSS" tab ja valige nupp (x) "Ärge kandke CSS klassid."
    4. Vajuta "teema" sakk ja täitke see meeldib, et:
      navt_configuration_theme_tab_icon
      Lisada "Add Tags enne ..." ala see kood:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Lisada "Add Tags pärast ..." ala see kood:
      <br style='clear: left' /></div>
    5. Vajuta [salvestada / close] nuppu
  8. Sel hetkel menu hoone seest NAVT plugin valikud on valmis.
    Nüüd on aeg teha vähe tune up for , et saan seda valmis. Selleks vajame veel paar custom faile - CSS ja javascript, mis kuulub menüü ja ajakohastada doktoritöö "custom_functions.php
  9. Lae komplekt failid siin .
  10. Unzip arhiivi. Kui olete oma custom_functions.php koos muokkauksesi - teil on vaja siduda need minu kraam. Ma jätan selle sinu otsustada.
    Kui te ei puudutanud seda - võid vabalt asendada selle minu. Pange tähele: ma eelistasin asendisse menüü all veebilehe päisesse (vaikimisi on suurem) - nii minu korrigeerimine lisanud eelistus samuti.
  11. Lae arhiiv sealhulgas kõik alamkataloogid ja failid alla oma "custom" kataloog, näeb välja selline:
    .../themes/THESIS-DIR/custom/custom_functions.php
    .../themes/THESIS-DIR/custom/jquerycssmenu/...

    Ma ei puudutanud custom.css - ma eelistan hoida menüü konkreetse CSS omal kohtades tekkimise vältimiseks jama sees custom.css
  12. Sel hetkel võite reload oma kodulehel ja vaadake uus ilus uus mitmetasandiline, nested, SEO optimeeritud menüüs.
  13. Te võite alati minna tagasi NAVT seaded ja kohandada oma menüü koos suurema valiku või asetada midagi. See kajastub saidil automaatselt.

Tee ees ...

See õpetus hulka loomingulist näiteks üht tüüpi menüü. Ma mängitakse veel üks - just näha, kuidas tumedast menüü näeb välja selline:

Thesis theme - multilevel nested CSS menu - dark palette

- mitmetasandiline Pesastatud CSS menüü - tume palett

Minu arvates on päris kena. On veel palju navigatsiooni proovide kättesaadav Dynamic Drive - kõik need on võimalik kohandada jaoks doktoritöö ja muud Wordpress teemad mõningase pingutamise:

Dynamic Drive Horizontal Menus

Dynamic Drive Horisontaalne Menüüd

Loodan, et sa leiad selle juhendaja kasulik ja kasulikud. Nagu ma ütlesin, et on võimalik kohandada mis tahes nende menüüde doktoritöö - see on antud aja ja soov muuta see juhtub.

Mida ma võiks teha seda tööd teile lepingu alusel. Lihtsalt vali menüüst soovite, minuga ja ma töö koodi ja juhised oma veebilehel.

$ 20

Ja muidugi, kui oled valmis hoone super SEO optimeeritud Premium Wordpress liikmeks portaal - parim lahendus selline:
Doktoritöö teema + MemberWing liikmeks plugin + füüsilisest võõrustas Wordpress muidugi.

Jäta kommentaar

Eelmine post:

Järgmine post: