องค์ประกอบ JavaScript สำหรับสถานะคำสั่งซื้อ
คุณสามารถเพิ่มเนื้อหาแบบกำหนดเองไปยังหน้าสถานะคำสั่งซื้อด้วยองค์ประกอบ JavaScript สำหรับสถานะคำสั่งซื้อ Shopify.Checkout.OrderStatus เช่น ตัวอย่างต่อไปนี้ - หมายเหตุสำหรับสินค้าบางรายการ - คำแนะนำสำหรับวิธีจัดส่งแต่ละวิธี - ลิงก์ดาวน์โหลดสำหรับสินค้าดิจิทัล
หากต้องการเพิ่มองค์ประกอบ JavaScript ในหน้าส่วนผู้ดูแล Shopify ให้ไปที่ การตั้งค่า > การชำระเงินเลื่อนลงมาที่ส่วนหน้าสถานะคำสั่งซื้อ จากนั้นให้เพิ่มเนื้อหาองค์ประกอบ JavaScript ลงในกล่องสคริปต์เพิ่มเติม
แอสเซท JavaScript นี้ยังสามารถเข้าถึงได้ผ่าน ScriptTag
มีวิธีการทำงานอย่างไร
Shopify.Checkout.OrderStatus มีฟังก์ชันสำหรับสร้างเนื้อหาใหม่:
addContentBox(params)ฟังก์ชันนี้จะเพิ่มกล่องเนื้อหาที่เมื่อมีพารามิเตอร์ส่งผ่านไปยังฟังก์ชัน ระบบจะแสดงข้อมูลนั้นในแถวแยก
รองรับ HTML5 ภายในฟังก์ชัน และคุณสามารถใช้ liquid นอกฟังก์ชันได้
ตัวอย่าง
คุณสามารถเพิ่มเนื้อหาเมื่อมีการใช้วิธีการจัดส่งบางรายการได้ รหัสนี้จะเพิ่มเวลาเปิดทำการของร้านค้าในหน้าแสดงสถานะคำสั่งซื้อ เมื่อลูกค้าเลือกวิธีการจัดส่งแบบรับที่ร้านค้า
<script>
{% if checkout.shipping_method.title == 'Pick-up at the store' %}
Shopify.Checkout.OrderStatus.addContentBox(
'<h2>Pick-up in store</h2>',
'<p>We are open everyday from 9am to 5pm.</p>'
)
{% endif %}
</script>