Il-Quest għall-menu perfetta ...

Dan huwa parti 1 ta 'l-tutorja
Parti 2 ta 'dan tutorja tgħallem kif jibnu menu vertikali + paletta kulur skur għall-waħda orizzontali

I iddeċieda li nikseb tema Thesis , għaliex wieħed mill-klijenti tiegħi infurmani dwar kwistjonijiet ta 'kompatibilità bejn Thesis u tiegħi sħubija wordpress plugin sit MemberWing. I fiss u mbagħad ddeċidiet li tagħti ħarsa aktar mill-qrib Thesis u attwalment bothered biex tara videos fuq il-paġna ta 'quddiem tas-sit Teżi prinċipali - Diythemes.com .
Liema impressjonat lili l-aktar hija l-attenzjoni għad-dettall, faċli li jinftiehem u fuq kollox - karatteristiċi SEO li huma tant tajjeb ħsibt.
Plugin sħubija MemberWing kienet imfassla mill-art għall-siti ta 'sħubija li hemm bżonn biex jiġbdu kemm meraq SEO bħala possibbli. So I mħallsa lottijiet ta 'attenzjoni għal numru kbir ta' SEO titjib u perfections fl MemberWing. Ħafna mill-klijenti tiegħi stess qed tistaqsi dwar temi differenti għall-użu u wara li tema li kien tant tajjeb SEO ottimizzati minn ġewwa fil-fond tkun tajbin eċċellenti għall-intraprendituri portal sħubija.

Setgħat Jikkombinaw SEO tal MemberWing b'setgħat SEO ta ' tema Thesis jagħti l-aħjar ta 'opportunitajiet klassifikazzjoni lill-klijenti tiegħi. Allura sirt Thesis u kellha magħha għal jum.

Huwa tema eċċellenti fil-manjieri kollha. Il-parti ta 'navigazzjoni ta' dan għalkemm huwa daqsxejn limitata fil-funzjoni. Tibda mill-Thesis 1.5 + huwa menu livell wieħed biss. Xewqa tas-soltu tiegħi huwa li tkun tista 'customize navigazzjoni daqs kemm meħtieġ. Xi siti għandhom biss ftit paġni, ħafna oħrajn għandhom tunnellata ta 'paġni statika + zillions ta' artikoli / postijiet + lottijiet ta 'kategoriji.
Allura fid-dinja ideali jkollhom iċ-ċans li toħloq sympathique tfittex ġerarkikament organizzati utent menu tan-navigazzjoni faċli huwa għandu. Dritt teżi barra l-BAT tkun tajba navigazzjoni tfittex iżda I ndunat li l-websajts kollha bbażati fuq Thesis qed tfittex simili tewmin. Customizing menu tan-navigazzjoni Thesis mhuwiex verament faċli sabiex ħafna nies biss jitilqu minnu bħala huwa. M'hemm l-ebda mod għall-bidla-ordni ta 'kategoriji fil-menu jew il-pożizzjoni tagħhom fl bejn paġni. U għal darb'oħra, il-kapaċità li joħolqu strutturi menu nested hija nieqsa. So I iddeċieda li tara x'jista 'jsir dwar dan.
Wara li jippruvaw madwar nofs tużżana menu plugins / navigazzjoni relatati I sett għażla tiegħi fuq Wordpress Plugin Navigazzjoni NAVT Lista .
Plugin NAVT huwa essenzjalment unordered lista ġeneratur ma fancy super u daqsxejn diffiċli biex figura interface admin untraditional. Dak qarrieqa dwar dan hija li din attwalment ma joħolqu menus fancy tfittex minnu stess. Ma l-parti l-agħar ta 'xogħol għalkemm - jagħtik l-abbiltà li viżwalment tiġbed flimkien, u jiġġeneraw unordered lista - iskeletru tal tiegħek menu iridu jiġu. U inti tista 'toħloq menus ħafna wisq. Inti tista 'iġbed kull tip ta' għalf Wordpress fil-menu tan-navigazzjoni: paġni, postijiet, artikoli, il-kategoriji, l-utenti, blokki tal-kodiċi, links esterni, dividers, separaturi u ħawwad u match u bejta u jirranġa u jippersonalizzaw minnhom fi kwalunkwe struttura ta 'siġra-bħalek tixtieq.
NAVT jiġġenera għalik irriżulta HTML unordered lista. Sbuħija tieni NAVT huwa li jgħin li inti daħħal menu ġdida tiegħek fis tema tiegħek permezz loġika jQuery famużi bbażati imma mingħajr il-bżonn li tbiddel kwalunkwe kodiċi! NAVT jippermettilek li jispeċifikaw: "jissostitwixxu dan l-element # ma menu tiegħi NAVT ġodda". # Element jista 'jkun id jew klassi ta' passaġġ ta 'menu eżistenti jew tikketta div element li qed iġġenerat mill tema attwali tiegħek. Allura NAVT ma din is-sostituzzjoni għalik mingħajr ma jkunu sfurzati li inti tmur fis code tema u jagħmilha aktar messy milli diġà hi. Jekk dik l-ħsejjes bħal gibberish - tinkwetax - I ser niggwidawk pass pass hekk. Il-parti ta 'sfida ta NAVT għal kulħadd hija li inti ser ikollok toħroġ bi attwali CSS + immaġini kodiċi javascript + għal menu tiegħek innifsek. U huwa sa inti biex insemmu fejn u kif għandha tintegra dawn il-fajls u tagħmel dan il-għalf kif suppost tikseb konnessi flimkien.
Dejjem tiegħek mingħajr ma jkunu jafu jQuery + xi PHP + + CSS li jkollhom esperjenza deċenti ma Wordpress - din hija ħaġa diffiċli li jattira.
Gladly Naf li dan Jittieħed ftit so I iddeċieda li gidma l-bullet u l-umanità gwida għal-libertà fil-bini l-aħjar ta 'l-menus ta' navigazzjoni aħjar għall Wordpress. I biss meħtieġa biex issir taf sorsi għal xi menus sbieħ tfittex CSS orizzontali. I telgħet il-websajt tas-sewqan dinamiku għall-selezzjonijiet aħjar tagħhom, demos u s-sorsi.

