Ang paghahanap para sa mga perpektong menu ...

Ito ay Part 1 ng tutorial
Part 2 ng tutorial na ito ay nagtuturo kung paano bumuo ng vertical menu + maitim ang kulay ng palette para sa mga pahalang ng isa

Ako nagpasyang kumuha tesis tema, dahil ang isa sa aking mga kliyente alam sa akin tungkol sa mga isyu sa compatibility sa pagitan ng mga sanaysay at sa aking wordpress ng pagiging miyembro ng site na plugin MemberWing. Ako taning na ito at pagkatapos ay nagdesisyon na kumuha ng mas masusing pagtingin sa sanaysay at ang tunay na bothered upang makapanood ng mga video sa harap ng pahina ng mga pangunahing tesis site - Diythemes.com.
Ano impressed sa akin ang pinaka ay pansin sa detalye, ang user kabaitan at higit sa lahat - SEO tampok na kaya rin ng mga pag-iisip.
MemberWing pagiging kasapi ng plugin ay ginawa mula sa lupa up para sa pagiging kasapi ng mga sites na kailangan sa pull ng mas maraming SEO juice hangga't maaari. Kaya ko bayad na maraming pansin sa maraming tao ng mga pagpapahusay SEO at perfections sa MemberWing. Marami sa aking sariling mga kliyente ay nagtatanong tungkol sa iba't-ibang tema gamitin at ang pagkakaroon ng tema na ito ay mabuti SEO optimized mula sa malalim na loob ay isang mahusay na angkop para sa pagiging kasapi ng portal na negosyante.

Kombinasyon ng kapangyarihan ng SEO MemberWing na may kapangyarihan SEO ng sanaysay tema na nais magbigay ng pinakamahusay na ranggo ng mga pagkakataon para sa aking mga kliyente. Kaya ang nakuha ko sanaysay at nilalaro sa mga ito para sa isang araw.

Ito ay isang mahusay na tema sa lahat ng paraan. Ang nabigasyon bahagi ng mga ito kahit kaunti ay isang limitadong sa function. Simula mula sa sanaysay 1.5 + ito ay isa sa antas ng menu lamang. Aking dati pagnanais ay para ma-customize nabigasyon gaya ng kinakailangan. Ang ilang mga site na may lamang ng ilang mga pahina, marami pang iba ay may tons ng mga static na pahina + ng zillions articles / posts + lots ng mga kategorya.
Kaya sa ideal na mundo sa pagkakaroon ng isang pagkakataon upang gumawa ng nice naghahanap hierarchically organisado user friendly navigation menu ay dapat. Sanaysay karapatan patayin ang paniki ay may mabuting naghahanap nabigasyon ngunit napansin ko na ang lahat ng sanaysay-based na mga website ay naghahanap ng tulad ng Twins. Pagpapasadya ng sanaysay navigation menu na ito ay hindi tunay madali kaya ang karamihan sa tao lang umalis ito bilang ay. Walang paraan upang baguhin ang pagkakasunud-sunod ng mga kategorya sa menu o posisyon ang mga ito sa pagitan ng mga pahina. At muli, ang kakayahang lumikha ng nakapugad na kayarian ng menu ay nawawala. Kaya ko nagpasya na makita kung ano ang maaaring gawin.
Pagkatapos ng pagsubok tungkol sa kalahating dosena menu / nabigasyon kaugnay na plugins ako magse-set ang aking mga pagpipilian sa Wordpress Nabigasyon List Plugin NAVT.
NAVT plugin ay mahalagang unordered listahan ng generator sa sobrang fancy at isang bit hard-to-tayahin untraditional admin interface. Ano ang totoo tungkol dito ay na ito ay hindi tunay na lumikha ng magarbong naghahanap ng mga menu sa pamamagitan ng kanyang sarili. Ito ay ang hardest bahagi ng trabaho kahit na - ay nagbibigay sa iyo ng kakayahan upang visually pull sama-sama, at makabuo ng mga unordered list - balangkas ng iyong menu-to-be. At maaari kang lumikha ng maraming mga menu masyadong. Maaari kang humingi ng pabor sa lahat ng uri ng Wordpress bagay-bagay sa menu navigation: mga pahina, posts, articles, mga kategorya, gumagamit, ang code blocks, panlabas na link, dibaydes, separators at ihalo at tugma at pugad at ayusin at ipasadya ang mga ito sa anumang puno-gusto mo na istraktura gustong.
NAVT bumubuo ng para sa iyo na nagdulot ng HTML unordered list. Ikalawang kagandahan ng NAVT na ito ay tumutulong sa iyo upang ipasok ang inyong bagong menu sa iyong tema sa pamamagitan ng sikat na JQuery base lohika ngunit walang kailangan baguhin ang anumang code! NAVT ay nagbibigay-daan sa iyo upang tukuyin ang: "palitan na ito # elemento sa aking bagong NAVT menu". # sangkap ay maaaring isang id o klase ng path ng mga umiiral na menu o div sangkap ng tag na ay nabuo sa pamamagitan ng inyong kasalukuyang tema. Kaya NAVT ang kapalit na ito para sa iyo nang walang pagpwersa sa inyo na pumunta sa tema code at gawin itong mas marumi kaysa ito ay mayroon na. Kung na ang lahat ng tunog tulad ng satsat - huwag mag-alala - kukunin ko na gabay mo hakbang-hakbang sa madaling panahon. Ang mahirap na bahagi ng NAVT para sa lahat na ay mayroon kang magkaroon ng tunay na CSS + + imahe javascript code para sa iyong menu ng iyong sarili. At ito ay hanggang sa inyo na malaman kung saan at kung paano na isama ang mga file na ito at gumawa ng mga bagay-bagay na ito nang maayos kumuha konektado sama-sama.
Nang buong puso ng walang pag-alam sa JQuery ilang + PHP + + CSS sa pagkakaroon ng disenteng karanasan sa Wordpress - ito bagay ay mahirap pull.
Masaya alam ko ito mga bagay-bagay ng isang bit kaya ako nagpasyang kagat ng bala at gabay sa sangkatauhan sa kalayaan sa gusali sa pinakamahusay na ang pinakamahusay na mga menu nabigasyon para sa Wordpress. Ko na lang na kailangan upang malaman ang pinagmumulan ng para sa ilang mga nice naghahanap ng pahalang menu CSS. Ako pumili ng dynamic drive ng website para sa kanilang mga pinakamahusay na mga pagpili, na demo at mga mapagkukunan.

