"Sepete ekle" ifadesini iletişim bağlantısı ile değiştirin

Dikkat

Vintage temalar Theme Store'da bulunmaz. Vintage temalar, Shopify'ın Online Store 2.0 temalarında yer alan özellikleri içermez ve Shopify'ın ücretsiz vintage temaları, güvenlik düzeltmelerinin dışında güncelleme almaz.

Not

Shopify'ın ücretsiz temalarından birini kullanıyorsanız bu eğitimle ilgili yardım almak için Shopify Destek ekibiyle iletişime geçebilirsiniz. 15 dakikalık bir tasarım süresi gerekir. Shopify Tasarım Politikası hakkında daha fazla bilgi edinin.

Not

Bu özelleştirme, vintage Shopify temaları içindir ve Online Store 2.0 temalarına uygulanmaz.

• Temanızın mimari sürümünü öğrenin
• Online Store 2.0 tema özelleştirmelerini keşfedin

Sepete ekle düğmesini, bir e-posta bağlantısı veya iletişim formu ile değiştirebilirsiniz. Örneğin, şu anda satışa açık olmayan veya sipariş üzerine yapılan ürünler için Sepete Ekle düğmesini değiştirmek isteyebilirsiniz.

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ümlere ayrılmış tema kullandığınız anlamına gelir. Bölümlere ayrılmamış temalar Ekim 2016'dan önce yayınlanmıştır ve Bölümler dizininde 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.

Bölümlere ayrılmış temalar için adımlar

Temanızı seçme

Bu özelleştirmeye yönelik adımlar, Narrative temasını mı yoksa Shopify tarafından yapılan başka bir ücretsiz temayı mı kullandığınıza göre değişiklik gösterir. Aşağıdaki talimatları takip etmeden önce temanızın düğmesine tıklayın:

Narrative

Narrative üzerinde yeni bir ürün şablonu oluşturma

Bir ürünün Sepete ekle düğmesini değiştirmek üzere bu ürün için özel bir ürün şablonu oluşturmanız gerekir.

Adımlar:

1. Shopify yöneticinizde Online Mağaza > Temalar'a gidin.

2. 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.

3. Şablonlar dizininde Yeni şablon ekle öğesine tıklayın.

4. Ürün şablonunu oluşturun:

   • Açılır menüden ürün seçin.
   • Şablonunuzu requires-contact olarak adlandırın.
   • Şablon oluştur'a tıklayın.

5. Aşağıdaki kodu bulun:

{% section 'product-template' %}

Bunu şununla değiştirin:

{% section 'product-template-requires-contact' %}

Bu kod, yeni şablonunuzu, sonraki adımlarda oluşturulacak yeni bir ürün bölümüyle bağlar.

1. Kaydet'e tıklayın.

Yeni ürün bölümü oluşturma

1. Bölümler dizininde, Yeni bölüm ekle öğesine tıklayın.

2. Bölümü oluşturun:

   1. Yeni bölümü product-template-requires-contact olarak adlandırın.
   2. Bölüm oluştur'a tıklayın.

3. Bölüm dosyasındaki varsayılan kodun tümünü silin, böylece dosya boş olsun.

4. Bölümler dizininde product-template.liquid öğesine tıklayın. Dosyanın tüm içeriğini panonıza kopyalayın.

5. Yeni product-template-requires-contact.liquid bölümünüze geri dönüp kodu dosyaya yapıştırın.

6. Kaydet'e tıklayın.

Sepete ekle düğmesini gizleme

1. product-template-requires-contact.liquid bölümü dosyanızda, ürün sayfanızın Ürün formu için HTML kodunu bulun. Bunu, dosya içerisinde form kelimesini aratarak bulabilirsiniz.

2. Bulduktan sonra, kodu Liquid'de {% comment %} ve {% endcomment %} etiketleri arasına alın. Bu, kodun mağazanızda görünmesini engeller fakat şablon değiştirmek istediğiniz zaman kolayca geri koymanızı sağlar.

Narrative için değiştirilmiş kod şöyle gözükmelidir:

{% comment %}
{% include 'product-form' %}
{% endcomment %}

1. Kaydet'e tıklayın.

E-posta bağlantısı veya iletişim formu ekleme

