Menü
Bedava
kayıt
ev  /  internet/ Üst menüyü değiştirin. PdoMenu - MODX Modx dikey menüsünde bir menü oluşturma

Üst menüyü değiştirme. PdoMenu - MODX Modx dikey menüsünde bir menü oluşturma

Menü oluşturma snippet'i. Wayfinder'ın yerini alabilir ve parametrelerin belirlenmesinde daha fazla esneklik sağlar.

Örneğin, aynı anda birkaç ebeveynden bir menü oluşturarak bunları hem birlikte hem de ayrı dallar olarak görüntüleyebilir.

Hızda önemli bir artış, yalnızca ilk çalıştırmada sağlanır, daha fazla Wayfinder, yetkin önbelleğe alma sayesinde özellikle düşük değildir.

Seçenekler

Varsayılan olarak, pdoMenu genel pdoTools parametrelerini ve kendi parametrelerinden bazılarını kabul eder:

İsim Varsayılan Açıklama
& ebeveynler Mevcut kaynak Arama sonuçları için ebeveynlerin virgülle ayrılmış listesi. Eğer koyarsan & ebeveynler = "0"- örnek sınırlı değildir. Ebeveynin kimliği bir tire ile başlıyorsa, ebeveyn ve çocukları seçimin dışında tutulur.
& seviye 0 (sınırsız) Oluşturulan menü düzeyi.
& Kaynaklar Sonuçlarda görüntülenecek kaynakların virgülle ayrılmış listesi. Bir kaynak kimliği bir tire ile başlıyorsa, o kaynak seçimin dışında bırakılır.
& şablonlar Sonuçları filtrelemek için virgülle ayrılmış şablonların listesi. Bir şablon kimliği kısa çizgi ile başlıyorsa, onunla birlikte kaynaklar seçimin dışında bırakılır.
& nerede JSON kodlu ek getirme parametreleri dizisi.
& ekranBaşlat 0 Menü başlatma düğümlerinin görüntülenmesini etkinleştirin. Birden fazla ebeveyn belirtirken kullanışlıdır.
& bağlam Seçimi kaynak bağlamına göre kısıtlama.
& gösterGizli 0 Menüde gizlenmiş kaynakları göster.
& gösterYayınlanmamış 0 Yayınlanmamış kaynakları göster.
& önizlemeYayınlanmamış 0 Kullanıcının bunu yapma izni varsa, yayınlanmamış kaynakların gösterilmesini etkinleştirin.
& gizleAlt Menüler 0 Etkin olmayan menü dallarını gizleyin.
& Seçme Virgülle ayrılmış olarak seçilecek alanların listesi. Bir diziyle bir JSON dizesi belirtebilirsiniz, örneğin & select = `(" modResource ":" id, sayfa başlığı, içerik ")`
& göre sırala menü indeksi Parametrede belirtilmişse TV parametresi de dahil olmak üzere sıralanacak herhangi bir kaynak alanı & dahilTV'ler, Örneğin & sortby = `(" tvname ":" ASC "," sayfa başlığı ":" DESC ")`... Bir dizi alan içeren bir JSON dizesi belirtebilirsiniz. Rastgele sıralama için belirtin & sortby = `RAND()`
& sıralama ASC Sıralama yönü: azalan veya artan. & sortby ve & sortdir parametrelerini boş bırakırsanız, sıralama kaynak sırasına göre yapılır. & Kaynaklar.
& sınır 0 Numune sonuçlarının sayısını sınırlamak.
& telafi etmek 0 Sonuçları baştan atlama. Açıkça belirtilenlerle birlikte kullanılmalıdır & sınır
& kontrol İzinleri Kaynakları görüntülerken kullanıcının hangi izinleri kontrol etmesi gerektiğini belirtin, örneğin & checkPermissions = 'liste'.
& sayınÇocuklar 0 Her kategorinin alt kaynaklarının tam olarak sayılması ve [+ alt öğe]] yer tutucusunda görüntülenmesi. Veritabanına ek sorgular yapar, bu nedenle varsayılan olarak devre dışıdır.
& toYer tutucu Boş değilse, snippet tüm verileri ekranda gösterilmek yerine bu adla bir yer tutucuya kaydeder.
& plÖnek wf. Yerleştirilmiş yer tutucular için önek.
& gösterGünlük 0 Snippet'in çalışmasıyla ilgili ek bilgileri göster. Yalnızca "mgr" bağlamında yetkilendirilenler için.
& hızlı mod 0 Hızlı yığın işleme modu. Tüm ham etiketler (koşullar, snippet'ler vb.) kesilecektir.
& önbellek 0 Snippet sonuçları önbelleğe alma.
& Önbellek süresi 3600 Saniye cinsinden önbellek geçerliliği süresi.
& düzeni -1 URL oluşturma şeması modX :: makeUrl() öğesine iletilir, bu nedenle olası seçenekler gereklidir. Özel uri türü, işlevi çalıştırmadan kaynak uri değerini değiştirir.
& kullanWeblinkUrl 1 Kaynak sınıfına dayalı bir bağlantı oluşturun.
& rowIdPrefix Tanımlayıcıyı öbekte ayarlamak için önek id = "".
& buradaId oluşturulan menü için geçerli kaynağın kimliği. Bunu yalnızca betiğin kendisi yanlış tanımlıyorsa, örneğin başka bir parçacığın bir öbeğinden bir menü görüntülerken belirtmeniz gerekir.
& dahilTV'ler Seçim için TV parametrelerinin virgülle ayrılmış listesi. Örneğin & includeTV'ler = "eylem, zaman" yer tutuculara [[+ eylem]] ve [+ zaman]] verir.
& hazır TV'ler Tam yolların oluşturulması gereken medya kaynaklarından dosyalar içeren TV parametrelerinin listesi. yüklerseniz & hazır TV'ler = "1", içinde belirtilen tüm TV'ler & dahilTV'ler.
& prosesTV'ler Sistem yöneticisindeki ayarlarına göre işlenecek ve görüntülenecek TV parametrelerinin listesi. yüklerseniz & processTV'ler = "1", içinde belirtilen tüm TV'ler & dahilTV'ler... İşi yavaşlatır.
& tvÖnek TV parametreleri için ön ek.

Şablon parametreleri

Bu parametreler, menüler oluşturmak için şablonlar içeren parçaları ayarlar.

İsim Açıklama
& tplDış Tüm menü bloğunun tasarımının parçası. Varsayılan: @INLINE
    [[+ sarıcı]]
