The Quest pentru meniul perfect ...

Aceasta este partea 1 a tutorialului
Partea 2 a acestui tutorial învaţă cum să construiască meniul vertical + paleta de culori intunecate pentru o orizontală

Am decis să ne tema tezei de doctorat, pentru că una dintre clienţii mei ma informat despre problemele de compatibilitate între tezei de doctorat şi WordPress mea de membru site-ul MemberWing plug-in. Am reparat-o şi apoi a decis să aruncaţi o privire mai atentă la tezei de doctorat şi a deranjat de fapt, pentru a viziona clipuri video pe prima pagina a site-ului principal tezei de doctorat - Diythemes.com.
Ceea ce ma impresionat cel mai mult este caracteristici atenţie la detalii, prietenos şi mai presus de toate - SEO care sunt atât de bine gândit.
MemberWing plugin-ul de membru a fost conceput de la sol până pentru site-urile de membru, care ar trebui să trageţi ca sucul de SEO mai mult posibil. Aşa că am plătit o mulţime de atenţie pentru a multitudinii de accesorii SEO şi perfecţiuni în MemberWing. Mulţi dintre clienţii mei proprii sunt întrebat despre diferite teme să folosească şi având temă, care a fost atât de bine optimizat SEO din interiorul profundă ar fi o formă excelentă pentru aderarea la antreprenori portal.

Combinand puterile SEO MemberWing cu puteri SEO tema tezei de doctorat ar oferi cele mai bune oportunitati de rang pentru clienţii mei. Aşa că am tezei de doctorat şi a jucat cu el pentru o zi.

Este o temă excelentă în toate căile. O parte de navigare din ea deşi este un pic limitat în funcţie. Pornind de la Teza 1.5 +, este un nivel de meniu numai. Dorinţa mea obişnuită este de a fi în măsură de a personaliza de navigare la fel de mult cum este necesar. Unele site-uri au doar câteva pagini, mulţi alţii au de tone de pagini statice + zillions o mulţime de articole / posturi + de categorii.
Deci, în lume ideală care au o şansă de a crea nice looking ierarhic organizat utilizatorului un meniu prietenos de navigare este o necesitate. Teza de pe dreapta BAT a good looking de navigaţie, dar am observat că toate Teza de site-uri web bazate pe care il cautati ca gemeni. Personalizarea Teza meniul de navigare nu este chiar atât de uşor de majoritatea oamenilor o lăsăm aşa cum este. Nu există nici o cale de a schimba ordinea de categorii din meniu sau de poziţia lor în între pagini. Şi din nou, posibilitatea de a crea structuri de meniu imbricate lipseşte. Asa ca am decis pentru a vedea ce este de făcut cu privire la aceasta.
După ce a încercat aproximativ jumătate meniul de duzină / plugin-uri de navigare mi stabilesc legate de alegerea mea pe Wordpress Lista de navigare Plugin NAVT.
Plug-in NAVT este, în esenţă, generator de neordonate lista cu super-lux si un pic greu-la-figura interfaţă netradiţionale admin. Ceea ce induce în eroare despre acesta este că aceasta nu creează de fapt, meniuri caută fancy de la sine. Aceasta face parte din cel mai greu de locuri de muncă deşi - vă oferă o capacitate de a trage vizual împreună, şi generează listă neordonată - schelet din meniul-la-fi. Si tu ar putea crea prea multe meniuri. Puteti trage tot felul de chestii Wordpress în meniul de navigare: pagini, posturi, articole, categorii, utilizatorii, blocuri de cod, link-uri externe, separatoare, separatoare şi se amestecă şi potrivi şi cuiburi şi a organiza şi personaliza-le în orice copac-ca structura de tine dori.
NAVT generează pentru tine rezultat HTML lista neordonate. Frumuseţea a doua a NAVT este că vă ajută să introduceţi meniul dvs. noi în temă dvs. prin intermediul JQuery celebru bazate pe logica, dar fără a fi nevoie de a schimba orice cod! NAVT vă permite să specificaţi: "înlocui acest element # cu meniul meu NAVT noi". # element ar putea fi un id sau clasa de calea de meniu existente sau a tag-ul div element care este generată de tema dvs. curentă. Deci, NAVT face acest lucru de înlocuire pentru tine fără a forţa să te duci în codul temă şi face mult mai murdară decât este deja. În cazul în care faptul că toate sună ca gebreasca - nu vă faceţi griji - am vom ghida pas cu pas în curând. O parte din NAVT provocare pentru toată lumea este că va trebui să vină cu CSS imagini reale + + codul JavaScript pentru meniul tine. Şi este de până la tu la spre figure afară unde şi cum să integreze aceste fişiere şi să facă aceste lucruri în mod corespunzător a lua conectate impreuna.
Cu respect, fără să ştie JQuery + unele PHP + CSS + decente care au experienţă cu Wordpress - acest lucru este greu de a trage.
Bucuros Ştiu chestia asta un pic, aşa că am decis să muşte The Bullet şi umanitatea ghid pentru a libertăţii în construirea cele mai bune din cele mai bune meniuri de navigare pentru Wordpress. Tocmai am nevoie pentru a afla sursele pentru unele dintre nice looking meniuri orizontale CSS. Am ales site-ul Dynamic Drive pentru cele mai bune selecţii a acestora, demo-uri şi surse.

