Teza Theme - multilevel, mbivendosur, menu SEO miqësore - tutorial

Teza Theme Tutorial - duke shtuar shumë nivele, mbivendosur menu navigacion, SEO miqësore për Wordpress

nga gesman8 korrik 2009

Kërkimi i përsosur menu ...

Kjo është pjesa e 1 tutorial
Pjesa 2 të këtij tutorial mëson se si të ndërtojnë menu vertikale + paleta ngjyrë të errët për një horizontale

I vendosur për të marrë temë teza, sepse një nga klientët e mi më informoi rreth çështjeve të pajtueshmërisë midis teza dhe wordpress tim site anëtarësimit plugin MemberWing. I fixed it dhe pastaj vendosi të marrë një vështrim nga afër teza dhe bothered të vërtetë për të parë video në faqen e parë të faqes kryesore Tema - Diythemes.com.
Çfarë përshtypje mua më është vëmendjen në detaje, mirëdashësi përdorues dhe mbi të gjitha - veçoritë SEO që janë aq të mirë e menduar.
Plugin MemberWing anëtarësimit ishte projektuar nga toka për faqet e anëtarësimit që do të ketë nevojë të tërheqë sa më shumë lëng SEO të jetë e mundur. Kështu që unë kushtuar shumë vëmendje për turma i përmirësimeve SEO dhe perfections në MemberWing. Shumë nga klientët e mi janë pyetur për tema të ndryshme për të përdorur dhe të kesh temë që ishte aq e optimizuar SEO edhe nga brenda e thellë do të jetë i aftë të shkëlqyer për anëtarësimin e sipërmarrësit portalit.

Kombinuar SEO fuqitë e MemberWing SEO me fuqitë e do të japë më të mirë të mundësive të lartë për klientët e mi. Kështu që unë kam teza dhe luajti me atë për një ditë.

Kjo është një temë e shkëlqyer në të gjitha rrugët. Pjesë navigacion, e kjo edhe pse është pak e kufizuar në funksion. Duke u nisur nga teza 1,5 + kjo është një nivel menu vetëm. Dëshira ime e zakonshme është që të jetë në gjendje të rregulloje navigacion sa duhet. Disa vende kanë vetëm disa faqe, shumë të tjerë kanë ton të faqeve statike + zillions e artikujve / postimet + shumë kategori.
Kështu në botën ideale që ka një shans për të krijuar nice looking organizuar hierarkike miqësore përdorues menu navigacion, është një domosdoshmëri. Drejtë Tema off bat ka të mira në kërkim navigacion, por kam vërejtur se të gjitha faqet e internetit Tema-bazë janë në kërkim si binjake. Customizing menu Tema navigacion, nuk është me të vërtetë e lehtë kështu që shumica e njerëzve vetëm lëre siç është. Nuk ka asnjë mënyrë për të ndryshuar për të kategorive në menunë ose pozicionimin e tyre në mes pages. Dhe përsëri, aftësia për të krijuar strukturat e mbivendosur meny është e zhdukur. Kështu që unë vendosa të shoh se çfarë mund të bëhet për të.
Pas duke u përpjekur për gjysmë duzinë menu / plugins navigacion, lidhur me zgjedhjen time kam vendosur mbi Lista NAVT Navigation Wordpress Plugin.
Plugin NAVT është në thelb gjenerator parenditur lista me dashuroj super dhe pak vështirë-në-figurë untraditional admin interface. Çfarë mashtruese për këtë është se ajo nuk ka të vërtetë të krijojë menus dashuroj kërkoni vetë. It does pjesa më e vështirë e punës pse - ju jep vizualisht një aftësi për të tërhequr së bashku, dhe të gjenerojë lista parenditur - skelet e menu tuaja të jetë. Dhe ju mund të krijojë shumë menus too. Ju mund të tërheqë të gjitha llojet e stuff Wordpress në menu navigacion: faqe, mesazhe, artikuj, kategori, përdoruesit, blloqe kod, lidhjet e jashtme, kompas, separators dhe përzierje e ndeshjes dhe çerdhe dhe rregullojnë dhe përshtatjen e tyre në çdo pemë të ngjashme me strukturën e ju dua.
NAVT gjeneron për ju rezultoi lista HTML renditura. Bukuri i dytë i NAVT është se kjo ju ndihmon për të futur menu tuaj të re në temë tuaj nëpërmjet jQuery i famshëm në bazë logjike, por pa nevojë për të ndryshuar ndonjë kodi! NAVT ju lejon te specifikoni: "zëvendësuar këtë element # me menu NAVT tim të ri". # element mund të jetë një id ose klasë të rrugën e menysë ekzistuese apo div tag element që është duke u prodhuar nga tema juaj aktual. Pra NAVT bën këtë zëvendësim për ju pa ju detyruar që të shkojnë në kodin e motivit dhe do të bëjë atë më të çrregullt se ajo tashmë është. Në qoftë se të gjitha tingëllon si dërdëllisje - mos u bëni merak - unë do ju udhëzuar hap pas hapi shpejt. Pjesë sfiduese të NAVT për të gjithë është se ju do të keni për të ardhur deri me CSS aktuale + images + kod javascript per menune tuaj sipas deshires. Dhe kjo deri te ju të kuptoj se ku dhe si t'i integrojë këto dosje dhe të bëjë këtë siç duhet të marrë stuff lidhur së bashku.
Sinqerisht pa e ditur disa jQuery + PHP + + CSS përvojë që ka mirë me Wordpress - kjo gjë është e vështirë për t'u tërhequr.
Unë e di këtë me kënaqësi stuff pak kështu që vendosa të kafshimit plumb dhe udhërrëfyes për njerëzimin në ndërtimin e lirisë më të mirë të menutë navigacion më të mirë për Wordpress. Unë vetëm e nevojshme për të gjetur burimet e disa nice looking menu horizontale CSS. I zgjedhur website dinamike me makinë për zgjedhjet e tyre më të mira, popull dhe burimet.

