UX ของแผงตะกร้า

เครื่องคำนวณค่าจัดส่งในแผงตะกร้า Shopify: แนวทางปฏิบัติที่ดี

ออกแบบ วาง ทดสอบ และวัดผลเครื่องมือประมาณค่าจัดส่งภายในแผงตะกร้า Shopify แบบไดนามิก โดยไม่รบกวนการชำระเงิน

อัปเดตเมื่อ 21 กันยายน 2569 · โดยทีม ShipCalc ที่ MerchantOS

คำตอบสั้น ๆ

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

รักษาหน้าที่หลักของแผงตะกร้าไว้

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

อัปเดตเมื่อตะกร้าเปลี่ยน

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

อยากให้ลูกค้าเห็นอัตราก่อนชำระเงินใช่ไหมShipCalc แสดงอัตรา Shopify ที่คุณมีอยู่บนหน้าสินค้า ตะกร้า และแผงตะกร้า ดูวิธีการทำงาน

ออกแบบสำหรับพื้นที่แคบและเปลี่ยนแปลงได้

แผงตะกร้ามักแคบและเลื่อนได้ ป้องกันการล้นแนวนอน ให้พื้นที่แตะใช้งานสะดวก ไม่บังปุ่มชำระเงิน และแจ้งการเปลี่ยนแปลงผลลัพธ์ให้เทคโนโลยีช่วยเหลือทราบ สถานะกำลังโหลดควรจองพื้นที่ไว้เพื่อไม่ให้แผงตะกร้ากระตุก

ทดสอบอีกครั้งหลังเปลี่ยนธีม

ธีมอาจเปลี่ยนโค้ด ชื่อคลาส หรือการแสดงผลของแผงตะกร้าระหว่างการอัปเดต บันทึกเวอร์ชันและตัวเลือกที่ใช้ แล้วรวมเครื่องคำนวณไว้ในทุกการตรวจสอบหลังอัปเกรดธีม

รายการตรวจสอบ

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

คำถาม

ธีม Shopify ทุกธีมใช้แผงตะกร้าแบบเดียวกันหรือไม่

ไม่ โค้ดและการทำงานของแผงตะกร้าแตกต่างกันตามธีมและเวอร์ชัน จึงต้องทดสอบความเข้ากันได้

เครื่องคำนวณควรเปิดเองอัตโนมัติไหม

โดยทั่วไปให้ย่อไว้จนกว่าลูกค้าจะขอการคำนวณ เว้นแต่ค่าจัดส่งเป็นปัจจัยหลักในการตัดสินใจสำหรับแคตตาล็อกนั้น

ผลลัพธ์ควรแสดงที่ไหน

แสดงผลลัพธ์ใกล้ช่องกรอกและยอดรวมย่อย โดยที่ปุ่มชำระเงินยังมองเห็นและใช้งานได้

แหล่งข้อมูล

หน้าศูนย์ช่วยเหลือของ Shopify อาจเปิดเป็นภาษาอังกฤษ

ลองใช้ ShipCalc ฟรี

แสดงค่าจัดส่งให้ลูกค้าเห็นก่อนที่เขาจะถาม

มีคำถามก่อนใช่ไหม คุยกับเรา

เริ่มทดลองใช้ฟรี
  • ทดลองใช้ฟรี 14 วัน
  • ไม่ต้องแก้โค้ดธีม