Ako nakatutok sa isang araw sa pag-aaral sanaysay at makipaglaro sa NAVT plugin. Sa katapusan ko buong kapurihan nilikha custom, flexible, SEO-optimized, multilevel, nakapugad nagivation istraktura para sa aking Wordpress + site sanaysay base.

Talaan ng mga katangian ng multilevel, nakapugad menu Wordpress nabigasyon para sa tisis Theme
(got mong pag-ibig na ito bagay-bagay):

• Professional, malinis ang hitsura at pakiramdam.
• Support para sa lahat ng mga modernong browser, kabilang ang mga MSIE 6,7, Opera, Safari, Firefox 3.x, ang Google kromo sa parehong javascript at non-javascript mode.
• Maganda downgradable para sa mga di-javascript sa browser. Ikaw menu ay magiging kapaki-pakinabang, visually katulad at nagtatrabaho kahit para sa javascript pinigilan browser (albeit lamang sa tuktok na antas ng navigation ay makikita at walang flyouts ang mangyayari ng kurso tulad ng mga ito ay ginawa sa pamamagitan ng javascript).
• SEO friendly na mga katangian - unordered listahan ng menu code ay nabuo sa loob ng HTML. Google at sa iba pang mga search engine spiders ay maaaring makapag-index ng iyong nabigasyon istraktura at maghanap ng mga link sa mga panloob na pahina.
• Suporta para sa mga walang limitasyong nesting na antas at sublevels.
• Suporta para sa anumang kaayusan o mga pahina, post (sa pamamagitan ng tinukoy ng gumagamit URIs), mga kategorya, gumagamit, pasadyang code ng mga bloke at ang panlabas na link sa loob ng menu.
• Suporta ng text-pati na rin ang imahen na nakabatay sa mga sangkap ng menu. (Wala ko pa na subukan ang mga ito kahit na).
• Ang Menu istraktura at nilalaman ay visually adjustable sa pamamagitan ng NAVT admin lugar.
• Compact: JQuery base flyouts para sa nakapugad na antas.
• Mabilis: JQuery para sa menu ay ikinarga mula sa mga server ng Google (Gusto kong pag-ibig sanaysay kanyang sarili na gawin ang parehong sa halip ng paghila sa isang lugar lamang ito). Ito ay magpapabilis sa mga bagay-bagay ng kaunti.
• Scalability - Ang uri ng menu ay maaaring mai-edit at isaayos ng anumang oras sa pamamagitan NAVT mga setting ng plugin nang walang anumang nangangailangan ng coding kahit saan.

