Sayfa şablonları

Bir sayfa, temanın bölümlerinden kurulur. Hangi bölümlerin hangi sırayla ve hangi ayarlarla çizileceğini sablonlar/<ad>.json dosyası söyler. Tema her sayfa türü için varsayılan şablonu getirir; satıcı düzenleyicide değiştirdiğinde mağazaya kendi kopyası kaydedilir, temanın dosyası değişmez.

{
  "bolumler": {
    "giris": {
      "tur": "giris",
      "ayarlar": { "layout": "overlay", "interval": 6 },
      "bloklar": {
        "slayt-1": { "tur": "slide", "ayarlar": { "title": "Yeni sezon", "subtitle": "Yüzde 20 indirim" } },
        "slayt-2": { "tur": "slide", "ayarlar": { "title": "Ücretsiz kargo" } }
      },
      "blok_sira": ["slayt-1", "slayt-2"]
    },
    "yeni-urunler": { "tur": "urun-seridi", "ayarlar": { "heading": "Yeni gelenler", "per_view": 4 } }
  },
  "sira": ["giris", "yeni-urunler"]
}

Sayfada bölümler arasında sarmalayıcı yoktur: her bölüm yalnız kendi kutusunda çizilir (<div class="mk-tema" data-mk-tema="<tür>" id="mk-tema-<kimlik>">).

Sayfa türleriBağlantıyı kopyala

Dosyanın adı sayfa türüdür.

Hesap ve ödeme sayfaları platformundur, şablonla değişmez. Ödeme ve sepet mantığı her zaman platformda kalır; tema düzeni kurar, satırları ve özeti adalarla yerleştirir:

{%- if sepet.bos -%}
  <p {{ section | duzenle: 'bos_metin' }}>{{ section.settings.bos_metin }}</p>
{%- else -%}
  <div class="sepet">
    <div>{% ada 'sepet-giris' %}{% endada %}{% ada 'sepet-urunleri' %}{% endada %}</div>
    <aside>{% ada 'sepet-ozeti' %}{% endada %}</aside>
  </div>
{%- endif -%}

Arama şablonunda arama nesnesi: terim, sayi (bulunan ürün), kategoriler, koleksiyonlar, sayfalar (eşleşen bağlantılar, { title, url }), populer ({ terim, url }). Sonuçlar liste sayfasıyla aynı collection nesnesidir; liste bölümlerin arama sayfasında da çalışır.

Bölüm gruplarıBağlantıyı kopyala

Üst kısım (header) ve alt kısım (footer) her sayfada aynıdır; şablon gibi yazılır ama gruplar/ altındadır: gruplar/ust.json, gruplar/alt.json. Sayfa, üst grup + sayfanın şablonu + alt grup olarak çizilir. Tema grup getirmezse platformun header ve footer'ı kullanılır.

Üst kısımda arama, sepet, hesap, dil ve para birimi adaları çalışır. Alt kısımda alt_sayfalar satıcının "Footer'da göster" dediği sayfalardır ({ title, url }); mesafeli satış ve diğer yasal bağlantılar şeridi her zaman platformun, temanın altına eklenir.

Bir bölüm yalnız belli yerlerde anlamlıysa şemasında söyle; düzenleyici onu başka yere eklettirmez, yükleme de reddeder:

{ "name": "Üst menü", "enabled_on": { "groups": ["ust"] } }

İkisi de yoksa bölüm her şablona ve her gruba konabilir.

Özel şablonlarBağlantıyı kopyala

Aynı türün ikinci bir düzeni: urun.hediye.json, liste.kampanya.json, sayfa.genis.json. Satıcı ürün, kategori ya da sayfa ayarlarındaki Şablon seçicisinden birini atar; atanmamış kayıt türün şablonunu kullanır. Atanan şablon temada yoksa (tema değişti) sayfa türün şablonuyla çizilir. Ek: küçük harf, rakam ve -, en çok 40 karakter.

Bölüm çizim ucuBağlantıyı kopyala

Sayfayı yenilemeden bir bölümü yeniden çizdirmek için (filtre, sekme, sepet sonrası güncelleme):

const r = await fetch(`/api/tema/bolumler?yol=${encodeURIComponent(location.pathname)}&kimlik=one-cikanlar`)
const { bolumler } = await r.json()
if (bolumler['one-cikanlar']) {
  const kutu = document.getElementById('mk-tema-one-cikanlar')
  kutu.innerHTML = new DOMParser().parseFromString(bolumler['one-cikanlar'], 'text/html').body.firstElementChild.innerHTML
}

kimlik virgülle en çok 25 bölüm; yanıtta her biri bölümün kutusuyla HTML (null: o sayfada yok). Bölüm sayfanın bağlamıyla çizilir (ürün sayfasında ürün). Bugün ana sayfa, ürün, içerik sayfası ve üst / alt grup desteklenir. Düzenleyici de ayarı değişen bölümü bu uçla yeniler; bölüm yeniden çizilince tema JS'ine mk:bolum:yuklendi olayı gelir (düzenleyici sözleşmesi).

SınırlarBağlantıyı kopyala

Yüklemede her şablon denetlenir: ad bir sayfa türü olmalı, tur değerleri pakette bulunan bölümler ve o bölümün şemasındaki bloklar olmalı, max_blocks ve blok limit aşılmamalı. Hatalar dosya adıyla döner.