Artık Sepete ekle düğmesini gizleyebilirsiniz. Bunun yerine, göstermek istediğiniz içeriği ekleyebilirsiniz.

E-posta bağlantısı

Müşterinin varsayılan e-posta programını açacak ve alıcı olarak mağazanızın müşteriye yönelik e-posta adresini girecek bir e-posta bağlantısı ekleyebilirsiniz. E-posta bağlantısı eklemek için:

1. Son adımda eklediğiniz Liquid {% endcomment %} etiketinin altında yeni bir satıra e-posta bağlantısının HTML kodunu ekleyin:

<p>Please <a href="mailto:{{ shop.email }}">contact us</a> if you are interested in this product.</p>

1. Kaydet'e tıklayın.

İletişim formu

Temanızın iletişim sayfası şablonundan kodu kopyalayarak yeni ürün şablonunuza bir iletişim formu ekleyebilirsiniz. Bir iletişim formu eklemek için:

1. Şablonlar dizininde page.contact.liquid seçeneğine tıklayın.
2. Dosyada Liquid {% form 'contact' %} etiketini bulun.
3. Liquid {% endform %} etiketinin altında bulunan Liquid {% form 'contact' %} etiketindeki tüm kodu kopyalayın. Kopyaladığınız koda Liquid biçimindeki etiketleri ekleyin.
4. Şablonlar dizininizdeki yeni product.requires-contact.liquid dosyanıza dönün.

Eklenen Liquid {% endcomment %} etiketinin altına yeni bir satırda iletişim formunun kodunu yapıştırın.

1. Sonraki adım, az önce yapıştırdığınız kodu HTML div etiketlerine sarmaktır. div etiket kodunda bulunan class özelliği, iletişim formunuzun sayfada doğru bir şekilde görüntülenmesini sağlayacaktır.

{% form 'contact' %} üzerindeki satıra aşağıdaki kodu yapıştırın:

<div class="form-vertical">

{% endform %} altına, aşağıdaki kodu yapıştırın:

</div>

1. Kaydet'e tıklayın.

Yeni şablonu bir ürüne atama

Artık şablon tamamlandığına göre, bunu Sepete ekle düğmesini gizlemek istediğiniz tüm ürünlere atabilirsiniz.

1. Shopify yöneticinizden Ürünler'e gidin.

2. Sepete ekle düğmesini gizlemek istediğiniz ürünün adına tıklayın.

3. Shopify yöneticinizin ürün sayfasında, Online mağaza altında, Tema şablonu açılır menüsünden yeni requires-contact şablonunuzu seçin.

4. Kaydet'e tıklayın.

Yeni şablonunuzu eklemek istediğiniz her ürün için bu adımları tekrarlayın.

Other

Yeni ürün şablonu oluşturma

Bir ürünün Sepete ekle düğmesini değiştirmek üzere bu ürün için özel bir ürün şablonu oluşturmanız gerekir.

Adımlar:

1. Shopify yöneticinizde Online Mağaza > Temalar'a gidin.

2. 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.

3. Şablonlar dizininde Yeni şablon ekle öğesine tıklayın.

4. Ürün şablonunu oluşturun:

   • Açılır menüden ürün seçin.
   • Şablonunuzu requires-contact olarak adlandırın.
   • Şablon oluştur'a tıklayın.

5. Aşağıdaki kodu bulun:

{% section 'product-template' %}

Bunu şununla değiştirin:

{% section 'product-template-requires-contact' %}

Bu kod, yeni şablonunuzu, sonraki adımlarda oluşturulacak yeni bir ürün bölümüyle bağlar.

1. Kaydet'e tıklayın.

Yeni ürün bölümü oluşturma

1. Bölümler dizininde, Yeni bölüm ekle öğesine tıklayın.

2. Bölümü oluşturun:

   1. Yeni bölümü product-template-requires-contact olarak adlandırın.
   2. Bölüm oluştur'a tıklayın.

3. Bölüm dosyasındaki varsayılan kodun tümünü silin, böylece dosya boş olsun.

4. Bölümler dizininde product-template.liquid öğesine tıklayın. Dosyanın tüm içeriğini panonıza kopyalayın.

5. Yeni product-template-requires-contact.liquid bölümünüze geri dönüp kodu dosyaya yapıştırın.

6. Kaydet'e tıklayın.

Sepete ekle düğmesini gizleme

1. Yeni product-template-requires-contact.liquid dosyanızda, ürün sayfanızda kullandığınız Sepete ekle düğmesinin HTML kodunu bulun. Bunu, dosya içerisinde cart kelimesini aratarak bulabilirsiniz.

Sepete ekle düğmesinin kodu temadan temaya değişiklik gösterir. Add to cart, AddToCart veya add-to-cart gibi bir metine sahip <input> veya <button> etiketini bulun.

Debut için Sepete ekle düğme 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>

1. Bulduktan sonra, kodu Liquid'de {% comment %} ve {% endcomment %} etiketleri arasına alın. Bu, kodun mağazanızda görünmesini engeller fakat şablon değiştirmek istediğiniz zaman kolayca geri koymanızı sağlar.

Debut için değiştirilmiş kod aşağıdaki gibi gözükmelidir:

{% 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 %}

Dikkat

Ürün sayfanızdaki <form> etiketlerini yorum içerisine almadığınızdan emin olun. Yorum etiketleriniz herhangi bir <form> veya </form> etiketinde yer almamalıdır. Aksi takdirde müşteriler, ürün sayfanızı görüntülerken hatalarla karşılaşabilir.

1. Kaydet'e tıklayın.

E-posta bağlantısı veya iletişim formu ekleme

Artık Sepete ekle düğmesini gizleyebilirsiniz. Bunun yerine, göstermek istediğiniz içeriği ekleyebilirsiniz.

E-posta bağlantısı

Müşterinin varsayılan e-posta programını açacak ve alıcı olarak mağazanızın müşteriye yönelik e-posta adresini girecek bir e-posta bağlantısı ekleyebilirsiniz. E-posta bağlantısı eklemek için:

1. Son adımda eklediğiniz Liquid {% endcomment %} etiketinin altında yeni bir satıra e-posta bağlantısının HTML kodunu ekleyin:

<p>Please <a href="mailto:{{ shop.email }}">contact us</a> if you are interested in this product.</p>

1. Kaydet'e tıklayın.

İletişim formu

Temanızın iletişim sayfası şablonundan kodu kopyalayarak yeni ürün şablonunuza bir iletişim formu ekleyebilirsiniz. Bir iletişim formu eklemek için:

1. Şablonlar dizininde page.contact.liquid seçeneğine tıklayın.
2. Dosyada Liquid {% form 'contact' %} etiketini bulun.
3. Liquid {% endform %} etiketinin altında bulunan Liquid {% form 'contact' %} etiketindeki tüm kodu kopyalayın. Kopyaladığınız koda Liquid biçimindeki etiketleri ekleyin.
4. Bölümler dizinindeki product-template-requires-contact.liquid dosyanıza geri dönün.
5. Dosyadaki kapatma </form> etiketini bulun. Kapatma </form> etiketinin altına yeni bir satıra iletişim formunun kodunu yapıştırın.
6. Sonraki adım, az önce yapıştırdığınız kodu HTML div etiketlerine sarmaktır. div etiket kodunda bulunan class özelliği, iletişim formunuzun sayfada doğru bir şekilde görüntülenmesini sağlayacaktır.

{% form 'contact' %} üzerindeki satıra aşağıdaki kodu yapıştırın:

<div class="form-vertical"></div>

{% endform %} altına, aşağıdaki kodu yapıştırın:

</div>

1. Kaydet'e tıklayın.

Yeni şablonu bir ürüne atama

Artık şablon tamamlandığına göre, bunu Sepete ekle düğmesini gizlemek istediğiniz tüm ürünlere atabilirsiniz.

1. Shopify yöneticinizden Ürünler'e gidin.

2. Sepete ekle düğmesini gizlemek istediğiniz ürünün adına tıklayın.

3. Shopify yöneticinizin ürün sayfasında, Online mağaza altında, Tema şablonu açılır listesinden yeni requires-contact şablonunuzu seçin.

4. Kaydet'e tıklayın.

Yeni şablonunuzu eklemek istediğiniz her ürün için bu adımları tekrarlayın.

Bölümlere ayrılmamış temalar için adımlar

Yeni ürün şablonu oluşturma

Bir ürünün Sepete ekle düğmesini değiştirmek üzere bu ürün için özel bir ürün şablonu oluşturmanız gerekir.

Adımlar:

1. Shopify yöneticinizde Online Mağaza > Temalar'a gidin.

2. 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.

3. Şablonlar dizininde Yeni şablon ekle öğesine tıklayın.

4. Ürün şablonunu oluşturun:

   • Açılır menüden ürün seçin.
   • Şablonunuzu requires-contact olarak adlandırın.
   • Şablon oluştur'a tıklayın.

Sepete ekle düğmesini gizleme

1. Yeni product.requires-contact.liquid dosyanızda, Sepete ekle düğmesinin HTML kodunu bulun. cart kelimesini de aratabilirsiniz.

Sepete ekle düğmesinin kodu temadan temaya değişiklik gösterir. Add to cart, AddToCart veya add-to-cart gibi bir metine sahip <input> veya <button> etiketini bulun.

Debut için Sepete ekle düğme 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>

1. Bulduktan sonra, kodu Liquid'de {% comment %} ve {% endcomment %} etiketleri arasına alın. Bu, kodun mağazanızda görünmesini engeller fakat şablon değiştirmek istediğiniz zaman kolayca geri koymanızı sağlar.

Debut için değiştirilmiş kod aşağıdaki gibi gözükmelidir:

{% 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 %}

Dikkat

Ürün sayfanızdaki <form> etiketlerini yorum içerisine almadığınızdan emin olun. Yorum etiketleriniz herhangi bir <form> veya </form> etiketinde yer almamalıdır. Aksi takdirde müşteriler, ürün sayfanızı görüntülerken hatalarla karşılaşabilir.

1. Kaydet'e tıklayın.

E-posta bağlantısı veya iletişim formu ekleme

Artık Sepete ekle düğmesini gizleyebilirsiniz. Bunun yerine, göstermek istediğiniz içeriği ekleyebilirsiniz.

E-posta bağlantısı

1. Son adımda eklediğiniz Liquid {% endcomment %} etiketinin altında yeni bir satıra e-posta bağlantısının HTML kodunu ekleyin:

Please <a href="mailto:{{ shop.email }}">contact us</a> if you are
interested in this product.

1. Kaydet'e tıklayın.

İletişim formu

Temanızın iletişim sayfası şablonundan kodu kopyalayarak yeni ürün şablonunuza bir iletişim formu ekleyebilirsiniz. Bir iletişim formu eklemek için:

1. Şablonlar dizininde page.contact.liquid seçeneğine tıklayın.
2. Dosyada Liquid {% form 'contact' %} etiketini bulun.
3. Liquid {% endform %} etiketinin altında bulunan Liquid {% form 'contact' %} etiketindeki tüm kodu kopyalayın. Kopyaladığınız koda Liquid biçimindeki etiketleri ekleyin.
4. Şablonlar dizininizdeki yeni product.requires-contact.liquid dosyanıza dönün.
5. Dosyadaki kapatma </form> etiketini bulun. Kapatma </form> etiketinin altına yeni bir satıra iletişim formunun kodunu yapıştırın.
6. Sonraki adım, az önce yapıştırdığınız kodu HTML div etiketlerine sarmaktır. div etiket kodunda bulunan class özelliği, iletişim formunuzun sayfada doğru bir şekilde görüntülenmesini sağlayacaktır.

{% form 'contact' %} üzerindeki satıra aşağıdaki kodu yapıştırın:

<div class="form-vertical"></div>

{% endform %} altına, aşağıdaki kodu yapıştırın:

</div>

1. Kaydet'e tıklayın.

Yeni şablonu bir ürüne atama

Artık şablon tamamlandığına göre, bunu Sepete ekle düğmesini gizlemek istediğiniz tüm ürünlere atabilirsiniz.

1. Shopify yöneticinizden Ürünler'e gidin.

2. Sepete ekle düğmesini gizlemek istediğiniz ürünün adına tıklayın.

3. Shopify yöneticinizin ürün sayfasında, Online Mağaza altında, Tema şablonu açılır listesinden yeni requires-contact şablonunuzu seçin.

4. Kaydet'e tıklayın.

Yeni şablonunuzu eklemek istediğiniz her ürün için bu adımları tekrarlayın.