Ginamit ko ito mahusay na menu mula sa mga dynamic drive portal bilang basehan. Ako ay upang ipasadya ang code sa javascript ng kaunti pati na rin isama ang bahagi ng PHP sa custom_functions.php upang gawin itong gumagana sa mga sanaysay. Din ang bilang ng mga pre-umiiral na mga pahina, at mga kategorya ng mga post mula sa aking site ay ginagamit upang magtipon menu istraktura. Ang iyong site specifics ay iba't-ibang - ngunit ang konsepto ay pareho.
Kaya hayaan magpatuloy, tayo?

Hakbang sa pamamagitan ng hakbang na tagubilin sa setup NAVT-based nakapugad, customizable, multilevel, SEO friendly
at lamang payak na cool na naghahanap ng navigation menu para sa Wordpress at sanaysay Theme

1. Pumunta sa Wordpress admin panel. Plugins-> Magdagdag ng bago, sa paghahanap para sa "navt". Plugin ay ipinapakita. I-click ang [I-install], [I-install na ngayon], "Buhayin ang Plugin".
2. Tools-> NAVT Listahan, Inside "na lugar ang Nabigasyon Group" mahanap "pangalan ng grupo" at ipasok ang: "menu1" sa patlang, pindutin ang [Lumikha] na button. "Menu1" rektanggulo lugar got nilikha.
   Ito "menu1" na lugar ay ang pangunahing palaruan para sa mga menu ng construction. Ikaw ay i-drag at bumababa dito ang inyong mga sangkap ng menu.
3. Sa "kabuhayan" lugar na makahanap ng "ibang" listbox at i-click sa "Home" pinili. "Home" thingie ay lilitaw sa loob ng "Hindi naka-assign" na lugar. Kakaiba, eh? Walang alalahanin, hangga't ito gumagana - at ito ay para sa amin.
4. I-drag ito "Home" thingie mula sa "kabuhayan" sa lugar na "menu1" rektanggulo lugar. Ito ay naging "Home" item sa menu.
   • Ulitin ang mga hakbang 3-4 para sa ilang mga pahina mula sa "Pahina" lugar, pati na rin ang mga kategorya para sa "kategorya" na lugar. I-drag ang anumang iba pang mga bagay na gusto mong maging sa iyong menu sa loob ng "menu1" rektanggulo. Maaari kang mag-click sa mga pahina, mga kategorya, gumagamit at ilang pasadyang mga sangkap tulad ng "listahan ng divider" at "code block". Code ng block ay cool na paraan upang magdagdag ng mga snippets ng mga pasadyang sa loob ng menu.
   • Maaari mong i-drag ang mga bagay na menu sa loob ng "menu1" na lugar para ayusin ang kanilang order.
   • Maaari mong ayusin ang hierarchical posisyon ng bawat item sa menu na "<" at ">" arrow.
   • Pag-click sa teksto ng pangalan ng bawat item menu - bubukas isip boggling sobrang pagpapasadya ng dialogo para sa mga bagay na ito. Ako halos na ginagamit default technically ngunit maaari mong mabaliw at simulan ang paggawa ng imahe batay sa mga pagpili menu at magdagdag ng mga chunks ng HTML code sa ito. Magpatuloy-ingat sa kahit na.
   • Para sa linkless unclikable submenus na maglingkod bilang mga "magulang" para sa iba pang mga "sub-bata" na ginamit ko ang "Code block" type. Halimbawa kapag pagpapasadya tulad code block ang bagay na aking pinasok para sa "Menu alias item" = "MemberWing" at para sa "Ipasok ang code block:" = "<a href='#'> MemberWing </ a>". Ang pagkakaroon ng href = "#" ay gumawa ng mga ito ay hindi clickable ngunit kumilos bilang isang balidong "magulang" menu pagpili.
5. Narito kung paano ang aking NAVT 'menu1' magtayo ng istraktura mukhang halos nakumpleto na:
   
6. Tapos na ang unang gusali at pagkatapos ay i-click sa "spur" na icon upang ipasadya ang iyong menu ng istraktura:
   