I ddedikata kuljum għall-istudju Thesis u jilagħbu bil plugin NAVT. Fl-aħħar I kburi maħluqa tad-dwana, flessibbli, SEO ottimizzati,, nested f'diversi nagivation struttura għall-sit tiegħi Wordpress Thesis + bbażati.

Lista ta 'karatteristiċi ta', nested f'diversi navigazzjoni Wordpress menu għall Thesis Tema
(GTT inti imħabba dan il-għalf):

• Professjonali, ħarsa nadif u jħossu.
• Appoġġ għall-browsers moderni, inklużi MSIE 6.7, Opera, Safari, Firefox 3.x, Google Chrome kemm fil javascript u mhux javascript modi.
• Gracefully downgradable għal nuqqas ta 'JavaScript browsers. Inti menu se tkun tista 'tintuża, viżivament simili u tax-xogħol anke għall-browsers javascript b'diżabilità (għalkemm biss navigazzjoni ogħla livell se jkun viżibbli u l-ebda flyouts se jiġri tal-kors kif inhuma magħmula minn javascript).
• Karatteristiċi SEO friendly - unordered kodiċi menu lista huwa ġġenerat fil-HTML. Google u search engine Brimb oħra se jkunu jistgħu indiċi istruttura tan-navigazzjoni tiegħek u sib links għal paġni ta 'ġewwa.
• Appoġġ għal-livelli ibejtu bla limitu u sublevels.
• Appoġġ għal kull ordni jew il-paġni, postijiet (permezz utent definiti URIs), il-kategoriji, l-utenti, blokki tal-kodiċi tad-dwana u links esterni fi ħdan il-menu.
• Appoġġ ta 'test kif ukoll elementi menu immaġni bbażati fuq. (I għadhom ma tipprova dawn għalkemm).
• Struttura ta 'menu u l-kontenut huwa viżwalment aġġustabbli permezz qasam admin NAVT.
• Compact: flyouts bbażati jQuery għal livelli nested.
• Fast: jQuery għall-menu huwa mgħobbi minn servers Google (I imħabba d Thesis ruħha li tagħmel l-istess minflok tiġbdu lokalment). Dan jitħaffef affarijiet daqsxejn.
• Iskalabbiltà - Dan it-tip ta 'menu huwa editable u konfigurabbli fi kwalunkwe ħin permezz settings plugin NAVT mingħajr il-ħtieġa ta' kodifikazzjoni kullimkien.

