Quest pentru meniul perfect ...

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

Am decis să ne tema tezei de doctorat , pentru că unul dintre clientii mei ma informat despre problemele de compatibilitate între tezei de doctorat şi-mi WordPress site de membru plugin MemberWing. Am imobilizate si apoi a decis să ia o privire mai atenta la tezei de doctorat şi de fapt deranjat pentru a viziona videoclipuri pe prima pagina a site-ului tezei principale - Diythemes.com .
Ceea ce ma impresionat cel mai mult este atentia la detalii, uşurinţa în utilizare şi mai presus de toate - caracteristicile SEO, care sunt atât de bine gândit.
Membru plugin MemberWing fost proiectat de la zero pentru site-uri de membru, care ar avea nevoie pentru a trage cât mai mult suc de SEO este posibil. Aşa că am plătit o mulţime de atenţie la multitudinea de SEO îmbunătăţiri şi perfecţiuni în MemberWing. Multi dintre clientii mei sunt întrebat despre teme diverse de a utiliza şi având în temă, care a fost atât de bine optimizat SEO din interiorul adânc ar fi o formă excelentă pentru antreprenori portal de membru.

Combinarea competenţelor de SEO de MemberWing cu puteri SEO de tema tezei de doctorat ar oferi cele mai bune oportunităţi de clasament pentru clienţii mei. Asa ca am luat tezei de doctorat şi a jucat cu el pentru o zi.

Este o temă excelentă în toate modurile. Partea de navigare din ea, deşi este un pic limitat în funcţie. Pornind de la Teza 1.5 + este un meniu nivel numai. Dorinţa mea este de obicei pentru a putea personaliza navigare fel de mult ca este necesar. Unele site-uri au doar cateva pagini, mulţi alţii au de tone de pagini statice + mii de miliarde de articole / mesaje + o multime de categorii.
Deci, în lume ideală având şansa de a crea arata bine organizate ierarhic meniul de navigare ghidul de prietenos este o necesitate. Teza de pe dreapta a lilieci de navigare care sa arate bine, dar am observat ca toate site-urile tezei de doctorat bazate pe care il cautati ca gemeni. Personalizarea meniul de navigare tezei nu este foarte uşor aşa că majoritatea oamenilor las aşa cum este. Nu există nici o modalitate de a schimba ordinea categoriilor, în meniu sau poziţia lor în între pagini. Şi din nou, posibilitatea de a crea structuri imbricate meniul lipseşte. Aşa că am decis pentru a vedea ce se poate face despre el.
După ce a încercat aproximativ jumătate plugins meniul de duzină / navigare legate setez alegerea mea pe Wordpress Plugin NAVT Lista de navigare .
NAVT plugin este neordonata în esenţă, generator de listă cu super-lux şi un pic cam greu-la-cifre interfaţă netradiţională admin. Ce înşelătoare despre el este că ea nu creează de fapt derulează fantezie cautati de la sine. Ea face cea mai grea parte a muncii, deşi - vă oferă o capacitatea de a trage vizual împreună, şi pentru a genera listele neordonate, - schelet de meniu-a-fi. Şi s-ar putea crea prea multe meniuri. Puteţi trage tot felul de chestii Wordpress în meniul de navigare: pagini, posturi, articole, categorii, utilizatori, blocuri de cod, link-uri externe, separatoare, separatoare şi se amestecă şi se potrivesc şi cuib şi aranja şi a particulariza lor în orice structură arborescentă, ca tine doriţi.
NAVT generează pentru tine rezultat HTML listele neordonate. Frumusete a doua de NAVT este faptul că vă ajută să introduceţi meniu noi în temă dvs. prin logica JQuery bazat celebre, dar fără a avea nevoie pentru a schimba orice cod! NAVT vă permite să specificaţi: "înlocui acest element # cu meniul meu NAVT noi". # Elemente ar putea fi un id sau clasa de calea de meniu existente sau tag-ul div element care este generată după temă actuale. Deci, NAVT face acest lucru de înlocuire pentru tine, fără a forţa să te duci într-un cod temă şi să-l mai murdar decât este deja. În cazul în care toate sunetele un nonsens - nu vă faceţi griji - voi ghida pas cu pas în curând. Parte a NAVT provocare pentru toată lumea este că va trebui să vină cu efective CSS + imagini + cod JavaScript pentru meniul dumneavoastră tine. Şi este de până la tine pentru a afla unde şi cum să integreze aceste fişiere şi să facă aceste lucruri în mod corespunzător se conectate împreună.
Cu stimă, fără să ştie JQuery + unele PHP + CSS + având o experienţă decentă cu Wordpress - acest lucru este greu pentru a trage.
Bucuros Ştiu că aceste lucruri un pic, aşa că am decis să muşte glonţ şi umanitatea de folosire a libertăţii în construirea cele mai bune din cele mai bune meniuri de navigare pentru Wordpress. Am doar nevoie pentru a afla sursele pentru unele drăguţ meniuri orizontale CSS. Am ales site-ul web conduce dinamic pentru cele mai bune selecţii, demo-uri şi surse.

