Puikus meniu Quest ...
Tai pamoka 1 dalis
Šio pamoka 2 dalis moko, kaip sukurti vertikalią meniu + tamsios spalvos paletę horizontalioje vieną
Aš nusprendė gauti darbo tema , nes vienas iš mano klientų informavo mane apie suderinamumo problemas tarp disertacija ir mano WordPress Narystė Svetainės įskiepiai MemberWing. I fixed it ir tada nusprendė atidžiau pažvelgti darbe ir tikrai nebesinori žiūrėti vaizdo įrašus tituliniame puslapyje pagrindiniame disertacija "svetainėje - Diythemes.com .
Kas įspūdį man labiausiai yra dėmesį į detales, patogumo vartotojams ir visų svarbiausia - SEO bruožai, taip pat maniau.
MemberWing narystė įskiepiai buvo sukurta iš žemės iki narystės svetainėse, kad reikės traukti kaip daug SEO sulčių, kaip įmanoma. Taigi aš sumokėta daug dėmesio daugybė SEO patobulinimų ir tobulumus į MemberWing. Daugelis mano paties klientams klausia apie įvairių temų naudotis ir turintys tema, kuri buvo taip gerai SEO optimizuotas iš giliai viduje būtų puikus tinka narystės portalo verslininkams.
Derinant SEO įgaliojimus MemberWing su SEO įgaliojimus darbo tema duos Eilės galimybes geriausias savo klientams. Taigi aš Thesis ir grojo su juo per dieną.
Tai puiki tema visais būdais. Navigaciją jo dalis, nors yra šiek tiek ribota funkcija. Nuo Thesis 1.5 + tai yra vienu lygiu meniu tik. Mano įprasta noras yra, kad būtų galima pritaikyti navigacijos tiek, kiek reikia. Kai kurie tinklapiai turi tik kelis puslapius, daugelis kitų tonų statinius puslapius + begalė straipsnių / pranešimų + daug kategorijų.
Taigi, idealiame pasaulyje turintys galimybę sukurti gražų hierarchiškai organizuota patogi naršymo meniu yra būtina. Darbo Iškart turi gerą ieškote navigaciją, bet aš pastebėjau, kad visi Darbo pagrįstas svetainių atrodo kaip dvyniai. Pritaikyti Thesis naršymo meniu yra tikrai paprasta, todėl dauguma žmonių tiesiog palikite jį, kaip yra. Nėra jokio būdo keisti tvarką kategorijų meniu arba jų poziciją tarp puslapių. Ir vėl, gebėjimas kurti įdėtos meniu struktūrų nėra. Taigi, aš nusprendžiau pamatyti, ką galima padaryti apie tai.
Po bando apie pusė tuzino meniu / navigacijos susijusius įskiepių aš nustačiau mano pasirinkimas ant WordPress navigacijos sąrašas Plugin NAVT .
NAVT įskiepiai esmės netvarkingai sąrašą generatorių su super išgalvotas ir šiek tiek sunkiai suprasti Netradicinio admin sąsaja. Kas klaidina apie tai, kad jis nėra iš tikrųjų sukurti išgalvotas ieškote meniu savaime. Ji sunkiausia dalis darbo, nors - suteikia jums galimybę vizualiai apjungti ir sukurti netvarkingai sąrašą - skeletas savo meniu-į-bus. Ir tu gali sukurti daug meniu taip pat. Jūs galite traukti visus WordPress stuff natūra į navigacijos meniu: Puslapiai, pranešimai, straipsniai, kategorijos, vartotojai, kodas blokai, išorinės nuorodos, pertvaros, separatoriai ir sumaišoma ir suderinti ir lizdą ir organizuoti ir pritaikyti juos bet medis panašią struktūrą jums nori.
NAVT generuoja jums lėmė HTML netvarkingai sąrašą. Antra grožis NAVT, kad jis padeda jums įrašyti savo naują meniu į jūsų tema per garsaus JQuery pagrįstas logika, bet be reikalo keisti jokio kodo! NAVT leidžia jums nurodyti: "pakeisti šį # elementas su mano naujomis NAVT meniu". # Elementas gali būti tapatybės arba klasė path of esamą meniu arba div elementas tegus kad yra sukurtas jūsų dabartinis tema. Taigi NAVT tai atlieka už jus pakeisti be verčia jus eiti į pramogų kodą ir padaryti jį labiau nepatogus nei ji jau yra. Jei tai visi kaip svaičiojimas garsai - nesijaudinkite - aš Jums žingsnis po žingsnio greitai. Sudėtingiausia NAVT visiems, kad jūs turėsite sugalvoti paprastą CSS + vaizdus + javascript kodą savo meniu sau. Ir tai iki jums išsiaiškinti, kur ir kaip integruoti šiuos failus ir padaryti šią medžiagą tinkamai gauti prijungtas kartu.
Pagarbiai nežinant JQuery + kai PHP + CSS +, turintys gerą patirtį su WordPress - šis dalykas yra sunku traukti.
Mielai aš žinau, ši medžiaga šiek tiek, todėl aš nusprendė įkandimas kulka ir vadovauti žmonijai laisvę kuriant iš geriausių navigacijos meniu WordPress geriausia. Aš tiesiog reikia išsiaiškinti šaltinius kai kurių gražus ieško horizontalių CSS meniu. Paėmiau Dynamic Drive interneto svetainėje už savo geriausius pasirinkimus, demo ir šaltinių.
Dirbau per dieną mokytis Thesis ir žaisti su NAVT įskiepio. Pabaigoje aš išdidžiai sukūrė užsakymą, lankstus, SEO, optimizuoti, lygių, įdėtos Nagivation struktūrą savo WordPress + Thesis pagrįstas svetainėje.
Funkcijų sąrašas daugiapakopio, įdėtos WordPress naršymo meniu, skirtų darbo tema
(Jūs turite mylėti šią medžiagą):
- Profesinė, švarus išvaizdą.
- Parama visų šiuolaikinių naršyklių, įskaitant MSIE 6,7, Opera, Safari, Firefox 3.x "," Google Chrome JavaScript ir ne javascript režimai.
- Grakščiai downgradable ne javascript naršyklių. Jūs meniu bus naudingas, panašūs vizualiai ir darbo net išjungtas "JavaScript" naršykles (nors tik aukščiausio lygio navigacijos bus matomas ir nėra flyouts nutiks, žinoma, kiek jie pagaminti, naudojant JavaScript).
- SEO draugiškas funkcijos - netvarkingai sąrašas meniu kodas sugeneruotas HTML. Google ir kitos paieškos vorai galės indeksuoti jūsų navigacijos struktūrą ir rasti nuorodas į vidinių puslapių.
- Parama neribotą lizdus lygių ir sublevels.
- Parama įsakymas ar puslapius, pašto (per vartotojo nustatytą URI), Kategorijos, vartotojai, nestandartinių kodo blokus ir išorės transporto jungtis meniu.
- Palaikymo teksto-taip pat vaizdiniai elementai meniu. (Turiu dar pabandyti šias nors).
- Meniu struktūra ir turinys yra vizualiai reguliuojama per NAVT admin srityje.
- Kompaktiškas: JQuery pagrindu flyouts lizdinės lygiais.
- Greitas: JQuery už meniu įkelti iš Google serverių (aš myliu Thesis pati daryti tą patį, o ne traukdami jį vietoje). Tai pagreitinti dalykų šiek tiek.
- Mastelio - Šis meniu tipas yra redaguoti ir konfigūruojama bet per NAVT įskiepiai nustatymus metu be jokių kodavimo kur reikia.
Aš šį puikų meniu, Dynamic Drive versija kaip pagrindą. Aš turėjau pritaikyti kodas javascript šiek tiek taip pat apima riekė PHP į custom_functions.php padaryti jį dirbti su darbu. Taip pat iš anksto esamus puslapius, kategorijas ir pranešimus nuo mano svetainę skaičius buvo naudojami surinkti meniu struktūrą. Jūsų svetainės specifiką bus kitoks - bet sąvokos bus tas pats.
Taigi leiskite tęsti, ar mes?
Žingsnis po žingsnio instrukcijas sukonfigūruoti NAVT pagrindu įdėtos, su pritaikymais, daugiapakopis, SEO Friendly
ir tiesiog cool ieškote naršymo meniu WordPress ir baigiamojo darbo temą
- Eiti į WordPress admin panel. Plugins-> Naujas, ieškoti "navt". Įskiepiai bus rodomas. Spustelėkite [Install], [Diegti dabar] "Įjungti Plugin".
- Įrankiai-> NAVT sąrašai, viduje "navigacijos Group" teritorijoje rasti "grupės pavadinimą" ir įveskite: "menu1" lauke, paspauskite [Sukurti] mygtuką. "Menu1" stačiakampis plotas gavo sukurta.
Šis "menu1" plotas bus pagrindinis žaidimo aikštelė meniu statybai. Jūs būsite velkant ir numetant čia savo meniu elementus. - Į "turto" srityje rasite "Kita" ListBox ir paspauskite "Home" pasirinkimas. "Namai" thingie pasirodys viduje "nepriskirtas" srityje. Keista, eh? Jokių rūpesčių, kaip ilgai, kaip tai veikia - ir tai bus mums.
- Vilkite "Namai" thingie iš "turto" srityje į "menu1" keturkampio ploto. Jis taps "Namai" elementas meniu.
- Pakartokite 3-4 žingsnius kai iš "Puslapiai" srityje, taip pat dėl kategorijų "kategorijoms" srityje puslapiuose. Vilkite kitus elementus, kuriuos norite būti ant jūsų meniu viduje "menu1" stačiakampis. Galite paspausti puslapiuose, kategorijas, vartotojai ir kai kurie nestandartinių elementų, tokių kaip "sąrašo dalijančios" ir "kodo blokas". Kodas blokas yra kietas būdas pridėti pasirinktinius fragmentus viduje meniu.
- Galite vilkti meniu elementus viduje "menu1" srityje pertvarkyti jų eiliškumą.
- Jūs galite reguliuoti hierarchinę padėtį kiekvienoje menių punktą "<" ir ">" rodyklėmis.
- Paspaudę ant teksto pavadinimo kiekvieną meniu parametrą - atveria proto neįtikėtinas papildomų tinkinimo dialogo šią prekę nėra. Aš daugiausia naudoti numatytuosius nustatymus, bet techniškai, jūs galite išprotėti ir pradėti uždirbti vaizdiniai meniu pasirinktis ir įtraukti gabaliukus HTML kodą į jį. Elgtis atsargiai nors.
- Dėl linkless unclikable submeniu, kuris tarnauja kaip "tėvų" kitų "sub-vaikams" Aš naudojamų "blokas kodo" tipo. Pavyzdžiui, kai pritaikyti tokį blokas kodo elementą įstojau į "meniu alias" = "MemberWing" ir "Įveskite kodą blokas:" = "<a href='#'> MemberWing </ a>". Atsižvelgdama href = "#" leis ne spausti, bet veikia kaip galiojanti "tėvų" meniu pasirinkimas.
- Štai kaip mano NAVT "menu1" statyti struktūra atrodė beveik baigtas:
- Baigti pirminį pastatą ir tada spustelėkite "pavaros" piktogramą pritaikyti savo meniu struktūrą:
- Tai atvers langą su 4 skirtukais: Options ekranas, CSS, tema.
- Eiti į "Options" kortelę ir įsitikinkite, kad viskas yra pažymėtas ir "Grupės pavadinimas", sako: "menu1"
- Eikite į "Rodyti" skirtuką ir įsitikinkite, kad viską apie "Rodyti navigacijos grupėje ..." plotas yra tikrinama [x]. Palikite pailsėti nutylėjimą.
- Eikite į "CSS" kortelėje ir pasirinkite mygtuką (x) "Negalima taikyti CSS klases".
- Eikite į "Tema" skirtuką ir jį užpildyti, pavyzdžiui, kad:
Įdėkite į "Įtraukti žymes iki ..." zona šį kodą:
<div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
Įdėkite į "Įtraukti žymes po ..." zona šį kodą:
<br style='clear: left' /></div> - Paspauskite [įrašyti / CLOSE] mygtuką
- Šiuo metu meniu pastate per NAVT įskiepiai variantų yra baigtas.
Dabar atėjo laikas padaryti šiek tiek melodija iki darbo tema, kad jį gauti pasiruošę. Kad mes turime pridėti keletą pasirinktinių failus - CSS ir JavaScript, kad priklauso į meniu ir atnaujinti disertaciją "custom_functions.php - Parsisiųsti pilną failus čia .
- Išpakuokite archyvą. Jei atnaujinsite savo custom_functions.php su savo nustatymų - reikia jas sujungti su mano stuff. Aš palikti jį jums.
Jei neturite palietė - nedvejodami ją perrašyti su mano. Atkreipkite dėmesį: "Aš verčiau poziciją meniu pagal svetainės antraštę (numatytasis pirmiau) - taigi mano reguliavimas įtraukti šią nuostatą taip pat. - Įkelkite archyvas įskaitant visus pakatalogius ir failus pagal savo baigiamojo darbo temą "pagal užsakymą" katalogą, pavyzdžiui:
.../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
Aš ne palietė custom.css - aš norėčiau, kad meniu konkretų CSS pagal savo vietose siekiant išvengti netvarka viduje custom.css - Šiuo metu jūs galite perkrauti savo svetainę ir pamatyti naują gražią naują lygių, įdėtos, SEO optimizuotą meniu.
- Jūs visada gali grįžti į NAVT parametrus ir tinkinti meniu su daugiau galimybių rinktis arba perkelti viską. Tai atsispindės gyvų svetainėje automatiškai.
Kelias pirmyn ...
Šis vadovėlis įtraukti kūrybinį pavyzdį vieno tipo meniu. Aš žaidžiau su kitu - tik pamatyti, kaip tamsios spalvos meniu turėtų atrodyti:
Darbo tema - daugiapakopis įdėtos CSS meniu - tamsiai paletė
Manau, kad tai yra labai gražus. Yra daug navigacijos pavyzdžiai pateikiami adresu Dynamic Drive - visi jie yra įmanoma pritaikyti už darbą ir kitų Wordpress Themes Pasistengęs:
Dynamic Drive Horizontalus meniu
Tikiuosi, kad jūs rasite tai pamoka naudinga ir naudinga. Kaip jau sakiau, tai galima pritaikyti bet kurį iš šių meniu už baigiamąjį darbą - tai yra tam tikrą laiką, ir nori, kad jis įvyktų.
Galėčiau padaryti šį darbą už jus pagal sutartį. Tiesiog pasirinkite meniu jums patinka, susisiekite su manimi ir aš jums dirbti su kodu ir instrukcijos jūsų svetainę.
$ 20
Ir, žinoma, jei esate iki pastato super SEO optimizuotą Premium WordPress nario portalas - geriausias sprendimas taip:
Darbo tema + MemberWing narystė įskiepiai + savarankiškai surengė WordPress žinoma.
Komentarai apie šį įrašą yra uždarytos.