ความช่วยเหลือ
เข้าสู่ระบบ

การแสดง Shop Promise ในหน้าสินค้าของคุณ

เครื่องหมาย Shop Promise จะปรากฏถัดจากสินค้าในคำสั่งซื้อภายในประเทศของสหรัฐอเมริกาที่มีสิทธิ์ เมื่อ Shopify สามารถคาดการณ์วันที่จัดส่งได้ว่าอยู่ในกรอบเวลาการจัดส่งของ Shop Promise เครื่องหมายนี้ช่วยให้ลูกค้าทราบว่าคำสั่งซื้อของตนจะได้รับการจัดส่งที่รวดเร็วและเชื่อถือได้

หลังจากที่คุณเปิดใช้งาน Shop Promise แล้ว คุณควรไปที่หน้าสินค้าโดยใช้ตัวแก้ไขธีมของคุณเพื่อยืนยันว่าเครื่องหมาย Shop Promise แสดงผลอย่างถูกต้อง

หากเครื่องหมายแสดงผลไม่ถูกต้อง โปรดตรวจสอบให้แน่ใจว่าร้านค้าของคุณได้เปิดใช้งานปุ่มการชำระเงินด่วนแล้ว นอกจากนี้ คุณยังมีตัวเลือกหลายอย่างสำหรับปรับแต่งการแสดงผลของเครื่องหมาย Shop Promise

ในหน้านี้

กำหนดตำแหน่งโมดูล Shop Promise ด้วยตนเอง

หากคุณคุ้นเคยกับการอ่านและแก้ไขโค้ดธีม คุณก็สามารถระบุตำแหน่งที่ต้องทำการเปลี่ยนแปลงและอัปเดตหน้าสินค้าได้

ระบุตำแหน่งที่ต้องทำการเปลี่ยนแปลง

ต้องระบุโค้ดสำหรับโมดูล Shop Promise ไว้ในแบบฟอร์มสินค้าบนหน้าสินค้า ซึ่งควรมีลักษณะคล้ายกับ {%- form 'product', product -%} ทั้งนี้ โมดูล Shop Promise สามารถพบได้ในตำแหน่งที่ตั้งต่างๆ กันไปตามธีมของคุณ ตำแหน่งที่ตั้งที่พบบ่อยมีดังนี้

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

อัปเดตหน้าสินค้า

ขั้นตอน:

เดสก์ท็อป

  1. จากส่วนผู้ดูแล Shopify ของคุณ ให้ไปที่ ร้านค้าออนไลน์

  2. ค้นหาธีมที่คุณต้องการแก้ไข คลิกไอคอน Horizontal menu เพื่อเปิดเมนูการดำเนินการ จากนั้นคลิก “แก้ไขโค้ด”

  3. เปิดไฟล์ที่เกี่ยวข้อง

  4. ค้นหาบรรทัดที่มี {%- if block.settings.show_dynamic_checkout -%} หรือ {{ form | payment_button }}

  5. สร้างบรรทัดใหม่ใต้ {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} โดยตรง แล้ววางข้อมูลต่อไปนี้ในบรรทัดดังกล่าว:

<div class="delivery-promise__promise-container"></div>
  1. คลิก “บันทึก”

ผลลัพธ์ที่ได้ควรมีลักษณะคล้ายกับตัวอย่างดังต่อไปนี้

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

  1. จากแอป Shopify ให้แตะไอคอน Menu

  2. ในส่วนช่องทางการขาย ให้แตะร้านค้าออนไลน์ > จัดการธีมทั้งหมด

  3. ค้นหาธีมที่คุณต้องการแก้ไข แตะที่ปุ่ม Horizontal menu เพื่อเปิดเมนูการดำเนินการ แล้วแตะ แก้ไขโค้ด

  4. เปิดไฟล์ที่เกี่ยวข้อง

  5. ค้นหาบรรทัดที่มี {%- if block.settings.show_dynamic_checkout -%} หรือ {{ form | payment_button }}

  6. สร้างบรรทัดใหม่ใต้ {%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%} โดยตรง แล้ววางข้อมูลต่อไปนี้ในบรรทัดดังกล่าว:

<div class="delivery-promise__promise-container"></div>
  1. แตะ “บันทึก” หรือ ✓

ผลลัพธ์ที่ได้ควรมีลักษณะคล้ายกับตัวอย่างดังต่อไปนี้

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

ลบล้างธีมของโมดูล Shop Promise ด้วยตนเอง

โมดูล Shop Promise มีธีมสีเข้มและธีมสีอ่อน โดยโมดูลจะใช้ธีมที่มีอัตราส่วนคอนทราสต์สูงสุดเมื่อเทียบกับสีพื้นหลังของหน้าสินค้าโดยอัตโนมัติ

หากคุณคุ้นเคยกับการอ่านและแก้ไขโค้ดธีม คุณก็สามารถลบล้างธีมที่เลือกไว้ของโมดูลได้โดยการเพิ่มคุณลักษณะข้อมูลไปยังองค์ประกอบ anchor ที่ใช้ในการกำหนดตำแหน่งของโมดูล Shop Promise ด้วยตนเอง

ก่อนที่คุณจะทำการเปลี่ยนแปลงใดๆ โปรดทำสำเนาธีมของคุณและแก้ไขธีมสำเนา เพื่อให้คุณสามารถเปลี่ยนกลับการเปลี่ยนแปลงใดๆ ได้อย่างง่ายดาย

ขั้นตอน:

เดสก์ท็อป
  1. ทำตามคำแนะนำเพื่อกำหนดตำแหน่งโมดูล Shop Promise ด้วยตนเองบนหน้าสินค้าของคุณ จากนั้นให้เปิดตัวแก้ไขธีมค้างไว้
  2. เพิ่มคุณลักษณะข้อมูลธีมไปยังองค์ประกอบ anchor ที่คุณเพิ่งสร้างขึ้นโดยตั้งค่าเป็น dark หรือ light
  3. คลิก “บันทึก”

ผลลัพธ์ที่ได้ควรมีลักษณะคล้ายกับตัวอย่างใดตัวอย่างหนึ่งดังต่อไปนี้

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

หรือ

<div class="delivery-promise__promise-container" data-theme="light"></div>
มือถือ
  1. ทำตามคำแนะนำเพื่อกำหนดตำแหน่งโมดูล Shop Promise ด้วยตนเองบนหน้าสินค้าของคุณ จากนั้นให้เปิดตัวแก้ไขธีมค้างไว้
  2. เพิ่มคุณลักษณะข้อมูลธีมไปยังองค์ประกอบ anchor ที่คุณเพิ่งสร้างขึ้นโดยตั้งค่าเป็น dark หรือ light
  3. แตะ “บันทึก”

ผลลัพธ์ที่ได้ควรมีลักษณะคล้ายกับตัวอย่างใดตัวอย่างหนึ่งดังต่อไปนี้

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

หรือ

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

เพิ่ม HTML หรือ Liquid แบบกำหนดเองสำหรับโมดูล Promise

หากธีมของคุณรองรับบล็อกแบบกำหนดเอง คุณก็สามารถใช้บล็อก Liquid แบบกำหนดเองเพื่อเพิ่มโมดูล Shop Promise ไปยังหน้าสินค้าของคุณโดยไม่ต้องแก้ไขโค้ดธีม

ขั้นตอนในการเพิ่มโมดูล Promise โดยใช้บล็อก Liquid แบบกำหนดเองมีดังนี้

เดสก์ท็อป

  1. จากส่วนผู้ดูแล Shopify ของคุณ ให้ไปที่ ร้านค้าออนไลน์

  2. ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิก “แก้ไขธีม”

  3. ไปที่หน้าสินค้าโดยใช้ตัวเลือกเทมเพลตในแถบเมนูด้านบน

  4. ในเมนูแถบด้านข้าง ให้ค้นหาส่วนข้อมูลสินค้า

  5. คลิก “เพิ่มบล็อก” และเลือก custom Liquid จากรายการบล็อกที่มี

  6. ในช่องข้อความ Liquid แบบกำหนดเอง ให้วางโค้ดต่อไปนี้

<div class="delivery-promise__promise-container"></div>
  1. กำหนดตำแหน่งของบล็อกโดยการลากไปยังตำแหน่งที่ต้องการ ซึ่งโดยทั่วไปจะอยู่ใต้บล็อกปุ่มซื้อ
  2. คลิก “บันทึก” เพื่อใช้การเปลี่ยนแปลงของคุณ

หากคุณต้องการระบุธีมที่ต้องการ (dark หรือ light) ให้ใช้ตัวเลือกใดตัวเลือกหนึ่งดังต่อไปนี้แทน

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

หรือ

<div class="delivery-promise__promise-container" data-theme="light"></div>
มือถือ

  1. จากแอป Shopify ให้แตะไอคอน Menu

  2. ในส่วนช่องทางการขาย ให้แตะร้านค้าออนไลน์ > จัดการธีมทั้งหมด

  3. ค้นหาธีมที่ใช้งานอยู่ของคุณแล้วแตะ “แก้ไขธีม”

  4. ไปที่หน้าสินค้าโดยใช้ตัวเลือกเทมเพลตที่ด้านบน

  5. แตะที่ส่วนข้อมูลสินค้า

  6. แตะเพิ่มบล็อก แล้วเลือก Liquid แบบกำหนดเอง

  7. ในช่องข้อความ Liquid แบบกำหนดเอง ให้วางโค้ดต่อไปนี้

<div class="delivery-promise__promise-container"></div>
  1. กำหนดตำแหน่งของบล็อกโดยการลากไปยังตำแหน่งที่ต้องการ ซึ่งโดยทั่วไปจะอยู่ใต้บล็อกปุ่มซื้อ
  2. แตะบันทึกเพื่อปรับใช้การเปลี่ยนแปลงของคุณ

หากคุณต้องการระบุธีมที่ต้องการ (dark หรือ light) ให้ใช้ตัวเลือกใดตัวเลือกหนึ่งดังต่อไปนี้แทน

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

หรือ

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

ภาษาที่รองรับสำหรับเครื่องหมาย Shop Promise

โปรดดูตารางต่อไปนี้เพื่อตรวจสอบภาษาที่เครื่องหมาย Shop Promise สามารถแสดงได้ หากร้านค้าของคุณใช้ภาษาที่ไม่รองรับ เครื่องหมาย Shop Promise ก็จะแสดงเป็นภาษาอังกฤษ

ภาษาที่เครื่องหมาย Shop Promise สามารถแสดงได้
จีน (ตัวย่อ)จีน (ตัวเต็ม)โครเอเชียเช็ก
เดนมาร์กดัตช์อังกฤษฟินแลนด์
ฝรั่งเศสเยอรมันกรีกฮินดี
ฮังการีอินโดนีเซียอิตาลีญี่ปุ่น
เกาหลีลิทัวเนียมาเลย์นอร์เวย์ (บุ๊กมอล)
โปแลนด์โปรตุเกส (บราซิล)โปรตุเกส (โปรตุเกส)โรมาเนีย
รัสเซียสโลวักสโลวีเนียสเปน
สวีเดนไทยตุรกีเวียดนาม