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

Bu sayfada

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ü

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.
İlgili dosyayı açın.
{%- if block.settings.show_dynamic_checkout -%} veya {{ form | payment_button }} kodunu içeren satırı bulun.
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>

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

Shopify uygulamasında, … düğmesine dokunun.
Satış Kanalları bölümünde Online Mağaza' ya dokunun.
Temaları Yönet' e dokunun.
Düzenlemek istediğiniz temayı bulun, işlemler menüsünü açmak için … düğmesine, ardından Kodu düzenle'ye dokunun.
İlgili dosyayı açın.
{%- if block.settings.show_dynamic_checkout -%} veya {{ form | payment_button }} kodunu içeren satırı bulun.
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>

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

Shopify uygulamasında, … düğmesine dokunun.
Satış Kanalları bölümünde Online Mağaza' ya dokunun.
Temaları Yönet' e dokunun.
Düzenlemek istediğiniz temayı bulun, işlemler menüsünü açmak için … düğmesine, ardından Kodu düzenle'ye dokunun.
İlgili dosyayı açın.
{%- if block.settings.show_dynamic_checkout -%} veya {{ form | payment_button }} kodunu içeren satırı bulun.
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>

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>

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ü

Ürün sayfanızda Shop Promise modülünü manuel olarak konumlandırma talimatlarını uygulayın ve tema düzenleyicisini açık tutun.
Yeni oluşturduğunuz ve koyu veya açık olarak ayarlanmış olan referans noktası öğenize bir tema veri özelliği ekleyin.
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

Ürün sayfanızda Shop Promise modülünü manuel olarak konumlandırma talimatlarını uygulayın ve tema düzenleyicisini açık tutun.
Yeni oluşturduğunuz ve koyu veya açık olarak ayarlanmış olan referans noktası öğenize bir tema veri özelliği ekleyin.
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

Ürün sayfanızda Shop Promise modülünü manuel olarak konumlandırma talimatlarını uygulayın ve tema düzenleyicisini açık tutun.
Yeni oluşturduğunuz ve koyu veya açık olarak ayarlanmış olan referans noktası öğenize bir tema veri özelliği ekleyin.
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>