Ana Sayfa ve Pazarlama Bölümleri
Vertex, B2B ve endüstriyel tedarik mağazaları için tasarlanmış 30+ ana sayfa hazır bölüm sunar: hero rotatörler, editöryel çok sütunlu düzenler, güven işaretleri, KPI çubukları, otomatik yayılan JSON-LD ile SSS akordeonları, dönüşüm bannerları ve bir bantta iki ilgili fikri birleştiren 50/50 birleştirilmiş bölümler (markalar + hızlı sipariş, kaynaklar + SSS).
Buradaki her bölüm bağımsız bir OS 2.0 bölümüdür. Onları özelleştiricide istediğiniz sıraya sürükleyin. Onları ana sayfada kullanmak zorunda da değilsiniz — page.about.json, page.services.json veya herhangi bir özel sayfa şablonuna bırakın.
Hero ve açılış bölümleri
hero
Bölüm dosyası: sections/hero.liquid
Otomatik ilerleme, nokta gezinmesi ve editöryel kompozisyon (üst başlık + başlık + alt başlık + ikili CTA'lar) ile çok slaytlı rotatör. En hızlı LCP için bir slayt olarak varsayılan — ek slaytlar aşamalı geliştirmedir.
Slayt başına blok ayarları: görüntü (<picture><source> aracılığıyla mobil duyarlı genişlik seçimi ile), üst başlık metni, başlık, alt başlık, birincil CTA etiketi + URL, ikincil CTA etiketi + URL, hizalama (sol / merkez).
Bölüm ayarları: otomatik ilerleme aralığı (saniye), noktaları göster anahtarı, renk şeması.
Lighthouse Performansı bir öncelikse ana sayfayı tek bir hero slaytında tutun. Her ek slayt başlangıç yüküne hero boyutunda bir görüntü ekler. Bu nedenle varsayılan 1 slayt ile gelir.
featured-collection
Bölüm dosyası: sections/featured-collection.liquid
Koleksiyon seçicisinden çeken ürün ızgarası. Theme Store uyumluluğu için @app bloklarını kabul eder.
Ayarlar: koleksiyon seçici, başlık, satır başına ürünler (2 / 3 / 4 / 5), mobilde sütunlar (1 / 2), Tümünü görüntüle bağlantısını göster, renk şeması.
collection-list
Bölüm dosyası: sections/collection-list.liquid
Her döşemenin üzerinde merkezlenmiş başlıklar ve görüntü kaplamalı kategori ızgarası. Yapılandırılabilir sütunlar ve en boy oranı.
Editöryel bloklar
image-with-text
Bölüm dosyası: sections/image-with-text.liquid
Klasik 50/50 veya asimetrik görüntü + metin eşleştirmesi. Hakkımızda, Sürecimiz, Neden biz için faydalıdır.
Ayarlar: görüntü, başlık, gövde (zengin metin), CTA etiketi + URL, düzen (image-left / image-right), renk şeması.
multicolumn
Bölüm dosyası: sections/multicolumn.liquid
2, 3 veya 4 sütunlu ızgara. Her sütunun bir simgesi (veya görüntüsü), başlığı, gövdesi ve isteğe bağlı bağlantısı vardır. Değer önermeleri için kullanın (Aynı gün sevkiyat · NET-30 · Hacim fiyatlandırması · ISO 9001 sertifikalı).
Sütun başına blok ayarları: simge (görüntü), başlık, gövde, bağlantı etiketi + URL.
rich-text
Bölüm dosyası: sections/rich-text.liquid
Merkezlenmiş giriş veya hakkında bloğu. Başlık + zengin metin gövdesi + isteğe bağlı CTA. Tutumlu kullanın — bu "sayfa molası" bloğudur.
timeline
Bölüm dosyası: sections/timeline.liquid
Bir Hakkında sayfası için yıl + dönüm noktası kronolojisi. Blok başına: yıl, başlık, gövde.
Güven ve sosyal kanıt
testimonials
Bölüm dosyası: sections/testimonials.liquid
Avatar üst üste binme başlığı işlemesi ile derecelendirilmiş kartlar. Her kartın bir derecesi (1–5 yıldız), alıntısı, müşteri adı, rolü, şirketi ve avatar görüntüsü vardır.
Blok başına ayarlar: ad, rol, şirket, alıntı (zengin metin), derece (1–5), avatar (görüntü).
logo-list
Bölüm dosyası: sections/logo-list.liquid
Solma ızgara çizgileri ile marquee-kaydırma marka logoları. Güvenenler / Yer alındığı yer / Taşıdığımız markalar için kullanın.
Blok başına ayarlar: logo görüntüsü, isteğe bağlı URL. Bölüm seviyesi: kaydırma hızı, ızgara çizgilerini göster.
press-coverage
Bölüm dosyası: sections/press-coverage.liquid
Logo şeridi + alıntılar. Basın logolarını kısa atfedilmiş alıntılarla birleştirir — "...WordPress'in McMaster-Carr'ı." — Trade Weekly.
stats-bar
Bölüm dosyası: sections/stats-bar.liquid
Koyu mod KPI bandı. Başlık sayıları için kullanın — 40.000+ SKU · NET-30 · 24 saatlik Sevkiyat · ISO 9001.
Blok başına ayarlar: sayı (büyük metin), etiket (küçük metin).
"40.000+ SKU", "40.127 SKU"dan daha güçlü okunur ve envanter her değiştiğinde bölümü güncellemeyi gerektirmez. Sipariş hacmi için de aynısı.
Dönüşüm ve CTA
cta-banner
Bölüm dosyası: sections/cta-banner.liquid
Alt bilgiye taşma efekti ile alt bilgi öncesi eylem çağrısı — bant editöryel cila için alt bilgiye görsel olarak kırılır.
Ayarlar: başlık, alt başlık, birincil CTA, ikincil CTA, görüntü (isteğe bağlı), B2B müşterileri için gizle anahtarı.
B2B müşterileri için gizle anahtarı küçük ama kritik bir ayrıntıdır. CTA "Bayi olun" veya "Teklif talep edin" diyorsa, zaten oturum açmış bir bayi olan bir alıcıya bunu göstermek istemezsiniz. Bunu çevirin ve customer.b2b? true olduğunda bölüm kaybolur.
newsletter
Bölüm dosyası: sections/newsletter.liquid
Abone ol düğmesi ile e-posta katılımı. Shopify'ın yerel müşteri-bülten formunu kullanır — aboneler newsletter bayrağı ile Shopify müşteri listenize iner.
industries-grid
Bölüm dosyası: sections/industries-grid.liquid
Hizmet verdiğiniz dikey sektörleri sergilemek için editöryel kart ızgarası — HVAC · Üretim · Tesisler · Denizcilik · Havacılık.
Blok başına ayarlar: görüntü, başlık, bağlantı.
resource-hub
Bölüm dosyası: sections/resource-hub.liquid
Veri sayfaları, MSDS, broşürler, sertifikalar için indirmeler listesi. Her giriş bir dosya bağlantısıdır.
Blok başına ayarlar: başlık, dosya (PDF), açıklama, isteğe bağlı simge.
services-grid
Bölüm dosyası: sections/services-grid.liquid
Hizmet teklifleri için görüntü kaplamalı döşemeler — Boyuta göre kesme · Özel paketleme · Yerinde danışmanlık · Envanter yönetimi.
SSS
faq
Bölüm dosyası: sections/faq.liquid
Açıklama tabanlı akordeon (tam klavye + ekran okuyucu desteği için yerel <details> / <summary> üzerinde inşa edilmiştir). Google zengin snippet'leri için FAQPage JSON-LD'yi otomatik olarak yayar.
Blok başına ayarlar: soru (metin), cevap (zengin metin).
Bölüm, JSON-LD grafiğini otomatik olarak yayar — koda dokunmadan Google arama sonuçlarında SSS zengin snippet'leri alacaksınız. Google'ın içerik yönergeleri uygulandığı için soruların alıcıların sorduğu gerçek sorular olduğundan emin olun (pazarlama metni değil).
İkili amaçlı birleştirilmiş bölümler
Bazı bölümler iki fikri bir bantta birleştirir, dikey alandan tasarruf eder ve editöryel ritim oluşturur.
dual-brands-quickorder
Bölüm dosyası: sections/dual-brands-quickorder.liquid
50/50 birleştirilmiş: bir tarafta marka logosu ızgarası, diğer tarafta hızlı sipariş yapıştır-sepete pad'i. Güven işaretleri VE bir dönüşüm yolunu aynı bantta yüzeye çıkarmak istediğiniz B2B ana sayfaları için harika.
dual-resources-faq
Bölüm dosyası: sections/dual-resources-faq.liquid
50/50 birleştirilmiş: bir tarafta kaynak indirmeleri (veri sayfaları, broşürler), diğer tarafta SSS akordeonu. Destek ağırlıklı endüstriler için yaygın eşleştirme.
Bölüm sıralama önerileri
Bir MRO / endüstriyel tedarik ana sayfası için önerilen sıra:
- Hero — değer önermesi + birincil CTA (katalog vs. RFQ)
- İstatistik çubuğu — anlık güvenilirlik işaretleri
- Öne çıkan koleksiyon — en çok satanlar veya huninin tepesindeki kategori
- Çok sütunlu — 3 sütunda Neden biz
- Endüstriler ızgarası — hizmet verdiğiniz dikey sektörler
- Logo listesi — taşıdığınız markalar
- İkili markalar + hızlı sipariş — ticari liste CTA'sı ile eşleştirin
- Referanslar — derecelendirmeli alıcı alıntıları
- Kaynak merkezi — indirmeler
- SSS — en üst itirazlar
- CTA banner — Teklif talep edin (oturum açmış B2B için gizli)
- Bülten — ticari liste kaydı
Sırada ne var
- Ürün sayfası bölümleri → — Ana ürün, sekmeler, ilgili ürünler, son görüntülenenler, yapışkan sepet
- Yalnızca B2B bölümleri → — B2B özellik tanıtımı, toplu sipariş, RFQ, karşılaştırma
- Satış artırma bölümleri → — Tanıtım banner, geri sayım, paketler, stok sayacı
- Bulucu bölümleri → — Marka/Model/Yıl, Marka/Kategori/Kapasite, Yazıcı bulucuları
- Tema ayarları referansı → — Renk şemaları, tipografi, düzen ayarları