Kam dedikuar një ditë për të studiuar teza dhe të luajë me plugin NAVT. Në fund kam krijuar me krenari doganore, fleksibël, SEO optimizuar, me shumë nivele, struktura mbivendosur nagivation për web faqen time Wordpress + teza bazë.

Lista e tiparet e, menu multilevel mbivendosur Wordpress navigacion për
(you got to love this stuff):

  • Profesionale, duken të pastër dhe të ndjehen.
  • Mbështetje për të gjithë shfletuesit modern, duke përfshirë MSIE 6,7, Opera, Safari, Firefox 3.x, Google Chrome në të dy javascript dhe jo-modes javascript.
  • Gracefully downgradable për jo-shfletues javascript. Ju Menyja do të jetë i përdorshëm, të ngjashme me sy dhe duke punuar edhe për shfletuesit javascript aftësi të kufizuara (megjithëse vetëm navigacion nivelit të lartë do të jetë e dukshme dhe nuk do të ndodhë flyouts natyrisht pasi ato janë bërë nga javascript).
  • SEO friendly features - parenditur menu lista Kodi HTML është krijuar brenda. Google dhe merimangat e tjera search engine do të jetë në gjendje të indeksi i strukturës tuaj navigacion, dhe gjeni lidhje me faqet e brendshme.
  • Asistenca për nivele të pakufizuar shturë dhe sublevels.
  • Asistenca për ndonjë qëllim apo faqe, postimet (nëpërmjet përdorues përcaktuar URIs), kategorive, përdoruesit, blloqe kodin doganore dhe lidhjet e jashtme brenda menu.
  • Mbështetja e tekstit-si edhe imazhin e bazuar në elemente menu. (Unë kam ende për të provoni këto pse).
  • Menu strukturë dhe përmbajtje është shikimi i rregullueshëm nëpërmjet zonë NAVT admin.
  • Të Përkora: flyouts jQuery bazuar për nivelet e mbivendosur.
  • Fast: jQuery për meny është ngarkuar nga serverat e Google (I'd love teza vetë të bëjë të njëjtën në vend të tërhequr atë vend). Kjo do të përshpejtojë gjërat pak.
  • Scalability - Ky lloj i meny është editable dhe configurable në çdo kohë nëpërmjet plugin settings NAVT pa ndonjë nevojë për kodim kudo.

I përdorur këtë meny shkëlqyer nga portali me makinë dinamike si një bazë. Unë duhej të rregulloje kodin javascript një grimë, si dhe përfshijnë copë e PHP në custom_functions.php për ta bërë atë të punojë me teza. Gjithashtu numri i para-faqeve ekzistuese, kategoritë dhe postime nga siti im u përdorën për të mbledhur strukturë menu. Specifikat e juaj faqe do të jenë të ndryshme - por do të jenë konceptet e njëjtë.
Pra, le të vazhdojë, do të kemi?

Hap pas hapi instruksionet për NAVT setup-bazuar SEO mbivendosur, i përshtatshëm, me shumë nivele, miqësore
dhe thjesht cool looking navigation menu for Wordpress dhe teza Theme

  1. Go to Wordpress admin panel. Plugins-> Add new search, për "navt". Plugin do të tregohet. Click [Install], [Instalo tani], "Aktivizo Plugin".
  2. Tools-> NAVT Listat, i brendshem "Grupi Navigation zonë" gjej "Emri i grupit" dhe shkruani: "menu1" në fushë, shtypni [Krijo] button. "Menu1" zonë drejtkëndësh u krijuar.
    Kjo "menu1" zonë do të jetë lojrave kryesore për ndërtimin menu. Ju do të zvarritje dhe rënë këtu elementet tuaj menu.
  3. Në "pasuri" zonë gjeni "të tjera listbox" dhe kliko tek "Home zgjedhje". "Home" thingie do të shfaqet brenda "Unassigned" zonë. Pazakontë, eh? Nuk ka shqetësime, për sa kohë që punon - dhe kjo do të na.
  4. Drag këtë "Home thingie" nga "mjetet" zonë në "menu1" zonë drejtkëndësh. Do të bëhet "Home" item në menu.
    • Përsërit hapat 3-4 për të disa faqe nga "Pages" zonë, si dhe për kategoritë në "kategoritë" zonë. Drag çdo sende të tjera që ju doni të jetë në menynë tuaj brenda "menu1" drejtkëndësh. Ju mund të klikoni mbi faqet, kategoritë, përdoruesve dhe disa elemente me porosi të tilla si "divider listën" dhe "bllok kodi". Bllok Kodi është mënyrë për të shtuar copra cool custom brenda menu.
    • Ju mund të zvarritet brenda menu items "menu1" zonë të rirregullonin mënyrë e tyre.
    • Ju mund të rregullojë pozitën hierarkike të secilit artikull menu me "<" dhe ">" shigjeta.
    • Duke klikuar mbi emrin tekstin e secilit menu item - hap boggling mendje customization dialog shtesë për këtë artikull. I përdorur kryesisht defaults teknikisht, por ju mund të shkoni i çmendur dhe të fillojnë të bëjnë imazhin e bazuar në zgjedhje menu dhe shtoni chunks të kodit HTML në të. Vazhdohet me kujdes pse.
    • Për Submenus linkless unclikable që do të shërbejë si "prindër" për akte tjera "fëmijë" I përdorur "bllok Code" type. Për shembull kur customizing tillë pika bllok kodi i hyrë për "item alias Menu" = "MemberWing" dhe për "Shkruani kodin bllokut:" = <a "href='#'> MemberWing </ a>". Duke href = "#" do të bëjë nuk klikueshme por duke vepruar si një prind i vlefshëm "" Zgjedhja menu.
  5. Ja se si NAVT tim 'menu1' të ndërtuar struktura dukej si përfunduar pothuajse:
    navt_building_icon
  6. Mbaro ndërtimin fillestar dhe pastaj klikoni mbi "veshje" ikonë për të rregulloje strukturë tuaj menu:
    navt_customize_menu
  7. Ajo do të hapë dialogun me 4 skedat: Mundësitë e zgjedhjes, Display, CSS, Theme.
    1. Shko tek "Options" tab dhe të sigurohemi që çdo gjë është e pakontrolluar dhe "Emri i grupit" thotë: "menu1"
    2. Go to "Display tab" dhe të bëjnë çdo gjë të sigurt në "grup Show navigacion më ..." zonë është kontrolluar [x]. Leave pjesa tjetër në standarte.
    3. Shko tek "CSS tab" dhe zgjidh butonin e radios (x) "Mos zbatohet CSS klasa".
    4. Shko tek "Theme tab" dhe plotëso atë si kjo:
      navt_configuration_theme_tab_icon
      Fut në "Add tags para ..." zonën e këtij Kodi:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Fut në "Add tags pas ..." zonën e këtij Kodi:
      <br style='clear: left' /></div>
    5. Press [save / close] button
  8. Në këtë ndërtesë menu pikë nga brenda plugin opsionet NAVT është e plotë.
    Tani është koha për të bërë një mendje pak për për të marrë atë gati. Për këtë ne kemi nevojë të shtoni një fotografi pak me porosi - CSS dhe JavaScript që i përket menusë dhe përditësimin custom_functions.php teza '
  9. Shkarko plotë set fotografi këtu.
  10. Arkivi Unzip. Nëse keni updated custom_functions.php tuaj me Përshtatje tuaj - ju duhet të bashkojë ata me sende tim. Unë do të iki se deri te ju.
    Nëse ju nuk e kanë prekur atë - të ndjehen të lirë për të prishësh atë me minave. Ju lutemi vini re: I preferuar në pozitën menu nën kokë internetit (default është më lart) - kështu që rregullimi im përfshirë këtë preferencë si.
  11. Arkivi Ngarko duke përfshirë të gjitha subdirectories dhe dosjet nën tuaj 'Lista custom', si kjo:
    .../themes/THESIS-DIR/custom/custom_functions.php
    .../themes/THESIS-DIR/custom/jquerycssmenu/...

    Unë nuk e kanë prekur custom.css - Preferoj të mbaj menu-specifike në lokacione CSS e tyre për të shmangur krijimin e bela brenda custom.css
  12. Në këtë moment ju mund të rifreskoni faqen tuaj dhe shikoni menune e re e bukur e re shumë nivele, mbivendosur, SEO optimizuar.
  13. Ju mund gjithmonë të kthehem në parametrat NAVT dhe rregulloje menu tuaja me më shumë zgjedhje apo reposition asgjë. Kjo do të pasqyrohet në faqen jetojnë automatikisht.

Rruga përpara ...

Ky tutorial përfshirë shembull krijues i një lloji të menysë. Kam luajtur me një tjetër - vetëm për të parë menu se si me ngjyrë të errët do të dukej si:

Thesis theme - multilevel nested CSS menu - dark palette

- multilevel mbivendosur menu CSS - errët paleta

Unë mendoj se është shumë e bukur. Nuk janë shumë më të mostrave të lundrimit në dispozicion në Dynamic Drive - të gjitha prej tyre janë të mundshme të rregulloje për teza dhe tema të tjera Wordpress me disa përpjekje:

Dynamic Drive Horizontal Menus

Dynamic Drive horizontale Menus

Unë shpresoj që ju do të gjeni këtë tutorial të dobishme dhe të dobishme. Siç thashë, është e mundur që të rregulloje ndonjë nga këto menus për teza - që i jepet kohë dhe dëshirë për ta bërë atë të ndodhë.

Unë mund të bëjë këtë punë për ju në një bazë të kontratës. Vetëm marr menu ju pëlqen, kontaktoni mua dhe unë do të punojnë në kodin dhe udhëzimet për faqen tuaj te internetit.

$ 20

Dhe sigurisht, nëse ju jeni deri në ndërtimin e super SEO optimizuar wordpress Premium portali anëtarësim - zgjidhja më e mirë për këtë:
Tema Tema + MemberWing plugin anëtarësimit + priti vetë Wordpress natyrisht.

Leave a Comment

Previous post:

Next post: