Tez Tema - çok düzeyli, iç içe, SEO dostu menü - Yardım

Tez Tema Eğitimi - Wordpress için çok düzeyli, iç içe, SEO dostu navigasyon menüsü ekleme

2009, gesman üzerine 8 Temmuz

Quest mükemmel bir menü için ...

This Part 1 biridir Öğretici
Bölüm 2 tutorial bu bir öğretir renk koyu dikey menü + nasıl inşa yatay paleti için

Ben olsun karar Tez tema benim ve, çünkü bir tezi arasında sorunlar hakkında uyumunuz benim müşteri bilgilendirilir wordpress üyelik site tapa MemberWing. Ben ve o sabit sonra seyretmek Tezi daha yakından bakmaya karar verdi ve zahmetine aslında Diythemes.com - sayfanın ana ön videolara Tez site .
Ama beni en çok detay için, kullanım kolaylığı ve çok iyi düşünülen en önemlisi - SEO özellikleri dikkat etkiledi.
MemberWing üyelik eklentisi yere kadar mümkün olduğunca SEO suyu çekmek gerekir üyelik siteleri için tasarlanmış oldu. Bu yüzden SEO donanımları ve MemberWing içinde perfections kalabalığından dikkat birçok ödedi. kendi müşterilerine birçok farklı temalar hakkında ve bu kadar iyi SEO derinden üyelik için mükemmel bir uyum portal girişimcilere olacağını optimize edildi sahip tema kullanmak istiyoruz.

SEO güçlerin ile MemberWing ve SEO güçlerin birleştirilmesi müşterilerine en iyi olanak sıralamasını olur ver. Bu yüzden Tezi var ve onunla bir gün için oynadı.

Tüm yönden mükemmel bir tema. bunun navigasyon parçası olsa biraz fonksiyonu sınırlıdır. Tez 1.5 + başlayarak o bir seviye menü yalnızca. Her zamanki arzu kadar gerektiği gibi kullan özelleştirmek mümkün olacak. Bazı siteler, birçok makale + katrilyonlar / mesaj kategoriler sürü + statik sayfaların ton yalnızca kaç sayfa var.
Yani ideal dünyanın bir şans güzel hiyerarşik olarak düzenlenmiş görünümlü kullanıcı dostu navigasyon menüsü oluşturmak zorunda bir zorunluluktur. yarasa off Tez sağ yakışıklı kullan ama tüm Tez tabanlı web siteleri ikizler gibi arıyoruz fark vardır. Özelleştirme Tez navigasyon menüsü çok kolay olduğu gibi bu yüzden pek çok insan bırakmak değildir. Yolu yoktur menüsünde Kategorilerin sırasını değiştirmek için veya sayfalar arasında onları konumudur. Ve yine, yetenek iç içe menü yapısı oluşturmak için eksik. Bu yüzden ne hakkında yapılabilir görmek için karar verdi.
seçimi denedikten sonra set benim yarım düzine menü / I ile ilgili eklentileri kullan Wordpress Gezinti Listesi Plugin NAVT .
NAVT eklenti aslında süper fantezi ve biraz untraditional yönetici arayüzü hard-to-rakam liste jeneratör Rakamsız olduğunu. Ne hakkında yanıltıcı bunun aslında kendisi tarafından fantezi arayan menüleri oluşturmak değildir. Bu rağmen işin en zor kısım nedir - bir yetenek görsel elbirliği verir ve düzensiz liste oluşturmak - menü-olmak için bir iskelet. Ve çok menüler oluşturabilirsiniz. Navigasyon menüsüne Wordpress şeyler her türlü çekebilir: sayfaları, mesajlar, makaleler, kategoriler, kullanıcılar, kod blokları, dış bağlantılar, bölücüler, ayırıcılar karıştırın ve maç ve yuva ve düzenlemek ve herhangi bir ağacın bunları özelleştirmek size istiyorum.
NAVT sizin için üretir HTML düzensiz liste sonuçlandı. NAVT İkinci güzellik bunun eklemek için tema içine ünlü JQuery dayalı mantık üzerinden Yeni menü size yardımcı olur ama gerek herhangi kodunu değiştirmek için yoktur! NAVT sizin belirlemenizi sağlar: "Yeni NAVT menü" ile bu # eleman değiştirin. # Eleman id veya mevcut menü veya geçerli tema ise üretilen div element etiketinin yol sınıfı olabilir. Yani NAVT tema koduna gitmek ve daha önceden bir karışıklık yapmak zorlamadan sizin için bu değiştirme yok. Ben adım adım yakında tarafından size yol olduğunu anlamsız gibi tüm sesleri - endişelenmeyin - Eğer. herkes için NAVT bir zorlu kısmı sizin menü kendiniz için gerçek CSS + görüntüleri + javascript kodu ile gelmek zorunda kalacağız. Ve sizin nerede ve nasıl anlamaya bu dosyaları bütünleştirmek ve bu malzeme düzgün bir araya bağlı olsun harika.
Saygılar bazı PHP + CSS + Wordpress ile terbiyeli deneyime sahip JQuery + bilmeden - bu şey çekmek zordur.
Ben Wordpress için en iyi navigasyon menüleri en iyi bina özgürlük mermi ve rehber insanlık ısırmaya karar verdim Memnuniyetle ben bu şeyleri biraz biliyorum. Sadece biraz güzel yatay CSS menüler için kaynakları bulmak gerekiyordu. Ben aldım dinamik sürücü web kaynakları için en iyi seçim, demolar ve.

Ben bir gün Tez ve NAVT eklentisi ile oynamak çalışmaya adadı. Sonunda ben gururla özel, SEO optimize edilmiş, çok seviyeli, iç içe nagivation yapısı benim Wordpress + Tez esaslı site için esnek oluşturdu.

için menü Wordpress özelliklerinin çok seviyeli, iç içe Listesi
(Siz) malzeme bu aşk GOT:

  • Profesyonel, temiz bakmak ve duyumsamak.
  • MSIE 6,7, Opera, Safari, Firefox 3.x, Google Chrome hem javascript ve non-javascript modları dahil tüm modern tarayıcılar için destek.
  • Incelikle olmayan javascript tarayıcılar için downgradable. Menü kullanışlı olacak görsel benzer ve hatta sadece üst düzey navigasyon olsa javascript özürlü tarayıcılar (çalışma için görünür olacak ve hiçbir flyouts tabii olacağına javascript yapılır gibi).
  • SEO dostu özellikler - Rakamsız liste menü kodu HTML içinde oluşturulur. Google ve diğer arama motorları da muktedir endeksi navigasyon yapısı olacak ve iç sayfalara bağlantılar bulabilirsiniz.
  • sınırsız yuvalama düzeyleri ve sublevels için destek.
  • herhangi bir emir ya da sayfa, ileti (kullanıcı tanımlı URI'ler üzerinden desteği), kategori, kullanıcıları, özel kod blokları ve menü içinde dış bağlantılar.
  • metin de resim tabanlı menü öğeleri olarak desteklenmesi. (Henüz denemek zorunda bu se).
  • Menü yapısı ve içeriği görsel NAVT Admin üzerinden ayarlanabilir.
  • Kompakt: iç içe seviyeleri için JQuery tabanlı flyouts.
  • Hızlı: JQuery menü için Google sunucularına (I love Tezi yerine aynısını yapmaya yerel çekerek) kendisi ediyorum yüklenir. Bu biraz işler daha hızlı olacaktır.
  • Ölçeklenebilirlik - menüsü Bu tip düzenlenebilir ve ayarlanabilir NAVT eklenti ayarlar ile her zaman her yerde kodlama gerek yoktur.

Ben kullanılan dinamik sürücü menüsünde bu mükemmel temel bir portal olarak. Ben de biraz javascript kodu özelleştirmek gibi custom_functions.php içine Tez çalışmasını sağlamak için PHP duyulur dahil oldu. Da önceden var olan sayfa sayısını, kategoriler ve mesaj sitemden menü yapısı araya kullanılmıştır. Sitenizin özellikleri farklı olacaktır - ama kavramları aynı olacaktır.
Haydi devam, olur mu?

talimatları adım adım kurulum NAVT tabanlı iç içe, özelleştirilebilir, çok düzeyli, SEO dostu
ve sadece düz ve Wordpress menü navigasyon serin seyir Tez Tema

  1. Wordpress admin paneline gidin. Eklentiler-> "navt" yeni arama ekleyin. Eklentisi görünecek. Tıklayınız [Install], [şimdi] Install "," Plugin etkinleştirin.
  2. Araçlar-> NAVT listeler, Navigasyon Grubu "alan" Inside basın [Create] düğmesi "grubunun adını" girin: "menu1" alanında bulabilirsiniz. "Menu1" dikdörtgen alanı oluşturdu var.
    Bu "menu1" alan menü yapımı için temel oyun alanı olacak. Sen sürükleyerek olacak ve burada menü öğeleri bırakarak.
  3. "Varlıklar" alan "diğer" listbox ve "Home" seçimine bulmak içinde. "Home" thingie içinde görünür "alan atanmamış. Garip, değil mi? Telaş yok, sürece çalışır gibi - ve olacak bizim için.
  4. "Varlık" alanından "menu1" dikdörtgen alana bu "Home" thingie sürükleyin. Bu menüde "Home" kalemi haline gelecektir.
    • "Sayfalar" alanında, yanı sıra "kategoriler" alanında kategoriler bazı sayfaları için adımları tekrarlayın 3-4. Eğer menüsünde içinde olmak istiyorum başka öğeler Drag "menu1" dikdörtgen. sayfalarında tıklayabilir, kategoriler, kullanıcılar ve "listesinde bölücü" ve "kod bloğu" gibi bazı özel elemanlar. Kod bloğu serin yol menü içinde özel parçaları eklemektir.
    • Senin içinde menü öğeleri sürükleyerek "menu1" alanında kendi sırasını yeniden düzenlemek için.
    • Sen her menü öğesinin hiyerarşik konumunu ayarlayabilirsiniz "<" ve ">" ok.
    • Her menü öğesinin metin ismin üzerine tıklarsanız - zihin Bu öğe için ekstra özelleştirme iletişim boggling açılır. Ben çok ama öntanımlı kullanılan teknik olarak çılgın gidip resim tabanlı menü seçeneklerinin yapmaya ve HTML kod parçaları ekleyin. dikkatli se ile devam edin.
    • I "tipi Kodu blok kullanılan diğer" alt çocuklar "için ebeveyn" olarak görev yapacak linkless unclikable alt menüler için. Örneğin ben menü öğesi alias "için" = "MemberWing girdi ve" kod bloğu Enter "gibi kod bloğu öğe özelleştirme için =" <a href='#'> MemberWing </ a> ". = Href sahip "#" seçim menüsü olacak bunu başaramıyor geçerli bir tıklanabilir ama oyunculuk olarak "üst".
  5. İşte benim NAVT 'menu1' inşa yapısı hemen hemen tamamlanmış gibi görünüyordu:
    navt_building_icon
  6. "Dişli" ikonuna Finish ilk bina ve ardından menü yapısı özelleştirmek için:
    navt_customize_menu
  7. Bu 4 tabs: ile iletişim kutusu açılacaktır Seçenekleri, Ekran, CSS, Tema.
    1. git "Seçenekler" sekmesini seçin ve emin olun her şeyin denetlenmeyen ve "grup adı" olduğunu söyledi: "menu1"
    2. gidin "Görüntü" sekmesini göster navigasyon grup "konulu emin olun her şeyin üstünde ..." alan [işaretli olduğundan x]. varsayılan olarak geri kalanı bırak.
    3. "CSS" sekmesini seçin ve radyo düğmesini (git x) "CSS sınıfları uygulamayın.
    4. gidin ve "Tema" sekmesi ve benzeri olduğu doldurun:
      navt_configuration_theme_tab_icon
      Ekle "etiketler ekleyin içine önce ..." alanına bu kodu:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Ekle "etiketler ekleyin içine sonra ..." alanına bu kodu:
      <br style='clear: left' /></div>
    5. Basın [/ butonuna] yakın tasarruf
  8. eklenti seçenekleri NAVT içinden Bu noktada menü bina olarak tamamlandı.
    Şimdi kadar nağme az zaman için ne bir müzik hazır ona ulaşması. ki birkaç özel dosya eklemek - CSS ve menü aittir ve Tez 'custom_functions.php güncelleme javascript ihtiyacınız için
  9. Download belirlenen dosyaları tam burada .
  10. Sıkıştırılmış arşiv. Eğer özelleştirmeleri ile custom_functions.php güncellenen varsa - siz benim malzeme ile birleştir gerekir. Sana onu bırakacağım.
    bunu dokunulmaz varsa - benimkiyle üzerine yazmak için çekinmeyin. Lütfen dikkat: ben konum menüsüne web sitesi başlığı (varsayılan altında tercih üzeri) - böyle benim ayar de bu tercihi dahil.
  11. altında Dosyalarınızı Upload arşiv de dahil olmak üzere tüm ve alt 'özel' listesi, şu şekilde:
    .../themes/THESIS-DIR/custom/custom_functions.php
    .../themes/THESIS-DIR/custom/jquerycssmenu/...

    Ben custom.css dokunmayan - Ben kendi konumları altında custom.css iç karışıklık yaratarak önlemek için menü özel CSS tutmayı tercih
  12. Bu noktada web sitenizin yeniden ve yeni güzel yeni çok seviyeli, iç içe, SEO iyimserlik menü görüyorum.
  13. Her zaman geri NAVT ayarları gidebilir ve daha fazla seçenek falan konumlandırmak ile menünüzü özelleştirin. Canlı sitede otomatik olarak yansıtılacaktır.

Yol ilerde ...

Bu eğitimde menü bir tür yaratıcı örnek alındı. Baskasi ile oynanır - ne kadar koyu renkli menü gibi olacağını görmek için:

Thesis theme - multilevel nested CSS menu - dark palette

- çok düzeyli iç içe CSS menü - koyu renkler

Ben çok güzel olduğunu düşünüyorum. Orada birçok fazla seyir kullanılabilir örnekleri Dynamic Drive - hepsi çaba bazı temalar ile mümkün ve diğer Wordpress Tez özelleştirmek için:

Dynamic Drive Horizontal Menus

Dinamik Yatay Menüler Drive

Bunu eğitimde faydalı ve yararlı bulacağınızı umuyorum. Dediğim gibi, mümkün herhangi Tez bu menülerin özelleştirmek için - o zaman ve arzu Bunu sağlamak için verilir.

Senin için bir sözleşme esasına göre bu işi yapabilirdi. Sadece senin gibi pick menü bana ulaşın ve web sitesi kodunuzu edeceğiz çalışmaları ve talimatlar.

20 $

seni eğer Ve elbette süper SEO portal premium wordpress üyelik optimize - bunun için en iyi çözüm binasına:
Tez Tema + MemberWing üyelik eklentisi + öz Wordpress ev sahipliği yaptı tabii ki.

Yorum bırak

Önceki mesaj:

Sonraki mesaj: