Ürün sayfanızda Shop Promise'i gösterme

Shop Promise rozeti, ABD'de yurt içi kargolarda beş veya daha az takvim günü içinde teslim edileceği öngörülen uygun teslimatlar için ürün sayfalarında teslim tarihinin yanında gösterilir. Bu rozet, müşterilerin siparişlerinin hızlı ve güvenilir teslimat içerdiğini bilmelerini sağlar.

Shop Promise başvurunuz onaylandıktan sonra Shop Promise rozetinin doğru şekilde gösterildiğini doğrulamak için tema düzenleyicinizi kullanarak ürün sayfasına gidin.

Rozet doğru şekilde görüntülenmiyorsa Shop Promise modülünü manuel olarak konumlandırmanız gerekir.

Shop Promise modülünü manuel olarak konumlandırma

Tema kodunu rahatlıkla okuyabiliyor ve düzenleyebiliyorsanız nerede değişiklik yapılacağını tanımlayabilir ve ürün sayfasını güncelleyebilirsiniz.

Nerede değişiklik yapılacağını tanımlama

Shop Promise modülünün kodu ürün sayfasındaki ürün formuna dahil edilmelidir. Kodun şuna benzer şekilde görünmesi gerekir: {%- form 'product', product -%}. Shop Promise modülü, temanıza bağlı olarak çeşitli konumlarda bulunabilir. Modülün bulunduğu yaygın konumlar aşağıda verilmiştir:

  • main-product.liquid
  • product-form.liquid
  • product-template.liquid
  • product.liquid

Ürün sayfasını güncelleme

Adımlar:

Masaüstü
  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. İlgili dosyayı açın.

  4. {%- if block.settings.show_dynamic_checkout -%} veya {{ form | payment_button }} kodunu içeren satırı bulun.

  5. Doğrudan {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} altında yeni bir satır oluşturun ve aşağıdakini satırın üzerine yapıştırın:

<div class="delivery-promise__promise-container"></div>
  1. Kaydet'e tıklayın.

Sonucun aşağıdaki gibi görünmesi gerekir:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>
iPhone
  1. Shopify uygulamasında Yatay menü simgesine dokunun. .
  2. Satış Kanalları bölümünde Online Mağaza' ya dokunun.
  3. Temaları Yönet' e dokunun.
  4. Düzenlemek istediğiniz temayı bulun, işlemler menüsünü açmak için düğmesine, ardından Kodu düzenle'ye dokunun.
  5. İlgili dosyayı açın.
  6. {%- if block.settings.show_dynamic_checkout -%} veya {{ form | payment_button }} kodunu içeren satırı bulun.
  7. Doğrudan {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} altında yeni bir satır oluşturun ve aşağıdakini satırın üzerine yapıştırın:
<div class="delivery-promise__promise-container"></div>
  1. Kaydet'e dokunun.

Sonucun aşağıdaki gibi görünmesi gerekir:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>
Android
  1. Shopify uygulamasında Yatay menü simgesine dokunun. .
  2. Satış Kanalları bölümünde Online Mağaza' ya dokunun.
  3. Temaları Yönet' e dokunun.
  4. Düzenlemek istediğiniz temayı bulun, işlemler menüsünü açmak için düğmesine, ardından Kodu düzenle'ye dokunun.
  5. İlgili dosyayı açın.
  6. {%- if block.settings.show_dynamic_checkout -%} veya {{ form | payment_button }} kodunu içeren satırı bulun.
  7. Doğrudan {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} altında yeni bir satır oluşturun ve aşağıdakini satırın üzerine yapıştırın:
<div class="delivery-promise__promise-container"></div>
  1. düğmesine dokunun.

Sonucun aşağıdaki gibi görünmesi gerekir:

{%- if block.settings.show_dynamic_checkout -%}
  {{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>

Shop Promise modül temasını manuel olarak geçersiz kılma

Shop Promise modülü bir koyu ve bir açık temaya sahiptir. Modül, ürün sayfasının arka plan rengine kıyasla en yüksek kontrast oranına sahip olan temayı otomatik olarak kullanır.

Tema kodunu okuma ve düzenleme konusunda bilgi sahibiyseniz Shop Promise modülünü manuel olarak konumlandırmak için kullanılan referans noktası (anchor) öğesine bir veri özelliği ekleyerek, modül tarafından seçilen temayı geçersiz kılabilirsiniz.

Herhangi bir değişiklik yapmadan önce temanızı çoğaltın ve tüm değişiklikleri kolayca geri arabilmek için çoğaltılan temayı düzenleyin.

Adımlar:

Masaüstü
  1. Ürün sayfanızda Shop Promise modülünü manuel olarak konumlandırma talimatlarını uygulayın ve tema düzenleyicisini açık tutun.
  2. Yeni oluşturduğunuz ve koyu veya açık olarak ayarlanmış olan referans noktası öğenize bir tema veri özelliği ekleyin.
  3. Kaydet'e tıklayın.

Sonuç, aşağıdakilerden biri gibi görünmelidir:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Ya da

<div class="delivery-promise__promise-container" data-theme="light"></div>
iPhone
  1. Ürün sayfanızda Shop Promise modülünü manuel olarak konumlandırma talimatlarını uygulayın ve tema düzenleyicisini açık tutun.
  2. Yeni oluşturduğunuz ve koyu veya açık olarak ayarlanmış olan referans noktası öğenize bir tema veri özelliği ekleyin.
  3. Kaydet'e dokunun.

Sonuç, aşağıdakilerden biri gibi görünmelidir:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Ya da

<div class="delivery-promise__promise-container" data-theme="light"></div>
Android
  1. Ürün sayfanızda Shop Promise modülünü manuel olarak konumlandırma talimatlarını uygulayın ve tema düzenleyicisini açık tutun.
  2. Yeni oluşturduğunuz ve koyu veya açık olarak ayarlanmış olan referans noktası öğenize bir tema veri özelliği ekleyin.
  3. Kaydet'e dokunun.

Sonuç, aşağıdakilerden biri gibi görünmelidir:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Ya da

<div class="delivery-promise__promise-container" data-theme="light"></div>

Promise modülü için özel HTML veya Liquid ekleme

Temanız özel blokları destekliyorsa tema kodunu düzenlemeden ürün sayfanıza Shop Promise modülünü eklemek için Özel Liquid bloğunu kullanabilirsiniz.

Özel Liquid bloğu kullanarak Promise modülünü ekleme adımları:

Masaüstü
  1. Shopify yöneticinizde Online Mağaza > Temalar'a gidin.
  2. Düzenlemek istediğiniz temayı bulun ve Kişiselleştir'e tıklayın.
  3. Üst menü çubuğundaki şablon seçiciyi kullanarak bir ürün sayfasına gidin.
  4. Kenar çubuğu menüsünde Ürün bilgileri bölümünü bulun.
  5. Blok ekle'ye tıklayın ve açılan listeden Özel Liquid bloğunu seçin.
  6. Özel Liquid metin alanına aşağıdaki kodu yapıştırın:
<div class="delivery-promise__promise-container"></div>
  1. Bloğu, genellikle Satın Al düğmesi bloğunun altına gelecek şekilde, istediğiniz konuma sürükleyerek yerleştirin.
  2. Değişikliklerinizi uygulamak için Kaydet'e tıklayın.

Bir tema Tercihler (koyu veya açık) belirtmek istiyorsan bunun yerine aşağıdakilerden birini kullan:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Ya da

<div class="delivery-promise__promise-container" data-theme="light"></div>
iPhone
  1. Shopify uygulamasında Yatay menü simgesine dokunun.

    Online Mağaza.

  2. Temaları Yönet' e dokunun.
  3. Etkin temanızı bulun ve Özelleştir'e seçeneğine dokunun.
  4. Üstteki şablon seçicisinden bir ürün sayfasına gidin.
  5. Ürün bilgileri bölümüne dokunun.
  6. Blok ekle'ye dokunun ve Özel Liquid bloğunu seçin.
  7. Özel Liquid metin alanına aşağıdaki kodu yapıştırın:
<div class="delivery-promise__promise-container"></div>
  1. Bloğu, genellikle Satın Al düğmesi bloğunun altına gelecek şekilde, istediğiniz konuma sürükleyerek yerleştirin.
  2. Değişikliklerinizi uygulamak için Kaydet'e dokunun.

Bir tema Tercihler (koyu veya açık) belirtmek istiyorsan bunun yerine aşağıdakilerden birini kullan:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Ya da

<div class="delivery-promise__promise-container" data-theme="light"></div>
Android
  1. Shopify uygulamasında Yatay menü simgesine dokunun.

    Online Mağaza.

  2. Temaları Yönet' e dokunun.
  3. Etkin temanızı bulun ve Özelleştir'e seçeneğine dokunun.
  4. Üstteki şablon seçicisinden bir ürün sayfasına gidin.
  5. Ürün bilgileri bölümüne dokunun.
  6. Blok ekle'ye dokunun ve Özel Liquid bloğunu seçin.
  7. Özel Liquid metin alanına aşağıdaki kodu yapıştırın:
<div class="delivery-promise__promise-container"></div>
  1. Bloğu, genellikle Satın Al düğmesi bloğunun altına gelecek şekilde, istediğiniz konuma sürükleyerek yerleştirin.
  2. Değişikliklerinizi uygulamak için Kaydet'e dokunun.

Bir tema Tercihler (koyu veya açık) belirtmek istiyorsan bunun yerine aşağıdakilerden birini kullan:

<div class="delivery-promise__promise-container" data-theme="dark"></div>

Ya da

<div class="delivery-promise__promise-container" data-theme="light"></div>
Aradığınız cevapları bulamıyor musunuz? Yardımcı olmak için buradayız.