& tpl Menü öğesi tasarımının parçası. Belirtilmezse, kaynak alanlarının içeriği ekrana yazdırılacaktır. Varsayılan: @INLINE
  • [[+ menutitle]] [[+ sarmalayıcı]]
  • & tplburada Geçerli menü öğesinin tasarımının parçası.
    & tplBaşlat Dahil edilmesi koşuluyla, kök öğenin kayıt yığını & ekranBaşlat... Varsayılan: @INLINE

    [[+ menü başlığı]]

    [[+ sarıcı]]
    & tplÜst Satır & tplCategoryFolder koşullarıyla eşleşmeyen alt öğelere sahip ebeveyn tasarımının parçası. Örneğin: @INLINE
    & tplParentRowHere Alt öğeleri içeriyorsa, geçerli belgenin tasarımının parçası.
    & tplParentRowActive Aktif menü dalında torunları olan ebeveynlerin kayıt yığını.
    & tplCategoryFolder Kategori için özel bir yığın. Kategori, link_attributes alanında boş bir şablon veya rel = "category" olan çocukları olan bir ebeveyn olarak kabul edilir.
    & tplİç Tüm menü alt öğeleri bloğunun tasarımının parçası. Boşsa, kullanacak & tplDış... Örneğin: @INLINE
    & tplInnerSatır Menünün bir alt öğesinin kayıt parçası. Örneğin: @INLINE
    & tplInnerBurada Menünün etkin alt öğesinin kayıt parçası.

    CSS sınıfı parametreleri

    Bu parametreler, çeşitli menü öğeleri için [[+ sınıf adları]] ve [[+ sınıflar]] yer tutucularının değerini ayarlar. Yer tutucu [+ sınıf adları]] yalnızca niteliksiz sınıf adını görüntüler sınıf = "", yer tutucunun aksine [[+ sınıflar]].

    Örnekleri

    Site kökünden bir düzeye normal menü çıkışı:

    []

    Belirli ebeveynleri hariç tutan ve kullanıcı izinlerini kontrol eden çıktı:

    []

    Kök noktaları gösteren, aynı anda iki ebeveynden bir menü görüntüleme:

    []

    İç içe geçmiş kaynakların sayısını sayarak iki kaynak düzeyi görüntüleme:

    [] `& tplParentRow =` @ INLINE

  • [[+ menutitle]] ([[+ çocuklar]])
  • [[+ sarmalayıcı]] `& countChildren =` 1`]]



    yol bulucu MODX için bağlantı listelerini düzenlemeye yarar. Şablonların desteği sayesinde, listeleri gerekli herhangi bir biçimde görüntülemenizi sağlar:
    • Liste, tablo, resim, simge vb. şeklinde menü.
    • Statik menüler
    • Çeşitli efektlere sahip menüler (açılır, açılır, vb.)
    • site haritası
    Çağrı örneği:


    & rowTpl = `rowTpl'
    & dışTpl = 'dışTpl'
    & buradaSınıf = 'etkin'
    & rowClass = `eNav_li`]]

    Snippet parametreleri:

    & startId- ana sayfanın kimliği, 0 belirtirseniz site kökünden olacaktır. Varsayılan, etkin sayfanın kimliğidir

    & ekranBaşlat - menü başlığında startId ile belgeyi göster, varsayılan yanlış

    & seviye- yuvalama derinliği, varsayılan olarak 0 - tüm seviyeler

    & sınır- çıktıdaki sayfa sayısını sınırlayın (varsayılan 0 - sınır yok)

    & yoksayGizli- "Menüde göster" sayfasının onay kutusunu yok sayın, yani 1 belirtirseniz, tüm sayfaları görüntüler. Varsayılan 0'dır. Yalnızca "Menüde göster" onay kutusunun seçili olduğu sayfalar görüntülenir.

    & ph - doğrudan görüntülenen sonuçların yerine geçen kişinin adı. Varsayılan 0'dır.

    & hata ayıklama- hata ayıklama modu (varsayılan 0)

    & gizleAlt Menüler - yalnızca etkin alt menüyü genişlet (varsayılan 0)

    & KaldırNewLines- çıktıdaki satır besleme karakterini kaldırır (varsayılan 0)

    & metinOfLinks- menü bağlantısının adı için. Olası seçenekler:menü başlığı, kimlik, sayfa başlığı, açıklama, ebeveyn, takma ad, uzun başlık, giriş metni. Varsayılan menü başlığı

    & TitleOfLinks- menü bağlantısının başlığı için Seçenekler:menü başlığı, kimlik, sayfa başlığı, açıklama, ebeveyn, takma ad, uzun başlık, giriş metni. Varsayılan sayfa başlığı

    & rowIdPrefix- her öğe için kimliği (rowIdPrefix + docId) ayarlar. Varsayılan 0

    & dahil etDokümanlar- menüye dahil edilecek virgülle ayrılmış belgelerin kimliği (varsayılan olarak belirtilmez)

    & hariç tutDokümanlar - menüden hariç tutulacak, virgülle ayrılmış belgelerin kimliği (varsayılan 0)

    & bağlamlar- menüyü oluşturmak için bağlam. Varsayılan, günceldir.

    & startIdContext - Sonucu oluşturmak için belgelerin alındığı bağlamın tanımlayıcısı.

    & yapılandırma - Wayfinder yapılandırmasını depolamak için harici PHP dosyası (örnek: çekirdek / bileşenler / yol bulucu / yapılandırmalar).

    & düzeni - URL oluşturma biçimi. Olası değerler (makeURL API çağrısına göre):

    1: (varsayılan) site_url ile ilgili URL;

    0: bkz. http;

    1: bkz. https;

    dolu: site_url ile başlayan mutlak bir URL;

    abs: base_url ile başlayan mutlak bir URL;

    http: http şemasına zorlanan mutlak bir URL;


    https: https düzenine zorlanan mutlak bir URL.

    & göre sırala - Sıralamanın gerçekleştiği alan. (varsayılan menü indeksi)

    Seçenekler şunlardır:

    İD, menutitle, pagetitle, introtext, menuindex, yayınlandı, hidemenu, ebeveyn, isfolder, açıklama, takma ad, uzun yazı, tür, şablon

    & sıralama düzeni- Sıralama düzeni."ASC" veya "DESC". Varsayılan ASC

    & nerede - JSON tarzı filtre parametreleri (MySQL'de olduğu yerde eşleşir)... Örneğin, Makaleler eklentisinden bir blogu veya haberi gizlemek istediğinizde: & where = `[(" class_key:! = ":" Article ")]`
    Örnekler:
    yalnızca klasörlerin çıktısını alın: & burada = `isfolder = 1

    & buradaId - Snippet'te kullanılacak geçerli kimliği belirleyin. Şablon hereTpl parametresi kullanılarak belirtilmişse ve activeRowParentTpl menü öğesinde doğru şekilde uygulanmıyorsa [[* id]] değerini kullanın. Varsayılan olarak, geçerli kimlik.
    Bunu yalnızca betiğin kendisi yanlış tanımlıyorsa, örneğin başka bir parçacığın bir öbeğinden bir menü görüntülerken belirtmeniz gerekir.

    & buradaTpl - HereTpl şablonu, geçerli öğe menüde görüntülendiğinde kullanılır.
    Olası yer tutucular:
    [[+ wf.classes]] - kullanılan CSS sınıfını belirtmek için bir yer (sınıf = "" içerir)
    [[+ wf.classnames]] - yalnızca CSS sınıfının adını içerir (sınıf = "" içermez)
    [+ wf.link]] - bağlantının adresi (href)
    [+ wf.title]] - bağlantının başlığı için metin
    [+ wf.linktext]] - bağlantı başlığı metni
    [+ wf.wrapper]] - alt menünün görüntüleneceği yer
    [+ wf.id]] - benzersiz bir tanımlayıcı (id) göster
    [+ wf.attributes]] - ek bağlantı özelliklerini görüntüler
    [+ wf.docid]] - geçerli öğe için belge tanımlayıcısı
    [+ wf.subitemcount]] -klasördeki öğe sayısı
    [+ wf.description]] - açıklama alanının değerlerini görüntüler
    [+ wf.introtext]] - giriş metni alanının değerlerini görüntüler

    Örnek şablon: [[+ wf.linktext]] [[+ wf.wrapper]]

    Şablon parametreleri

    Bu parametreler, Wayfinder'ın çıktısını oluşturacak şablonları içeren parçaları belirtir.

    Wayfinder for MODX Revolution'ın mevcut sürümünde, wf önek yer tutucularını kullanarak özel TV'nize erişebilirsiniz. ör.[+ my_TV]]

    Bu yazının yazıldığı sırada yalnızca orijinal TV değerleri döndürülecek - biçimlendirilmeyecekler. Örneğin, TV'niz bir görüntüyse - şablonunuz içinde böyle bir TV'nin olağan kullanımı tam görüntü etiketini döndürür, ancak bir Wayfinder şablonu içinde - yalnızca görüntünün yolu döndürülür.

    TV'yi yönetmek istiyorsanız, Wayfinder satır şablonu (& rowTpl. Örneğin, TV görüntünüz simge ve genellikle şablonda çıktı için aşağıdaki kod kullanılır:

    ... ...

    Ancak bu, TV'yi yönetmenize izin vermeyeceğinden, onu şununla değiştirmeniz gerekir:

    ... ...

    Ve şimdi processTV snippet'inin içine aşağıdaki PHP kodunu koyuyoruz:

    getObject ("modResource", $ myId); dönüş $ doc-> getTVValue ($ myTV);

    Sonuç olarak, tamamen işlenmiş bir TV görüntüsü döndürülür.

    & dışTpl

    Dış kapsayıcı için şablonu içeren yığının adı.

    Kullanılabilir yer tutucular:

    • wf.classes - bir dizi Wayfinder parametresinden alınan sınıfları görüntüler (class = "" niteliği dahil)
    • wf.classnames - sınıf adlarını görüntüleyin (sınıf = "" olmadan)
    • wf.wrapper - dahili içeriği (satır) görüntüler.
      [+ wf.wrapper]]

    & innerTpl parametresi, & externalTpl ile aynı yer tutucuları içerir.

    & satırTpl

    Menü satırı öğeleri için şablon içeren yığın adı.

    Kullanılabilir yer tutucular:

    • wf.classes - sınıf çıktısı (sınıf = "" niteliği dahil)
    • wf.classnames - karşılık gelen sınıfları göster (sınıf = "" olmadan)
    • wf.link - menü bağlantısı için href = "" özniteliğinin değeri
    • wf.title - & titleOfLinks parametresinde belirtilen alandan bağlantı için başlık metninin adı
    • wf.linktext - & textOfLinks parametresinde iletilen alanda belirtilen etkin bağlantının metni
    • wf.wrapper - alt menü gibi dahili içeriği görüntüler
    • wf.id - özelliğin benzersiz kimliğini görüntüler. Bu yer tutucunun bir değer alması için & rowIdPrefix parametresini belirtmeniz gerekir. Değer, docId önekidir.
    • wf.attributes - Geçerli öğenin öznitelik bağlantısını yazdırır
    • wf.docid - geçerli öğenin belge kimliği
    • wf.description - geçerli öğenin açıklaması
    • wf.level - geçerli yuvalama düzeyi

    Kullanım örneği:

    [[+ wf.linktext]] [[+ wf.wrapper]]

    Başka seçenek:

  • [[+ wf.linktext]] - [[+ wf.description]] [[+ wf.wrapper]]

  • Örnekleri

    İlk seviye


    [[! Yol Bulucu? & startId = `0` & seviye =` 1`
    & rowTpl = `rowTpl'
    & dışTpl = 'dışTpl'
    & buradaSınıf = 'etkin'
    & rowClass = `eNav_li`]]

    Chunk kodu externalTpl



      [+ wf.wrapper]]

    RowTpl yığın kodu



      [+ wf.wrapper]]

    İkinci seviye (bu örnekte menü ve alt menü öğeleri görsel olarak aynı seviyedeydi)

    [[! Yol Bulucu? & startId = `0` & seviye =` 2`
    & rowTpl = `rowTplFooterMenu`
    & externalTpl = `outerTplFooterMenu`
    & innerTpl = `innerTplFooterMenu`
    & innerRowTpl = `innerRowTplFooterMenu`
    & buradaSınıf = 'etkin']]

    Chunk kodu externalTplFooterMenu



    [+ wf.wrapper]]

    yığın kodu rowTplFooterMenu




    • [+ wf.başlık]]


    • [+ wf.wrapper]]

    yığın kodu innerTplFooterMenu

    [+ wf.wrapper]]

    yığın kodu innerRowTplFooterMenu



  • [+ wf.başlık]]


  • Ama bu bizim için değil;).

    Her şeyi sıfırdan yapacağız. Neden (ben) buna ihtiyacımız vardı, çünkü zaten hazır seçenekler var? Çünkü ben böyle seviyorum. Çünkü bu yaklaşımın en doğru olduğunu düşünüyorum. Çünkü kendi kodumuzu geliştirebileceğimiz için, başka birinin kodunu kolayca anlayabilir, hataları değiştirebilir, düzeltebilir veya belirli bir durumda gerekli olan işlevsellik ile tamamlayabiliriz. Ve sonunda, kendinizinkini yapmak genellikle çok hoştur!

    Daha fazla anlatım, okuyucunun PHP programlama hakkında minimum bilgiye sahip olduğunu varsayacaktır. Teoride, kodu hiç anlamayan kişiler, kodu kopyalayabilecek ve aşağıda tartışılacak olan tüm adımları yeniden üretebileceklerdir. Bununla birlikte, ana koda girmeden harici konfigürasyon için bir sürü fırsat sağladıklarından, hazır snippet'leri a la Ditto kullanmaları daha iyi olabilir.

    Kullanıcı için neyin daha iyi olduğunu tartışmak istemiyorum - hazır almak veya kendi geliştirmek ... Hem bunda hem de başka bir durumda artıları ve eksileri var. Şahsen benim için ikinci seçeneğin daha fazla avantajı var. Ayrıca, okuyucuların her biri kendisi için karar verecektir.

    O halde bizimkilere tekrar bir göz atalım. Sitemizde epeyce farklı yazılım parçası olduğundan ve bir şeyle başlamanız gerektiğinden, programlayacağız ...

    Üst Menü

    "Üst menü" terimiyle, sitenin üst kısmındaki sayfalara yönelik bir dizi bağlantıyı kastediyorum (aşağıdaki resme bakın):

    Snippet oluşturmanın ilk örneğini çok detaylı anlatacağım, ileride daha çok en temel detaylar üzerinde duracağım.

    Bir önceki yazıda kurduğumuz yönetim sistemindeki site ağacımızla karşılaştıralım:

    Şekilden de görebileceğiniz gibi, site ağacında dört belge vurgulanmıştır (yani "Blog", "Yazarlar hakkında", "Fotoğraflar" ve "Geri bildirim"), daha sonra üst menüde bağlantılar oluşturacaktır.

    Ayrıca menüde görünmesini istemediğimiz gizli belgelerimiz olduğunu da hatırlatalım. Örneğin, "Site Arama" adlı belgenin ayarlarında, "Menüde göster" onay kutusu kaldırıldı ve kalan iki belge "Bağlantılar" ve "Kategoriler", onay kutusu kaldırılarak sitede gizlendi. "Yayınla" belge ayarlarında (belge ayarlarında "Sayfa ayarları" sekmesi).

    Böylece bir önceki yazımızda kontrol sisteminde üst menüyü hazırladık.

    Şimdi eylemlerimizi doğrudan sitede gösterme konusuna geçelim.

    Sitedeki programların çoğu sözde tarafından gerçekleştirilir. "", yani PHP'de ayrı kod parçaları (ayrı işlevler veya alt programlar olarak da anlaşılabilirler). Bu nedenle MODx'te üst menü gösterimini uygulamak için ayrıca yeni bir snippet oluşturmamız, programlamamız ve bu snippet'e doğru yerde şablonda bir çağrı eklememiz gerekiyor.

    Yönetim sistemine gidelim, "Kaynaklar" sekmesini -> "Kaynak yönetimi" -> "Snippet'ler" sekmesini açın ve "Yeni snippet" bağlantısını tıklayın. "Snippet name" alanına tırnak işaretleri olmadan "TopMenu" girin ve şimdilik kodsuz boş bir snippet kaydedin. Kaydettikten sonra "Snippets" sekmesinde snippet'imizin adını göreceğiz.

    Şablonumuzda üst menüyü "TOPMENU" öbeğine taşıdığımızı hatırlatmama izin verin. "Yığınlar" sekmesine geçin ve "" öbeğini açın. Bu yığının içeriğinde aşağıdaki kodu göreceğiz:


    • Blog

    • Yazarlar hakkında

    • Fotoğraf

    • Geri bildirim

    Bu kod, menümüzü oluşturan şeydir. Bunu yorumlayalım ve yığındaki "TopMenu" snippet'ine bir çağrı ekleyelim:


    []

    Burada yine bu yapının anlamını açıklığa kavuşturmak için biraz konunun dışına çıkmamız gerekecek []. Gerçek şu ki, [] veya [! SnippetName!] gibi yapıların yardımıyla, şablonlarımızda, parçalarımızda ve hatta sitenin herhangi bir ayrı sayfasında herhangi bir yerde snippet'lere çağrı yapabiliriz.

    Bu durumda, [] yapısı bir çağrıyı ifade eder. önbelleğe alınmış snippet, yani sonucu bir kez hesaplanacak ve yürütülecek olan dinamik bir alt programa yapılan bir çağrı ve daha sonra bu parçacığın çağrıldığı sayfa yüklendiğinde sonuç değişmeyecektir, çünkü snippet'in tekrarlanan çağrısı artık gerçekleşmiyor. Böylece, web sunucumuzun kaynaklarını koruyoruz (ve bu, kaynağa giden yüksek trafikle her zaman çok önemlidir).

    Ancak, snippet kodunu her zaman yeniden çalıştırmanız gereken ve sonuçları önbelleğe alamayacağınız durumlar vardır. Bu gibi durumlarda, snippet'i her zaman önbelleğe almadan yürütmeye zorlayacak olan [! SnippetName!] yapısı kullanılır. Benzetme yoluyla, bu yapıya çağrı denir. önbelleğe alınamaz snippet.

    O halde "TOPMENU" öbeğini kaydedelim ve site sayfasını yenileyelim. Hmm, garip bir şekilde, üst menü gitti. Ama gerçekten bu kadar şaşırtıcı mı? Yığındaki menünün HTML kodunu yorumlayarak, görüntüsünü tarayıcıda gizledik (bunu sayfanın HTML kaynağına bakarak kontrol edin). Ve "TopMenu" snippet'imiz, henüz hiçbir şey eklenmediğinden hiçbir şey yapmıyor. Bu eksikliği giderelim :).

    "Snippets" sekmesine geri dönelim, oluşturulan "TopMenu" snippet'ini açalım ve yeteneklerini test etmeye çalışalım... Sabır, ileri düzey okuyucularım, bu ayrıntılara herkes aşina değil.

    İlk olarak, en basit kodu yazalım (normal PHP kodu):

    echo "Test ...";
    ?>

    Kaydetmeden önce "Düzenlemeye devam et"i seçin, çünkü snippet'imizin içeriğini bir kereden fazla değiştirmemiz gerekecek ve bundan sonra snippet'i kaydedeceğiz. Site sayfasını yenileyelim ve üst menü yerine bakalım ... doğruyu söylemek gerekirse, ilk bakışta menünün biraz genişletilmiş mavi arka planı dışında neredeyse hiçbir değişiklik görmeyeceğiz. Site sayfasındaki tüm metni seçmek için "CRTL + A" tuşlarına basın ve snippet'imizin menü yerine "Test ediliyor ..." metnini gösterdiğini, sadece metin renginin arka plan rengiyle eşleştiğini göreceğiz.

    Snippet kodunu aşağıdaki gibi değiştirelim:

    Eko " Test yapmak ...";
    ?>

    Artık snippet'imizin çalıştığını ve hatta (!) bazı metinleri görüntülediğini açıkça görebiliyoruz. Pekala, bu iyi, ancak görevimiz için yeterli değil, çünkü snippet'imizin kontrol sisteminden bağlantıları ve "TOPMENU" öbeğinde yorumladığımız HTML koduyla tam olarak aynısını gösterdiğinden emin olmalıyız.

    Ve yine biraz dikkat dağınıklığı...

    MODx'teki tüm belge ilişkileri sistemi şu ilkeye göre oluşturulmuştur: her "üst belge" sıfırdan birçok "alt belge" ("ebeveyn" -> "alt belgeler") içerir.

    MODx veritabanındaki her belgenin kendi benzersiz tanımlayıcısı "ID" vardır - bu, site ağacında her belgenin yanında parantez içinde gördüğümüz sayıdır.

    Bu arada, bu benzersiz tanımlayıcı yalnızca tek bir anlam taşır - kontrol sistemindeki belirli bir belgeyi benzersiz şekilde tanımlar. ve başka bir şey yok! Özellikle bu gerçeğe odaklanıyorum, çünkü bu tanımlayıcıları çeşitli amaçlarla değiştirme girişimleriyle defalarca karşılaştım ... Hemen bunun anlamsız olduğunu hatırlamanız gerekiyor, bu yüzden bu sayıları değiştirmeye çalışmayın. Bunlara çok fazla dikkat etmemelisiniz, genellikle bu numaralar sadece belirli belgelere bağlantılar oluşturmak için kullanılır.

    MODx veritabanında ayrıca her belge için özel bir "ebeveyn" alanı oluşturulmuştur. Bu alanın değeri, ana belgenin benzersiz tanımlayıcısını veya belge ağacın kökündeyse sıfırı belirten bir sayıdır. Bu nedenle, belirli bir belge için hangi belgenin ebeveyn olduğunu açık bir şekilde belirlemek her zaman mümkündür.

    Az önce ne konuştuğumuzu görmek için phpMyAdmin'i açın, veritabanınızı seçin ve (PREFIX) site_content tablosunu bulun; burada (PREFIX), kurulum sırasında girdiğiniz önekinizdir. "Kimlik" - benzersiz bir tanımlayıcı, "üst" - ana belgenin numarası, "sayfa başlığı" - sayfanın başlığı ve diğerleri dahil olmak üzere belirli belge verilerini depolayan birçok alan göreceksiniz.

    Bu nedenle, MODx'te belgeleri depolama ve bağlama ilkesi hakkındaki bu bilgileri kullanarak, üst menünün bağlantılarını görüntülemek için gerekli verileri nasıl elde edeceğimizi anlayabiliriz: veritabanında kök dizininde bulunan tüm belgeleri bulmamız gerekir. site ağacı, yani "ebeveyn" alanında sıfır değerine sahip olun.

    SQL dilini kullanarak, benzer bir sorgu şu şekilde tanımlanır (bu sorguyu "modx_" ön ekinizle değiştirdikten sonra phpMyAdmin'deki SQL giriş alanına girmeyi deneyebilirsiniz):

    SEÇME *
    "modx_site_content" DAN
    NEREDE "ebeveyn" = 0;

    Bununla birlikte, böyle bir talep, ana göreve bağlı olarak, tamamen doğru olmayan site kökündeki tüm belgeleri bize kesinlikle geri getirecektir - yalnızca aşağıdakilere sahip belgelere bağlantılar görüntülemek için:

    • yayınlanmış durum (veritabanında "yayınlandı" alanı bu öğeden sorumludur; burada değer = 1, belgenin yayınlandığı ve değer = 0 - yayınlanmamış olduğu anlamına gelir).
    • silinmedi (1'in silindiği ve 0'ın silinmediği "silindi" alanı),
    • ve "Menüde göster" seçeneğinin ayarlanmış olduğu ("hidemenu" alanı, burada 1 - gizlenecek ve 0 - menüde gösterilecek).

    Ayrıca, biraz ileride, her bir bağlantının menümüzdeki konumunu belirleyecek olan "Menüdeki konum" parametresine göre belgeleri hemen sıralayacağız.

    SQL açısından bu hiç de zor bir iş değil ve şu şekilde çözüldü:

    SEÇME *
    "modx_site_content" DAN
    NEREDE "yayınlandı" = 1
    VE "üst" = 0
    VE "silindi" = 0
    VE "gizlemenü" = 0
    'menuindex' ASC'YE GÖRE SİPARİŞ;

    Teorik olarak, tüm SQL sorguları, doğrudan PHP betikleri kullanılarak, veritabanını her seferinde bağlayarak ve birçok başka rutin işlem yaparak, bunları tekrar tekrar yaparak, parçacıklarda yürütülebilir ... , ki bu kesinlikle bizim kontrol sistemimizdir MODx, diğer avantajlarının yanı sıra, hazır bir dizi program arayüzü araçları (API, Uygulama Programlama Arayüzü) sağlar. API'ler, birçok veri işleme sürecini birleştiren ve kolaylaştıran yazılım işlevleridir.

    Snippet'imizde bahsedilen "getDocumentChildren" API işlevlerinden birini kullanalım. "getDocumentChildren" işlevi, aşağıdaki verileri parametre olarak alır:

    • $ id - ana belgenin numarası,
    • $ active - yalnızca yayınlanmış veya yayınlanmamış belgeleri seçin (sırasıyla 1 veya 0),
    • $ silindi - yalnızca silinen veya silinmeyen belgeleri seçin (1 | 0),
    • $ alanları - veritabanından seçilen alanlar,
    • $ özel koşullar nerede, yani. SQL sorgusunda WHERE yan tümcesi,
    • $ sıralama - sonuçların sıralanacağı alan
    • $ yön - sıralama yönü, ASC veya DESC olabilir, yani. en düşük değerden en yüksek değere veya tam tersi sıralama
    • $ limit - istek sınırlaması, yani. SQL sorgusunda LIMIT yan tümcesi

    $ sonuçlar = $ modx-> getDocumentChildren (
    $ kimlik = 0,
    $ aktif = 1,
    $ silindi = 0,
    $ burada = "gizleme = 0",
    $ sıralama = "menüindeks",
    $ dizin = "ASC",
    $ sınırı
    );

    Yazdır ("

    Foreach ($ anahtar => $ değeri olarak $ sonuçları) (
    print_r ($ değeri);
    }

    Yazdır ("");
    ?>

    Snippet'i kaydedin ve sayfayı yenileyin. Güncellenen "TopMenu" snippet'ini yürütmenin bir sonucu olarak, "menuindex" alanının değerlerine göre en düşük değerden en yükseğe doğru sıralanmış dizilerin ve değerlerinin bir listesini göreceksiniz. $ dir = "ASC" parametresini $ dir = "DESC" olarak değiştirmeyi deneyin - sonuç olarak diziler yeniden oluşturulacak ve ilk belge "menuindex" alanının en yüksek değerine sahip belgeyi gösterecektir.

    Deneyimli programcılar için, elde edilen sonucun zaten bağlantılarla hazır bir menü oluşturmak için ihtiyacınız olan her şeyi sağladığı açıktır. Neredeyse her şey. Her durumda, devam edeceğim: İstenilen sonuca mümkün olduğunca yaklaşmak için PHP kodunu yeniden yazacağız.

    $ sonuçlar = $ modx-> getDocumentChildren (
    $ kimlik = 0,
    $ aktif = 1,
    $ silindi = 0,
    "id, pagetitle, yayınlandı, menuindex, silindi, hidemenu, menutitle",
    $ burada = "gizleme = 0",
    $ sıralama = "menüindeks",
    $ dizin = "ASC",
    $ sınırı
    );

    $ öğeler = "";
    $ çıktı = "";

    Foreach ($ anahtar => $ değeri olarak $ sonuçları) (
    $ öğeler. = "


  • ". $ değeri [" sayfa başlığı "]."
  • \ n ";
    }

    Eğer ($ öğeler! = "") (
    $ çıktı = "

      \ n ";
      $ çıktı = $ adet;
      $ çıktı. = "
    \ n ";
    }

    $ çıktısını döndür;

    Kodu ayrıntılı olarak analiz etmeyeceğiz, çünkü bu en yaygın PHP kodudur, başka bir şey değil. Birisi herhangi bir yapının anlamını anlamıyorsa, yorumlarda veya daha iyisi - ilgili destek forumlarına soruyorum.

    Yeni snippet kodunu kaydedip sayfayı yenileyelim. Kodu çalıştırmanın bir sonucu olarak, ne elde etmek istediğimizi pratik olarak göreceğiz:

    Onlar. bunlar, yapısı MODx ağacındaki belgelerin yapısını tamamen tekrarlayan, zaten otomatik olarak oluşturulmuş bağlantılardır. Bunu test etmek için sitenin kökünde bir test belgesi oluşturmayı deneyin ve sayfayı yenileyin.

    Ancak, hepsi bu değil. Birçoğu muhtemelen bağlantıların olduğunu fark etti, ancak bağlantı yok ... Paradoks :). Yani menüdeki dökümanların isimleri görüntüleniyor ama linkler çalışmıyor. Bu mantıklıdır, çünkü bağlantı kodundayken gerçek yollar yerine "#" görüntülenir.

    Bu sorunu çözmek için, MODx'in son derece kullanışlı bir başka özelliği hakkında bilgi edinmeniz gerekir: sitenin herhangi bir dahili sayfasının adresi, aşağıdaki yapı kullanılarak elde edilebilir [~ id ~], burada id, gerekli belgenin benzersiz numarasıdır, yani site ağacındaki her belgenin adının yanında parantez içinde belirtilen aynı numara. Böylece şablon / yığın / sayfa içeriğine böyle bir yapı [~ 1 ~] ekleyerek,

      • dizin - belgenin diğer adı olarak "index" girdiysek "Blog" belgesinin diğer adı veya
      • 1.html, "Blog" belgesi için "Alias" alanına hiçbir şey girmediysek
    • dost bağlantılar devre dışı bırakılırsa, o zaman index.php?id = 1 metnini göreceğiz

    Bu bilgiyi kullanarak snippet'i yeniden yazalım:

    $ sonuçlar = $ modx-> getDocumentChildren (
    $ kimlik = 0,
    $ aktif = 1,
    $ silindi = 0,
    "id, pagetitle, yayınlandı, menuindex, silindi, hidemenu, menutitle",
    $ burada = "gizleme = 0",
    $ sıralama = "menüindeks",
    $ dizin = "ASC",
    $ sınırı
    );

    $ öğeler = "";
    $ çıktı = "";

    Foreach ($ anahtar => $ değeri olarak $ sonuçları) (
    $ öğeler. = "


  • ". $ değeri [" sayfa başlığı "]."
  • \ n ";
    }

    Eğer ($ öğeler! = "") (
    $ çıktı = "

      \ n ";
      $ çıktı = $ adet;
      $ çıktı. = "
    \ n ";
    }

    $ çıktısını döndür;

    Böylece #'yi [~ ". $ Değeri [" id "]." ~] olarak değiştirdik, yani. aslında, dizideki her belge için benzersiz kimliği [~ id ~] yapısının içinde değiştirilir. Sonuç olarak, çalışan bağlantılara sahip bir menü elde ediyoruz.

    Neredeyse ideale ulaştık... Ancak, şimdi bile hala dikkate alınması gereken bir ayrıntı var: Tasarımcı, aktif bağlantının beyaz bir arka plan ile vurgulanması ve bağlantının renginin buna göre değiştirilmesi gerektiğini belirledi. turuncu.

    Bunu başarmak için MODx CMS'nin sırlarını bir kez daha açığa çıkaracağız :). API'de gizli olan, geçerli sayfanın benzersiz tanımlayıcısının değerini döndüren $ modx-> documentIdentifier işlevidir. Aktif sayfayı belirlemek ve menüden seçmek için buna ihtiyacımız olacak:

    $ sonuçlar = $ modx-> getDocumentChildren (
    $ kimlik = 0,
    $ aktif = 1,
    $ silindi = 0,
    "id, pagetitle, yayınlandı, menuindex, silindi, hidemenu, menutitle",
    $ burada = "gizleme = 0",
    $ sıralama = "menüindeks",
    $ dizin = "ASC",
    $ sınırı
    );

    $ cid = $ modx-> documentIdentifier;

    $ öğeler = "";
    $ çıktı = "";

    Foreach ($ anahtar => $ değeri olarak $ sonuçları) (
    if ($ değer ["id"] == $ cid) (
    $ aktif = "id = \" aktif \ "";
    }
    Başka (
    $ aktif = "";
    }
    $ öğeler. = "
    ". $ değeri [" sayfa başlığı "]."
    \ n ";
    }

    Eğer ($ öğeler! = "") (
    $ çıktı = "

      \ n ";
      $ çıktı = $ adet;
      $ çıktı. = "
    \ n ";
    }

    $ çıktısını döndür;

    Peki, nasıl çalıştı? Olmuş!

    Ama her şeyin bittiğini düşünmedin, değil mi? Ve haklı olarak. Kendimize en yüksek çıtayı koyduk, MODx'in maksimum yeteneklerini kullanmak istiyoruz. Dolayısıyla gözden kaçırdığımız bir küçük detay daha var.

    GetDocumentChildren fonksiyonunu kullanarak talep ettiğimiz alanların adlarına daha yakından bakalım: "id, pagetitle,Published, menuindex, delete, hidemenu,menutitle". Bunların arasında "menutitle" gibi bir alan var. Adından da anlaşılacağı gibi, bu alan depolayabilir menü başlığı... Kontrol sistemi ayrıca bir "Menü öğesi" giriş alanına sahiptir. Bu alan isteğe bağlıdır. Ancak mantık şu ki, bu alan doldurulursa, menüdeki bağlantı metnini kullanıcı tarafından girilen metinle değiştirmeliyiz. Peki, şöyle yapalım:

    /********************************
    Başlık: ÜstMenü
    Amaç: Üst menüyü görüntüle
    Proje: Demosite MODx
    ********************************/

    $ sonuçlar = $ modx-> getDocumentChildren (
    $ id = 0, // ana belge kimliği
    $ aktif = 1, // Yalnızca yayınlanmış belgeleri seçin
    $ silinmiş = 0, // Yalnızca silinmemiş belgeleri seçin
    "id, sayfa başlığı, yayınlandı, menuindex, silindi, hidemenu, menutitle", // Veritabanından alanları seçin
    $ burada = "hidemenu = 0", // Yalnızca menüde yayınlanması gereken belgeleri seçin
    $ sort = "menuindex", // Belgeleri menuindex alanına göre sırala
    $ dir = "ASC", // Belgeleri artan düzende sırala
    $ limit = "" // Herhangi bir kısıtlama koymuyoruz (SQL sorgusunda LIMIT parametresi)
    );

    $ cid = $ modx-> documentIdentifier; // geçerli sayfanın kimliğini al

    $ öğeler = "";
    $ çıktı = "";

    Foreach ($ anahtar => $ değeri olarak $ sonuçları) (
    if ($ değer ["id"] == $ cid) (
    $ aktif = "id = \" aktif \ "";
    }
    Başka (
    $ aktif = "";
    }
    if ($ value ["menutitle"]! = "") (
    $ başlık = $ değer ["menutitle"];
    }
    Başka (
    $ başlık = $ değer ["sayfa başlığı"];
    }
    $ öğeler. = "
    ".$ başlığı."
    \ n "; // menü öğelerini topla
    }

    // En az bir menü öğesi bulunursa,
    // menü için HTML kodunu oluştur
    if ($ öğeler! = "") (
    $ çıktı = "

      \ n ";
      $ çıktı = $ adet;
      $ çıktı. = "
    \ n ";
    }

    // Snippet'in sonucunu döndür
    $ çıktısını döndür;

    Şimdi herhangi bir belgenin "Menü öğesi" giriş alanına bir metin girmeye çalışın ... Her şey çalışıyor mu? Müthiş!

    Not: Belki bazı okuyucular, menümüzdeki bağlantılara tıkladığınızda sayfaların içeriğinin değişmemesine şaşıracak, ancak görünen o ki, tarayıcı adresindeki yola bakılırsa, yeni sayfalara geçiyoruz .. İnan bana, bu kesinlikle normal çünkü kesinlikle tüm sayfalar şu anda aynı şablonu kullanıyor. Bu şablonda aslında şimdiye kadar sadece üst menüyü dinamik hale getirdik, diğer tüm detaylar değişmedi. Bununla kesinlikle daha sonra ilgileneceğiz, ama şimdilik - panik yapmayın;).

    Çözüm:

    Böylece, bir makale daha mantıklı sonucuna ulaştı.

    Öğrenme Çıktıları:

    • MODx belgeleri için bazı girdi alanlarının amacını anlamaya çalıştık ve bu bilgilerin veri tabanında saklanmasını inceledik;
    • Yeni özel MODx yapıları hakkında bilgi edinin: [], [! SnippetName!], [~ Id ~];
    • Özel bir API'nin kullanılabilirliği hakkında bilgi aldı ve bazı API işlevlerini kullandı;
    • Ve bu bilgiye dayanarak MODx'te yeni snippet'imizi oluşturduk!

    Hazır bir web sitesi gönderirken, web yöneticisinin kartvizitleri, projenin teslim edilmesinden sonra müşterinin onları önemsememesi için tüm süreçleri mümkün olduğunca otomatikleştirmeye çalışıyor. En yaygın sorunlardan biri, tam olarak yeni menü öğelerinin oluşturulması ve düzenlenmesi ile ilgilidir.

    Bu nedenle, bir web yöneticisinin ana görevlerinden biri, menü yapısını düzenlemeye yönelik tüm eylemlerin yönetim panelinden gerçekleştirilebilmesi için dinamik bir menü oluşturmaktır.

    Bu, özel MODx araçları - snippet'ler kullanılarak yapılabilir.

    snippet MODx şablonunda çalışan ve CMS veritabanındaki bilgileri görüntülemenizi sağlayan php kodudur.

    Snippet'ler iki türe ayrılır:

    • önbelleğe alınmış;
    • önbelleğe alınamaz.

    Onların farkı çağrı tasarımındadır. Bu nedenle, örneğin, "SNIPNAME" adında bir parçacığımız varsa, o zaman önbelleğe alınmamış bir çağrı ile yapı şöyle görünecektir:

    [! SNIPNAME!]

    Önbelleğe alınmış bir sürümle şöyle görünecektir:

    []

    Burada şu soru ortaya çıkabilir, snippet'i neden önbelleğe alınabilir hale getirelim? Gerçek şu ki, önbelleği kullanırken yapı kaydedilir ve veritabanına sürekli erişim yoktur, bu da sayfa yükleme hızını artırır ve sunucudaki yükü azaltır. Ancak çoğu zaman, önbelleğe girdikten sonra, web yöneticisinin bazı eylemler gerçekleştirdiği, ancak sitede görüntülenmediği gerçeğiyle yüzleşebilirsiniz, bunları görüntülemek için önce eski önbelleği temizlemeniz gerekir. Bu konudan biraz sonra bahsedeceğim. Önbelleğe alınmamış menü seçeneğini kullanacağız.

    Snippet'lerin ikinci önemli özelliği: Ekstra seçenekler, bu yapı çağrılırken doğrudan ayarlanabilir. Diyagram şöyle görünür:

    [! SnippetAdı? & parametre1 = `parametre değeri` & parametre2 =`parametre değeri`!]

    İmza "?" - sisteme, snippet'e uygulanması gereken parametreler tarafından takip edildiğine dair bir sinyal verir. Ve snippet'lerin kendileri "&" işaretiyle ayrılır ve değerler arka tırnak içine alınır. Yanlış alıntılar koyarsanız, hiçbir şey işe yaramaz.

    Menü yapısının dinamik görüntüsünü nasıl özelleştiriyorsunuz?

    Menüyü MODx'te görüntülemek için bir snippet kullanacağız:

    [! Yol Bulucu!]

    Bunu "saf haliyle" kullanamayacağız, çünkü bunun için gömülü materyallerin bulunması gerekiyor ve sadece ana sayfada gösterilecek. Saymaya değer olduğu makalenin kimliğini belirtmek doğru olacaktır. Bu yöntem ile bunun için id kullanarak birçok farklı menü oluşturabiliyoruz. Uygulamada, daha açık olacaktır.

    Şu andan itibaren, Ana nokta, id = 1 değerine sahip "Ana"dır. O zaman yapı şöyle görünmelidir:

    Bu yapı ile alt öğelerden menüyü getirebilirsiniz. Bunu uygulamaya koyalım.

    "Öğeler" - "Öğeleri yönet" - "Yığınlar" sekmesine gidiyoruz. "HEADER" öbeğini seçiyoruz ve içinde menüyü görüntülemekten sorumlu kodu buluyoruz.

    EV

    • ev
    • Hakkımızda
    • Hizmetler
    • projeler
    • çözümler
    • Meslekler
    • Blog
    • kişiler

    Bu kod yerine yukarıdaki pasajı ekleyelim:

    [! Yol Bulucu? & startId = "1"!]

    Gördüğünüz gibi menü bağlı, adres çubuğunda url değişiyor, şablon aynı kalsa da sonraki derslerde düzelteceğiz.

    Ama iki sorun var:

    1.) Etkin menü öğesi vurgulanmaz.

    2.) "Ev" menü öğesi yoktur.

    Bu eksiklikleri giderelim.

    Aktif menü öğesini bağlarız

    Varsayılan olarak, Wayfinder snippet'i "active" sınıfıyla aktif menü öğesini oluşturur. Yani ek bir betik eklemek zorunda değiliz, sadece css dosyasındaki sınıfı değiştirin. Bunu yapmak için, şablonumuzu içeren klasöre gidin - /assets/templates/retina/css/style.css. Lütfen şablon klasörünün klasör adının sizin için farklı olabileceğini unutmayın, bunların tümü ilk derslerde girdiğiniz isme bağlıdır. Bu dosyayı açın ve etkin menü öğesi için stilleri olan bir satır arayın. Bu satıra sahibim - 190 ve işte kodun kendisi:

    #navigation a.nav-btn (kenar boşluğu: 15 piksel; metin süslemesi: yok; dolgu: 0 36 piksel 0 10 piksel; satır yüksekliği: 30 piksel; ekran: blok; arka plan: url (resimler / navigasyon.png) tekrar-x 0 0; yükseklik: 30 piksel; konum: göreli;)

    ".nav-btn" sınıfını "active" ile değiştirin.

    "Ev" i bağlarız

    Ve böylece, anladığınız gibi, yan öğeleri "Ev" menü öğesinden kaldırdık. Bu öğenin kendisini çekmek için tüm menümüzün aynı yuvalama seviyesinde olmasına ihtiyacımız var.

    İlk olarak, kök klasöre erişimin açık olup olmadığını kontrol ediyoruz. Bunu yapmak için "Araçlar" - "Yapılandırma" - "Kullanıcılar" sekmesine gidin. İçinde parametreyi buluyoruz - " Kök klasöre erişime izin ver"Ve değeri" Evet "olarak ayarlayın.

    Bundan sonra, öğeyi seçin, "Hizmetler" diyelim, düzenlemek için sayfaya gidin ve ekran görüntüsünde gösterildiği gibi aşağıdaki simgeye tıklayın.

    Tıkladıktan sonra malzemelerin sol sütununda ana menü öğesini seçmeniz gerekiyor, at klasörünü seçiyoruz. Aşağıdaki ekran görüntüsüne bakın.

    Üzerine tıklayın ve makalemizi kaydedin. Malzemenin kendisi "Ana" ile bir seviye hareket etmelidir.

    Bu işlem tüm alt paragraflar ile yapılmalıdır. Aşağıdaki yapıya sahip olmalısınız.

    Sitenizin sayfasını şimdi yenilerseniz menünüz kaybolacaktır. Bunun nedeni, üst kategori kimliğinin değişmiş olmasıdır. İnce ayar yapalım. Bunu yapmak için "Öğeler" - "Öğeleri yönet" - "Yığınlar" sekmesine gidin. "HEADER" öbeğini seçin ve içindeki kodu bulun:

    [! Yol Bulucu? & startId = "1"!]

    Ve şu şekilde değiştirin:

    İşte bu, menü tamamen hazır ve şablonla eşleşiyor.

    Fark ettiyseniz, altbilgide, az önce oluşturduğumuz seçeneğin öğelerini tam olarak tekrarlayan bir menümüz olduğunu şablondan görebilirsiniz. Bu nedenle, bu bloğu da derhal düzeltmeyi öneriyorum. Bunu yapmak için, "Öğeler" - "Öğeleri yönet" - "Yığınlar" sekmesine gidin, "FOOTER" öbeğini seçin. İçinde alt menüyü görüntülemekten sorumlu kodu buluyoruz ve bunun yerine zaten bilinen yapıyı ekliyoruz.

    [! Yol Bulucu? & startId = "0"!]

    İşte almanız gerekenler.

    Hepsi bugün için. Herhangi bir sorunuz varsa, yorumlara yazın, cevaplamaya çalışacağım. Sonraki derslere kadar.

    Selamlar sevgili okuyucular. Son derste siteyi biraz içerikle () doldurduk, şimdi sıra her şeyi menüye getir Böylece kullanıcılar bunlara gidebilir.

    Dinamik oluştur MODX'teki menü bir snippet kullanacağız PdoMenu paketten pdoAraçlar... Başlamadan önce temel belgelere göz atın.

    PdoMenu Belgeleri

    Seçenekler

    Şablon parametreleri

    CSS sınıfı parametreleri

    Resmi örnekler


    resmi belgeleri buradan okuyabilirsiniz. Şimdi en tipik menü çağrılarına bir göz atalım.

    PdoMenu'yu Çağırma

    seçenek 1... Bu statik menünün yerine pdoMenu snippet'ini çağırın, bunun için kaynak ağacında, sekmede “ Elementler”Snippet'ler bölümünde dalı genişletin pdoAraçlar, ardından üzerine tıklayın pdoMenü sol tıklayın (düğmeyi bırakmayın) ve bu parçacığı menüyü çağırmak istediğiniz yere sürükleyin, ardından açılan pencerede gerekli parametreleri doldurun ve tıklayın " Kaydetmek«.

    seçenek 2... Sadece aramayı manuel olarak yazıyoruz.

    Tipik örnekler

    Normal tek seviyeli menü

    Örneğin, aşağıdaki html işaretlemesi ile en yaygın menüye sahibiz.

    Bir menü çağrısı ile aşağıdaki kodu aldık:

    • & ebeveynler = `0` - ebeveyn listesi (benim durumumda, seçimi sınırlandırmıyorum çünkü yine de sadece belirli sayfaları görüntüleyeceğim);
    • & seviye = `1` - yuvalama seviyesi (bu durumda değildir);
    • & kaynaklar = '2,3,4,5' - menüde görüntülenecek kaynakların listesi;
    • & firstClass = `0` - ilk menü öğesinin sınıfı (hiçbiri değil);
    • & lastClass = `0` - son menü öğesinin sınıfı (hiçbiri değil);
    • & dışSınıf = 'top-menu' - menü sarmalayıcının sınıfı (ul ile değiştirilir);
    • & buradaSınıf = "geçerli menü öğesi" - etkin menü öğesi için sınıf (li ile değiştirilir);
    • & rowClass = "menu-item" - bir menü satırının sınıfı (li ile değiştirilir).

    İki seviyeli özel önyükleme menüsü

    Statik html kodu şöyle görünür:

    Çıktı kodu şöyle olacaktır:

    Ayrıca, bir sonraki derste, önyüklemeye dayalı birkaç açılır menü sonucu daha vereceğim (ve bu, konuyu anlamamış olanlar için. Peki, o zaman yapacağız.

    İlk bakışta, her şey karmaşık görünüyor, ancak öyle değil, belgeleri daha ayrıntılı olarak okuyun, yorumlarda sorular sorun, kesinlikle yardımcı olacağım.