Am dedicat o zi pentru a studia tezei de doctorat şi să se joace cu plugin-ul NAVT. La final, am creat cu mândrie personalizate, flexibil, optimizat SEO, mai multe niveluri, structura imbricate nagivation pentru Wordpress meu + Teză bazate pe site-ul.

Lista de caracteristici ale multinivel, meniul de navigare imbricate WordPress pentru Tematica tezei de doctorat
(trebuie să te iubesc chestiile astea):

• Professional, uită-te curat si sa se simta.
• Suport pentru toate browserele moderne, inclusiv MSIE 6,7, Opera, Safari, Firefox 3.x, Google Chrome în ambele JavaScript şi non-moduri de JavaScript.
• Graţios downgradable pentru non-browsere JavaScript. Tu meniul va fi mai uşor de utilizat, vizual similare şi de muncă, chiar şi pentru JavaScript browsere cu handicap (deşi numai de navigare de nivel superior va fi vizibilă şi nici flyouts se va întâmpla, desigur, cum sunt realizate de către JavaScript).
• Caracteristici SEO Friendly - Cod Lista neordonate, meniul este generate în cadrul HTML. Google şi în alte antenele motorului de căutare va fi capabil să indice de structura dvs. de navigare şi de a găsi link-uri către pagini interioare.
• Suport pentru nelimitat niveluri de cuiburi si sublevels.
• Suport pentru orice comanda sau pagini, posturi (prin intermediul definit de utilizator URI-uri), categorii, utilizatori, blocuri de cod particularizat şi link-uri externe în meniu.
• Suport de text-imagine, precum şi pe bază de elemente de meniu. (Am încă să încercaţi aceste deşi).
• Structura meniului şi conţinutul vizual este reglabil prin zona de admin NAVT.
• Compact: flyouts JQuery pe baza pentru nivelurile de imbricate.
• Rapid: JQuery pentru meniul este încărcat din serverele Google (mi-ar plăcea Teza de sine, să facă acelaşi lucru în loc de a trage ea pe plan local). Acest lucru s-ar grăbi lucrurile un pic.
• Scalabilitate - Acest tip de meniu este editabil şi configurabil în orice moment, prin intermediul setările plugin-ul NAVT fara a fi nevoie de codificare oriunde.

Am folosit acest meniu excelent de la portal unitate dinamic ca bază. Am avut de a personaliza codul JavaScript un pic, precum şi includ bucată de PHP în custom_functions.php să facem să funcţioneze cu tezei de doctorat. De asemenea, numărul de pagini de pre-existente, categoriile şi de posturi de la site-ul meu au fost folosite pentru a asambla structura meniului. Specificul site-ul dvs. va fi diferit - dar concepte vor fi la fel.
Aşa că haideţi să procedeze, bine?

Instrucţiuni pas cu pas pentru a NAVT setup pe bază de SEO imbricate, customizabil, multi-nivel, prietenos
şi pur şi simplu se răcească în căutarea meniul de navigare pentru Wordpress şi a tezei de doctorat Tematica

1. Du-te la Wordpress panoul de administrare. Plugin-uri-> Adăugaţi noi, căutare pentru "navt". Plug-in va fi afişat. Faceţi clic pe [install], [Instalare acum], "Activare extensie".
2. Tools-> Liste NAVT, Inside "de navigare Group" zona găsi "nume de grup" şi introduceţi: "menu1" în domeniu, apăsaţi [Create] buton. "Menu1" zona dreptunghiului-am creat.
   Acest "menu1" zona va fi principalul loc de joaca pentru constructii meniu. Veţi fi glisare şi fixare aici elemente de meniu.
3. În "active" zona găsi "alte" listbox şi faceţi clic pe "Home" alegere. "Acasa" thingie va apărea în interiorul "unassigned" zona. Ciudat, nu? Nu vă faceţi griji, atâta timp cât funcţionează - şi va pentru noi.
4. Drag acest "Home" thingie de la "active" zonă în "menu1" dreptunghi zona. Acesta va deveni "Home" element din meniu.
   • Repetaţi paşii 3-4 pentru unele pagini de la "Pagini" zonă, precum şi pentru categoriile în "categorii" zonă. Glisaţi orice alte elemente pe care doriţi să fie în meniul tău interior "menu1" dreptunghi. Aveţi dreptul să faceţi clic pe pagini, categorii, utilizatorii şi unele elemente personalizate, cum ar fi "divider lista" şi bloc de cod "". Bloc de cod este modalitate misto de a adăuga fragmente particularizate în interiorul meniu.
   • Puteţi să trageţi elementele de meniu interior "menu1" zona pentru a rearanja ordinea lor.
   • Puteţi ajusta poziţia ierarhică a fiecărui element de meniu cu "<" şi ">" săgeţi.
   • Dacă faceţi clic pe numele de text din fiecare element de meniu - deschide mintea de dialog exagerat extra de personalizare pentru acest element. Am folosit cea mai mare parte implicite punct de vedere tehnic, dar puteţi merge nebun şi să înceapă a face imagine pe bază de opţiuni de meniu şi se adaugă bucăţi de cod HTML în ea. Continuaţi cu prudenţă, totuşi.
   • Pentru linkless submeniuri unclikable, care va servi ca "părinţi" pentru alte "sub-copii" Am folosit "bloc de cod" de tip. De exemplu, atunci când personalizarea element astfel de cod bloc am intrat pentru "alias elementul de meniu" = "MemberWing" şi pentru "Enter bloc de cod:" = "<a href='#'> MemberWing </ a>". Având în href = "#" va face, nu puteţi face clic, dar care acţionează ca un paşaport valabil "mamă" alegere meniu.
5. Iată cum NAVT mea "menu1 'construi structura arata ca aproape finalizată:
   
6. Finish construcţie iniţial şi apoi faceţi clic pe "unealtă", pictograma pentru a particulariza structura dvs. de meniu:
   
7. Acesta se va deschide de dialog cu 4 file: Opţiuni, Display, CSS, Tema.
   1. Du-te la "Opţiuni" tab-ul şi asiguraţi-vă că totul nu este bifat şi "grup de nume", spune: "menu1"
   2. Du-te la "Display" tab-ul şi să facă tot ce-vă că pe "grup de navigare pe hartă ..." zona este verificat [x]. Lasati restul de la valorile implicite.
   3. Du-te la "CSS" tab-ul şi selectaţi butonul radio (x) "A nu se aplica clase CSS".
   4. Du-te la "Tema" tab şi completaţi-l în aşa:
      
      Introduceţi în "Adăugaţi etichete înainte de ..." zonă de acest cod:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Introduceţi în "Adăugaţi etichete după ..." zonă de acest cod:
      <br style='clear: left' /></div>
   5. Comunicat de presă [a salva / aproape] butonul
8. La acest punct din meniu clădire în termen de opţiuni de plug-in NAVT este completă.
   Acum este momentul să facă un ton de mic pentru tema tezei de doctorat să-l gata. Pentru că avem nevoie pentru a adăuga câteva fişiere personalizat - CSS şi Javascript care aparţine meniul şi să actualizeze custom_functions.php tezei de doctorat "
9. Descărca complet set de fişiere de aici.
10. Arhiva Unzip. Dacă aţi actualizat custom_functions.php cu particularizările - trebuie să îmbinaţi-le cu lucrurile mele. Voi lăsa până la tine.
    Dacă nu aţi atins-o - nu ezitaţi să o suprascrieţi cu a mea. Vă rugăm să reţineţi: Am preferat sa poziţie meniu sub antetul site-ului (implicit este de mai sus) - astfel încât ajustarea meu inclus această preferinţă, de asemenea.
11. Arhiva Upload inclusiv toate subdirectoarele şi fişierele în conformitate cu tema dvs. tezei de doctorat "directorul personalizate", astfel:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    Nu m-am atins custom.css - Aş prefera să păstreze meniu-CSS specifice în conformitate cu propriile lor locaţii pentru a evita crearea de mizerie în interiorul custom.css
12. La acest punct este posibil să reîncărcaţi site-ul dvs. şi vedeţi nou meniu frumos noi etajate, imbricate, SEO optimizat.
13. Puteţi merge oricând înapoi la setările NAVT şi personaliza meniul cu alegere mai mult sau mai repoziţiona nimic. Acesta va fi reflectate pe site-ul vii în mod automat.

Drumului ...

Acest ghid inclus exemplu, creatoare de un singur tip de meniu. L-am jucat cu un altul - doar pentru a vedea meniul de culoare închisă cum ar arăta astfel:

Tema tezei de doctorat - meniu mai multe niveluri imbricate CSS - paleta de întuneric

Eu cred că este destul de frumos. Exista mai multe mai multe mostre de navigaţie disponibile la Dynamic Drive - toate acestea sunt posibile pentru a personaliza pentru a tezei de doctorat şi alte teme Wordpress cu unele efort:

Dynamic Drive orizontale Meniuri

Sper că veţi găsi acest tutorial benefic şi util. După cum am spus, este posibil să personalizaţi oricare dintre aceste meniuri pentru teza - care este dat de timp şi dorinţa de a face sa se intample.

Am putea face acest lucru pentru tine pe baza de contract. Pur şi simplu alegeţi meniul care vă place, contactaţi-mă şi voi lucra la cod şi instrucţiunile pentru site-ul dumneavoastră.

20 dolari

Şi, bineînţeles, dacă sunteţi de până la construirea SEO super optimizat primă WordPress portal de membru - cea mai bună soluţie pentru acest lucru:
Tema tezei de doctorat + MemberWing plugin-ul de membru + sine a găzduit Wordpress desigur.

Etichetate ca: CSS meniu pentru WordPress, tema tezei, tema tezei de meniuri ierarhice, tema tezei de meniu mai multe niveluri, Teza nagivation tema, tema tezei de meniuri imbricate, tema tezei de tutorial, meniul WordPress CSS, WordPress meniul imbricate