Am dedicat o zi pentru a studia tezei de doctorat şi să se joace cu plugin NAVT. La sfârşitul anului am creat cu mândrie flexibile personalizate,, SEO optimizat, structura mai multe niveluri, nagivation imbricate pentru site-ul meu Teza Wordpress + baza.

Lista de caracteristici de mai multe niveluri, imbricate Wordpress navigare meniu pentru Tema tezei de doctorat
(Trebuie să iubesc chestia asta):

• Aspect profesional, curat si sa se simta.
• Suport pentru toate browserele moderne, inclusiv Microsoft Internet Explorer 6,7, Opera, Safari, Firefox 3.x, Chrome Google in ambele javascript şi non-javascript moduri.
• Graţios downgradable pentru non-javascript browsere. Tu meniul va fi utilizabil, vizual similare şi de muncă, chiar şi pentru browsere cu handicap javascript (deşi numai de navigare la nivel de top vor fi vizibile şi nici flyouts se va întâmpla, desigur, cum sunt realizate de către javascript).
• Caracteristici SEO friendly - neordonata meniul Lista de coduri este generat în HTML. Google şi alte motoare de căutare păianjeni va fi capabil să indice structura de navigare şi pentru a găsi link-uri către pagini interioare.
• Suport pentru nivelurile nelimitat cuiburi şi subnivele.
• Suport pentru orice comandă sau pagini, posturi (definit de utilizator prin intermediul URI-uri), categorii, utilizatori, blocuri de cod personalizat şi link-uri externe în cadrul meniului.
• Suport de text-imagine, precum şi pe bază de elemente de meniu. (Încă nu am încerca aceste deşi).
• Structura meniului şi conţinutul vizual este reglabil prin zona de administrare NAVT.
• Compact: flyouts JQuery bazate pe niveluri imbricate.
• Rapid: JQuery pentru meniu este încărcat de pe serverele Google (mi-ar plăcea tezei de doctorat se să facă acelaşi lucru în loc de trăgându-l la nivel local). Acest lucru ar accelera lucrurile un pic.
• Scalabilitate - Acest tip de meniu este editabil şi configurabil în orice moment, prin setările plugin-ul NAVT fara a fi nevoie de codificare oriunde.

Am folosit acest meniu excelent de la Dinamic portal ca o bază. Am avut pentru a personaliza codul javascript un pic, precum şi includ bucată de PHP în custom_functions.php pentru a face să funcţioneze cu tezei de doctorat. De asemenea, numărul de pre-existente, pagini, categorii şi posturile de la site-ul meu au fost utilizate 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, vom?

Instrucţiuni pas cu pas pentru configurarea NAVT bazate pe imbricate, personalizabil, mai multe niveluri, SEO friendly
şi pur şi simplu se răcească în căutarea meniul de navigare pentru Wordpress şi tezei de doctorat Tema

1. Du-te la Wordpress panoul de administrare. Plugins-> Add new, căutare pentru "navt". Plugin-ul va fi arătată. Faceţi clic pe [Install], [Install acum], "Activare Plugin".
2. Instrumente-> Liste NAVT, Inside "Grupul de navigare" zonă gasi "nume de grup" şi introduceţi: "menu1" în câmp, apăsaţi [Creare] buton. "Menu1" zonă de dreptunghi am creat.
   Acest "menu1" zonă va fi locul de joacă principal pentru construcţii de meniu. Veţi fi glisarea şi fixarea aici elemente de meniu.