I użat dan il-menu eċċellenti mill-hard dinamiku portal bħala bażi. I kellha biex jippersonalizzaw kodiċi javascript daqsxejn kif ukoll tinkludi blokki ta 'PHP fis custom_functions.php biex jagħmluha taħdem ma' Thesis. Wkoll in-numru ta 'pre-eżistenti paġni, kategoriji u l-postijiet minn sit tiegħi kienu użati biex tgħaqqad struttura ta' menu. Ispeċifiċitajiet sit tiegħek se jkun differenti - imma kunċetti se tkun l-istess.
Mela ejja tipproċedi, għandhom aħna?

Istruzzjonijiet pass pass biex setup NAVT bbażati fuq nested, customizable, f'diversi livelli, SEO friendly
u biss sempliċi jibred tfittex menu tan-navigazzjoni għall Wordpress u Thesis Tema

1. Mur fil Wordpress admin panel. Plugins-> Żid ġodda, tfittxija għal "navt". Il-plugin se jintwerew. Ikklikkja [Installa], [Installa issa], "Activate Plugin".
2. Għodod-> Listi NAVT, Ġewwa "Navigazzjoni Grupp" żona isibu "grupp isem" u jidħlu: "menu1" fil-qasam, agħfas [Oħloq] buttuna. Żona "menu1" rettangolu ltqajna maħluqa.
   Din l-"menu1" żona se tkun l-bitħa prinċipali għall-kostruzzjoni menu. Int ser tkun sejjer u twaqqa hawn elementi menu tiegħek.
3. Fil-"assi" żona isibu "oħrajn" listbox u kklikkja fuq "Home" għażla. "Home" thingie se jidhru ġewwa ta '"alla mhux allokat" żona. Stramb, eh? Nru inkwiet, sakemm taħdem - u se għalina.
4. Drag dan il-"Home" thingie minn "assi" żona fiż-żona "menu1" rettangolu. Huwa se jsir "Home" oġġett fil-menu.
   • Irrepeti passi 3-4 għal xi paġni minn "Paġni" żona, kif ukoll għall-kategoriji fil-"kategoriji" żona. Drag kwalunkwe oġġetti oħra li inti tixtieq li tkun fuq menu tiegħek ġewwa "menu1" rettangolu. Inti tista 'tikklikkja fuq il-paġni, kategoriji, l-utenti u xi elementi tad-dwana bħal "diviżur lista" u "kodiċi blokk". Blokk Kodiċi huwa mod jibred biex iżżid siltiet tad-dwana ġewwa l-menu.
   • Inti tista 'drag oġġetti menu ġewwa "menu1" żona li rranġati ordni tagħhom.
   • Inti tista 'taġġusta l-pożizzjoni ġerarkika ta' kull oġġett menu ma "<" u ">" vleġeġ.
   • Meta tikklikkjaw fuq l-isem sħiħ ta 'kull oġġett menu - jiftaħ mind boggling żejda adattament dialog għal din il-partita. I-aktar użati nuqqasijiet iżda teknikament inti tista 'tmur crazy u jibdew jagħmlu għażliet menu immaġni bbażati fuq u żid biċċiet ta' HTML code fis dan. Tipproċedi b'kawtela għalkemm.
   • Għal submenus unclikable linkless li se jservu bħala "ġenituri" għal oħra "sub-tfal" I użati "Kodiċi blokk" tip. Per eżempju meta customizing tali oġġett blokk kodiċi I daħal għal "Menu partita alias" = "MemberWing" u għal "Ikteb blokk tal-kodiċi:" = "MemberWing href='#'> <a </ a>". Wara li href = "#" se tagħmilha mhux clickable imma li jaġixxu bħala validu "prinċipali" għażla menu.
5. Ara kif NAVT tiegħi "menu1" istruttura jibnu dehru qishom kważi tlesta:
   
6. Jitkompla l-ħolqien tal-bidu u mbagħad ikklikkja fuq "tagħmir" ikona biex jippersonalizzaw struttura ta 'menu tiegħek:
   
