Sepete ekle düğmelerini gizleme
Sepete ekle düğmelerinizi vitrininde gizleyebilirsiniz ve bunları gelecekte tekrar gösterebilirsiniz.
Bölümlere ayrılmış ve ayrılmamış temalar
Not: Bu eğitimin adımları bölümlere ayrılmış tema bir tema mı yoksa bölümlere ayrılmamış bir tema mı kullandığınıza bağlı olarak değişiklik gösterir. Bölümlere ayrılmış temada, ana sayfanızın düzenini değiştirmeniz için öğeleri sürükleyip bırakabilirsiniz. Bu işlemi bölümlere ayrılmamış temada yapamazsınız.
Temanızın, bölümleri destekleyip desteklemediğini öğrenmek için temanızın Kodu düzenle sayfasına gidin. Bölümler dizininde dosyalar varsa bu, bölümlendirilmiş bir tema kullandığınız anlamına gelir. Bölümlendirilmemiş temalar Ekim 2016'dan önce kullanıma sunulmuştur ve Bölümler dizininde bu temaların dosyaları yoktur.
Bölümlendirilmiş bir tema kullanıyorsanız Sectioned themes (Bölümlendirilmiş temalar) düğmesine tıklayın ve talimatları izleyin. Daha eski ve bölümlendirilmemiş bir tema kullanıyorsanız Non-sectioned themes (Bölümlendirilmemiş temalar) düğmesine tıklayın ve talimatları izleyin.
- Shopify yöneticinizde Online Mağaza > Temalar'a gidin.
- Düzenlemek istediğiniz temayı bulun, işlemler menüsünü açmak için … düğmesine, ardından Kodu düzenle'ye tıklayın.
-
Bölümler dizininde
product-template.liquid
dosyanıza tıklayın. Sepete ekle düğmesinin HTML kodunu bulun. Başlangıç için sepet kelimesini aratabilirsiniz.
Sepete ekle düğmesinin kodu temaya göre değişiklik gösterir. Add to cart
, AddToCart
veya add-to-cart
metinlerine sahip <input>
veya <button>
etiketlerini bulun.
Debut temasında, sepete ekle düğmesi kodu aşağıdaki gibi gözükmektedir:
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
- Bulduktan sonra, kodu Liquid'de
{% comment %}
ve{% endcomment %}
etiketleri arasına alın. Bu, kodun mağazanızda gösterilmesini engeller fakat şablon değiştirmek istediğiniz zaman kolayca geri koymanızı sağlar.
Yukarıdaki örnek kullanıldığında yeni kod aşağıdaki gibi olur:
{% comment %}
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
{% endcomment %}
- Değişikliklerinizi onaylamak için Kaydet'e tıklayın.
Sepete ekle düğmelerinizi tekrar göstermeye hazır olduğunuzda HTML/CSS'i düzenle sayfasındaki product-template.liquid
dosyanıza geri gidin, {% comment %}
ve {% endcomment %}
etiketlerini kaldırıp Kaydet'e tıklayın.
- Shopify yöneticinizde Online Mağaza > Temalar'a gidin.
- Düzenlemek istediğiniz temayı bulun, işlemler menüsünü açmak için … düğmesine, ardından Kodu düzenle'ye tıklayın.
-
Şablonlar dizininde
product.liquid
dosyanıza tıklayın. Sepete ekle düğmesinin HTML kodunu bulun. Başlangıç için sepet kelimesini aratabilirsiniz.
Sepete ekle düğmesinin kodu temadan temaya değişiklik gösterir. Add to cart
, AddToCart
veya add-to-cart
gibi bir metin içeren <input>
veya <button>
etiketini bulun.
Minimal temasında sepete ekle düğmesi aşağıdaki gibi gözükmektedir:
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
- Bulduktan sonra, kodu Liquid'de
{% comment %}
ve{% endcomment %}
etiketleri arasına alın. Bu, kodun mağazanızda gösterilmesini engeller fakat şablon değiştirmek istediğiniz zaman kolayca geri koymanızı sağlar.
Yukarıdaki örnek kullanıldığında yeni kod aşağıdaki gibi olur:
{% comment %}
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
{% endcomment %}
- Değişikliklerinizi onaylamak için Kaydet'e tıklayın.
Sepete ekle düğmelerinizi tekrar göstermeye hazır olduğunuzda, HTML/CSS'i düzenle sayfasındaki product.liquid
şablonunuza geri dönün, {% comment %}
ve {% endcomment %}
etiketlerini kaldırıp Kaydet'e tıklayın.