?view= parametresi: herhangi bir alternatif şablonu açın
Ürün, koleksiyon ya da sayfayı adresine ?view=sonek ekleyerek alternatif şablonla açın; önizleme, hızlı bakış ve kampanya sayfaları için.
- Biçim
- ?view=<şablon soneki>
- Dosya
- <tür>.<sonek>.json veya .liquid
- Çalıştığı yer
- Ürünler, koleksiyonlar, sayfalar, bloglar, yazılar
- Plan
- Her plan
- Son kontrol
Kısaca
Bir vitrin adresine ?view=<sonek> eklediğinizde Shopify sayfayı aynı adı taşıyan alternatif şablonla açar; örneğin /products/example-product?view=quick-view, templates/product.quick-view.liquid dosyasını kullanır. Şablonu ürüne atamanız gerekmez. Böylece yeni bir düzeni önizleyebilir ya da hızlı bakış penceresi için sadeleştirilmiş bir HTML parçası çekebilirsiniz.
Nasıl kullanılır
- Alternatif şablonu tema editöründe (Create template) ya da kodda templates/product.<sonek>.json veya .liquid olarak oluşturun.
- Sayfayı sonuna ?view=<sonek> ekleyerek açın; o şablonla nasıl göründüğünü görürsünüz.
- Bir HTML parçası (hızlı bakış, AJAX sekmesi) için {%- layout none -%} ile başlayan bir .liquid alternatif şablon kullanın; header ve footer dışarıda kalır.
- Ortak snippet’ler bu şablonda farklı davranacaksa template.suffix değerine bakın.
Kod
product.quick-view.liquid{%- comment -%}
templates/product.quick-view.liquid
Fetched with /products/<handle>?view=quick-view to fill a quick-view modal.
layout none drops the header, footer and scripts, so the response is only
this fragment.
{%- endcomment -%}
{%- layout none -%}
{%- assign variant = product.selected_or_first_available_variant -%}
<div class="quick-view" data-product-id="{{ product.id }}">
<h2>{{ product.title }}</h2>
<p>{{ variant.price | money }}</p>
{% form 'product', product %}
<input type="hidden" name="id" value="{{ variant.id }}">
<button type="submit" {% unless variant.available %}disabled{% endunless %}>Add to cart</button>
{% endform %}
</div>
template-suffix-check.liquid{%- comment -%}
template.suffix is the alternate name in use, or nil on the default
template. Use it to switch small things in shared sections.
{%- endcomment -%}
{%- if template.suffix == 'landing' -%}
{%- assign show_breadcrumbs = false -%}
{%- else -%}
{%- assign show_breadcrumbs = true -%}
{%- endif -%}
urls.txt# templates/product.quick-view.liquid -> suffix "quick-view"
https://your-store.com/products/example-product?view=quick-view
# templates/collection.landing.json -> suffix "landing"
https://your-store.com/collections/summer?view=landing
# The same works on pages, blogs and blog posts
https://your-store.com/pages/about?view=press
# File name pattern
<template-name>.<template-suffix>.<json|liquid>
Lintel tarafından yazıldı. MIT lisansı: kendi mağazanızda da müşteri işlerinizde de ücretsiz kullanabilirsiniz.
Sınırlar ve özel durumlar
- Her ?view= adresi aynı içerik için yeni bir URL demektir. Menülerden ve site haritasından link vermeyin; temanızın {{ canonical_url }} değerini canonical etiketinde yazdığını kontrol edin.
- Alternatif şablonun, görüntülediğiniz temada bulunması gerekir; kullandığınız her tema kopyasında oluşturun.
- Varsayılan şablonun yerine alternatif bir şablon koyamazsınız; ?view= yalnızca o istek için değiştirir.
- Bir ürün için kalıcı değişiklik istiyorsanız şablonu yönetim panelinden (Theme template) atayın.
Sık sorulan sorular
- Shopify adresindeki ?view= ne işe yarar?
- Sayfayı, soneki eşleşen alternatif şablonla açar; örneğin ?view=quick-view için product.quick-view.liquid.
- Alternatif şablonu atamadan önizleyebilir miyim?
- Evet. Ürünü ya da sayfayı ?view=<sonek> ile açın veya tema editöründeki açılır menüden şablonu seçip önizlemek için bir ürün belirleyin.
- ?view= SEO’ya zarar verir mi?
- Navigasyon ve site haritasının dışında tutarsanız hayır. Aynı içerik için ek bir URL oluşturur; canonical etiketi normal adresi göstermelidir.
- Bir modal için yalnızca HTML nasıl alınır?
- {%- layout none -%} ile başlayan bir .liquid alternatif şablon yapın ve /products/<handle>?view=<sonek> adresini çekin. Diğer seçenek Section Rendering API.
Shopify belgeleri
- Gösterilen tarihte bir Shopify mağazasında denendi. Shopify yönetim panelini sık değiştirir; bir adım farklı görünüyorsa fikir genellikle hâlâ geçerlidir.
- Örneklerde yer tutucu ID’ler ve your-store.myshopify.com kullanılır. Kendi değerlerinizle değiştirin.
- Kod parçaları MIT lisanslıdır.
Mağazanız için kurulmasını, test edilmesini ve bakımını isterseniz: Shopify geliştirme.