7. Hija se tiftaħ dialog mal 4 Korpi għal Valutazzjoni Teknika: Għażliet, Display, CSS, Tema.
   1. Mur fil-"Options" tab u kun żgur li kollox huwa mingħajr xkiel u "grupp isem" jgħid: "menu1"
   2. Mur "Display" tab u jagħmel kollox żgur fuq "grupp ta 'navigazzjoni Uri fuq ..." żona hija kkontrollata [x]. Tħalli l-bqija fil nuqqasijiet.
   3. Mur "CSS" tab u tagħżel buttuna tar-radju (x) "Ma japplikax klassijiet CSS".
   4. Mur "Tema" tab u imla fil bħal dik:
      
      Daħħal fis-"Żid tikketti qabel ..." żona dan il-kodiċi:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Daħħal in "tikketti Żid wara ..." żona dan il-kodiċi:
      <br style='clear: left' /></div>
   5. Agħfas [tiffranka / mill-qrib] buttuna
8. Fuq dan il-bini menu punt minn ġewwa għażliet plugin NAVT hija kompluta.
   Issa wasal iż-żmien biex jagħmlu tixgħel ftit għall- tema Thesis biex tiksbu lest. Għal dak għandna bżonn li żżid fajls tad-dwana ftit - CSS u JavaScript li tappartjeni għall-menu u custom_functions.php Teżi taġġorna "
9. Niżżel is-sett sħiħ ta 'fajls hawn .
10. Unzip arkivju. Jekk għandek aġġornati custom_functions.php tiegħek mal customizations tiegħek - għandek bżonn biex jingħaqdu ma Jittieħed tiegħi. I ser tħalli f'idejn lilek.
    Jekk int ma jintmess - tħossok liberu li jissostitwixxu ma minjiera. Jekk jogħġbok innota: I preferuta għall-pożizzjoni menu taħt l-intestatura websajt (default hawn fuq) - sabiex l-aġġustament tiegħi inkluża din il-preferenza kif ukoll.
11. Tella arkivju inklużi l-subdirectories u fajls taħt tiegħek Thesis tema direttorju "custom", bħal din:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    I ma jintmessx custom.css - I jippreferu jżommu menu speċifiċi CSS taħt postijiet tagħhom stess sabiex jiġi evitat li jinħolqu mess ġewwa custom.css
12. F'dan il-punt inti tista rikarigu-website tiegħek u ara sbieħ ġodda ġodda f'diversi livelli, nested, menu SEO ottimizzati.
13. Inti tista 'dejjem tmur lura lejn NAVT settings u jippersonalizzaw menu tiegħek aktar għażla jew jerġgħhu jagħtu posizzjoni xejn. Għandu jkun rifless fuq is-sit ħajjin awtomatikament.

It-triq 'l quddiem ...

Dan tutorja inkluda eżempju kreattivi ta 'tip wieħed ta' menu. I lagħbu ma 'ieħor - biss biex tara kif skur kkulurita menu look like:

Tema Thesis - f'diversi livelli menu nested CSS - paletta dlam

Naħseb li huwa pjuttost sbieħ. Hemm ħafna kampjuni ta 'navigazzjoni disponibbli fuq Drive dinamiċi - kollha kemm huma possibbli biex jippersonalizzaw għall-Thesis u temi oħra Wordpress bi ftit sforz:

Menus dinamika orizzontali Drive

Nispera li inti ser issib dan tutorja benefiċċju u utli. As I said, huwa possibbli li customize xi wieħed minn dawn menus għall Thesis - li hija mogħtija ħin u xewqa biex dan iseħħ.

I jistgħu jagħmlu dan ix-xogħol għalik fuq bażi ta 'kuntratt. Biss pick-menu li tixtieq, tikkuntattja lili u jien ser jaħdmu fuq il-kodiċi u l-istruzzjonijiet għall-website tiegħek.

$ 20

U ovvjament jekk int up għall-bini super SEO ottimizzati primjum sħubija wordpress-portal - l-aħjar soluzzjoni għal dan:
Tema Thesis + sħubija MemberWing plugin + awto ospitat Wordpress tal-kors.

comments } { 15 kummenti }