7. Ito ay buksan ang dialog na may 4 tabs: Opsyon, Display, CSS, Theme.
   1. Pumunta sa "Options" na tab at siguraduhin na ang lahat ng bagay ay malaya at "pangalan ng grupo" says: "menu1"
   2. Pumunta sa "Display" na tab at siguraduhin na ang lahat sa "Ipakita nabigasyon grupo sa ..." lugar ay sinuri [x]. Iwanan ang natitira sa mga default.
   3. Pumunta sa "CSS" na tab at piliin ang radio button (x) "Huwag mag-aplay pag-aaral ng CSS".
   4. Pumunta sa "Theme" na tab at punan ang mga ito sa nais na:
      
      Isingit sa "Magdagdag ng mga tag bago ..." ang lugar na ito ang code:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Isingit sa "Magdagdag ng mga tag matapos na ..." ang lugar na ito ang code:
      <br style='clear: left' /></div>
   5. Pindutin ang [i-save / close] na button
8. Sa gusaling ito point menu mula sa loob ng NAVT mga opsyon plugin ay kumpleto na.
   Ngayon ay oras na para gumawa ng isang maliit na tune up para sa tisis tema upang makakuha ng ito handa na. Para na kailangan namin upang magdagdag ng ilang mga file ng pasadyang - CSS at javascript na nauukol sa menu at i-update sanaysay 'custom_functions.php
9. I-download ang kumpletong hanay ng mga file dito.
10. Magsiper archive. Kung ikaw ay na-update ang iyong custom_functions.php sa iyong mga pagpapasadya - kailangan mo upang sumanib sa kanila sa aking mga bagay-bagay. Kailangan ko bang iwan ito sa iyo.
    Kung hindi mo baliw na ito - mag-atubili na itong patungan ng minahan. Mangyaring tandaan: ako ginustong posisyon sa menu sa ilalim ng website header (default ay nasa itaas) - kaya ang aking mga adjustment na ito kasama ang kagustuhan rin.
11. Mag-upload ng archive kasama ang lahat ng subdirectory at file sa ilalim ng iyong sanaysay tema 'na direktoryo ng mga pasadyang', tulad nito:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    Hindi ko pa baliw custom.css - Mas gusto ko ang panatilihin ang menu-tiyak na CSS sa ilalim ng kanilang sariling mga lokasyon upang maiwasan ang paggawa ng gulo sa loob ng custom.css
12. Sa puntong ito maaari mong i-reload ang iyong mga website at makita ang mga bagong magagandang bagong multilevel, nakapugad, SEO optimized menu.
13. Maaari kang bumalik sa NAVT setting at ipasadya ang iyong menu na may mas pinili iposisyon ulit o kahit ano. Ito ay makikita sa live site awtomatikong.

Ang kalye maaga ...

Ito tutorial kasama creative halimbawa ng isang uri ng menu. Nilalaro ko na may isa pang isa - para lamang makita kung paano ang madilim na kulay na menu na gusto ang hitsura:

Sanaysay tema - multilevel nakapugad CSS menu - maitim na palette

Tingin ko ito ay pretty nice. Mayroong maraming mga karagdagang paggalugad halimbawa makukuha sa Dynamic Drive - lahat ng mga ito ay posibleng i-customize para sa mga sanaysay at iba pang mga Wordpress tema sa ilang mga pagsisikap:

Dynamic Drive Pahalang na menu

Umaasa ako makakahanap ka ng tutorial na ito kapaki-pakinabang at kapaki-pakinabang. Tulad ng sinabi ko, ito ay posible na ipasadya ang alinman sa mga menu na para sa mga sanaysay - na ibinigay na oras at pagnanais upang gawin itong mangyari.

Kaya kong gawin ito trabaho para sa inyo sa isang batayan sa kontrata. Basta piliin ang mga menu na gusto mo, makipag-ugnayan sa akin at kukunin ko na ang paggawa sa code at mga tagubilin para sa iyong website.

$ 20

At kung kayo ay hanggang sa gusali ng super SEO optimized premium membership wordpress portal - ang pinakamahusay na solusyon para sa mga ito:
Sanaysay Theme + MemberWing pagiging kasapi ng plugin + naka-host sa sarili Wordpress ng kurso.

Nai-tag ng: CSS menu para sa wordpress, sanaysay tema, sanaysay tema hierarchical menu, sanaysay tema multilevel menu, sanaysay tema nagivation, sanaysay tema nakapugad na menu, sanaysay tema tutorial, wordpress css menu, wordpress nakapugad na menu