3. În "active" zonă găsi "alte" listbox şi apăsaţi pe "Acasă" alegere. "Acasă" thingie va aparea in interiorul "neasociate" zonă. Ciudat, nu-i aşa? Nu vă faceţi griji, atâta timp cât funcţionează - şi va pentru noi.
4. Trageţi această "Pagina principală" thingie de la "activele" zonă în zonă de dreptunghi "menu1". 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 interior "menu1" dreptunghi. Aveţi dreptul să faceţi clic pe pagini, categorii, utilizatorii şi unele elemente personalizate, cum ar fi "separator listă" şi "bloc de cod". Bloc de cod este modul de a adăuga rece fragmente particularizate în interiorul meniului.
   • Aveţi dreptul să glisaţi elemente de meniu în interiorul "menu1" zonă pentru a rearanja ordinea lor.
   • Puteţi ajusta poziţia ierarhică din fiecare element din meniu cu "<" şi ">" săgeţi.
   • Faceţi click pe numele textul de fiecare element din meniu - deschide dialog minte uluitor de personalizare suplimentare pentru acest post. Am folosit cea mai mare parte implicite, dar tehnic, poti sa te duci nebun şi începe a face imagine pe bază de opţiuni de meniu şi se adaugă bucati de cod HTML în ea. Mai departe, deşi cu prudenţă.
   • Pentru submeniuri linkless unclikable care va servi ca "părinţi" pentru alte "sub-copii" am folosit "Codul de bloc" de tip. De exemplu, atunci când astfel de element de personalizare bloc de cod am intrat pentru "Element de meniu alias" = "MemberWing" şi pentru "Enter bloc de cod:" = "href='#'> MemberWing <a </ a>". Având în href = "#" va face aceasta nu poate face clic, dar acţionează ca un paşaport valabil alegere meniu "mamă".
5. Iată cum NAVT meu structura "menu1" construi arata ca aproape finalizată:
   
6. Finish clădire iniţială şi apoi faceţi clic pe "unelte" pentru a personaliza structura de meniu:
   
7. Se va deschide dialogul cu 4 file: Opţiuni, Display, CSS, Tema.
   1. Du-te la "Options" tab-ul şi asiguraţi-vă că totul nu este bifat si "nume de grup", spune: "menu1"
   2. Du-te la "Display" tab-ul şi asiguraţi-vă că totul pe "Show grup de navigare pe ..." Zona este verificată [x]. Lasati restul la valorile implicite.
   3. Du-te la "CSS" tab-ul şi selectaţi butonul radio (x) "nu se aplica clase CSS".
   4. Du-te la "Tema" tab-ul şi completaţi-l în aşa:
      
      Introduceţi în "Adăugaţi etichete înainte de ..." zona de acest cod:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Introduceţi în "etichete Adauga după ..." zona de acest cod:
      <br style='clear: left' /></div>
   5. Apăsaţi pe [a salva / Închide] butonul
8. La această clădire meniu punct din cadrul NAVT opţiuni plugin-ul este completă.
   Acum e timpul să facă un ton puţin pentru tema tezei de doctorat să-l gata. Pentru că avem nevoie să adăugaţi câteva fişiere particularizate - CSS şi javascript care aparţine în meniul şi custom_functions.php tezei de doctorat update '
9. Descarcati set complet de fişiere aici .
10. Unzip arhiva. Dacă v-aţi actualizat custom_functions.php cu particularizările dvs. - care aveţi nevoie pentru a le îmbina cu lucrurile mele. Voi lăsa până la tine.
    Dacă nu l-ai atins - nu ezitaţi să-l suprascrieţi cu a mea. Vă rugăm să reţineţi: Am preferat să poziţia meniului sub antet site-ul web (implicit este de mai sus) - astfel încât ajustarea mele să fie incluse, precum şi această preferinţă.
11. Incarca Arhiva inclusiv toate subdirectoarele şi fişierele dumneavoastră în conformitate cu tema tezei de director "personalizate", ca aceasta:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    Nu am atins custom.css - Eu prefer să păstreze meniul specifice în conformitate cu CSS locaţiile proprii pentru a evita crearea de dezordine în interiorul custom.css
12. La acest punct s-ar putea reîncărca site-ul dvs. şi de a vedea noul frumos noi niveluri multiple, meniul imbricate, optimizat SEO.
13. Aveţi dreptul să întorc întotdeauna la NAVT setările şi a personaliza meniul cu mai multe opţiuni sau repoziţionarea nimic. Acesta va fi reflectate pe site-ul vii automat.

Calea de urmat ...

Acest tutorial a inclus exemplu creativ de un singur tip de meniu. M-am jucat cu un altul - doar pentru a vedea cat de intunecat meniul de culoare ar arata astfel:

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

Cred că este destul de frumos. Există mult mai multe mostre de navigaţie disponibile la Dinamic - toate acestea sunt posibile pentru a particulariza pentru tezei de doctorat şi alte teme Wordpress cu unele efort:

Meniuri dinamice orizontale unitate

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

Am putea face acest lucru pentru dumneavoastră în baza unui contract. Pur şi simplu alegeţi meniul care vă place, să mă contactaţi şi voi lucra la codul şi instrucţiunile pentru site-ul dumneavoastra.

20 dolari

Şi desigur, dacă sunteţi de până la construirea super-SEO optimizat membru premium portal WordPress - cea mai buna solutie pentru acest lucru:
Tema tezei de doctorat + membru plugin MemberWing + auto Wordpress găzduit de curs.

comments } { 15 comentarii }