โมดูลการเปรียบเทียบผลิตภัณฑ์

บทความนี้อธิบายโมดูลเปรียบเทียบผลิตภัณฑ์และวิธีการนําไปใช้บนเว็บไซต์อีคอมเมิร์ซของ Microsoft Dynamics 365 Commerce

หมายเหตุ

โมดูลปุ่มการเปรียบเทียบผลิตภัณฑ์และการเปรียบเทียบผลิตภัณฑ์มีให้ใช้งานของ Dynamics 365 Commerce รุ่น 10.0.29 ใช้ได้ทั้งเว็บไซต์แบบธุรกิจต่อผู้บริโภค (B2C) และแบบธุรกิจต่อธุรกิจ (B2B)

ฟังก์ชันการเปรียบเทียบผลิตภัณฑ์ช่วยให้พนักงานขายสามารถเปรียบเทียบรายละเอียดผลิตภัณฑ์ในหน้าการเปรียบเทียบผลิตภัณฑ์ เพื่อช่วยให้การตัดสินใจในการซื้อดีขึ้น กําหนดค่าฟังก์ชันนี้ในตัวสร้างไซต์ Commerce โดยใช้โมดูลการเปรียบเทียบผลิตภัณฑ์ ในหน้ารายการผลิตภัณฑ์ (PLPs) เช่น ผลการค้นหา และหน้าชุดผลิตภัณฑ์ คุณสามารถตั้งค่าคอนฟิกปุ่มเพื่อเปรียบเทียบผลิตภัณฑ์ซึ่งผู้ซื้อสามารถเพิ่มผลิตภัณฑ์ลงในถาดการเปรียบเทียบได้ กําหนดค่าฟังก์ชันนี้ในตัวสร้างไซต์โดยใช้โมดูลปุ่มเปรียบเทียบผลิตภัณฑ์ซึ่งทํางานได้เหมือนกับโมดูลมุมมองด่วน

เมื่อผู้ใช้ไซต์เพิ่มผลิตภัณฑ์เพื่อเปรียบเทียบ ด้วยการเลือกผลิตภัณฑ์ใหม่บนถาดการเปรียบเทียบจะปรากฏขึ้นที่ด้านล่างของหน้า ถาดเปรียบเทียบจะแสดงผลิตภัณฑ์ที่ผู้ผลิตเปรียบเทียบอยู่ในปัจจุบัน พร้อมกับการแสดงตัวอย่างผลิตภัณฑ์สั้นๆ ผู้ใช้ไซต์ยังสามารถเพิ่มผลิตภัณฑ์จากหน้ารายละเอียดผลิตภัณฑ์ (PDPs) และสามารถเพิ่มผลิตภัณฑ์ย่อยเฉพาะเพื่อเปรียบเทียบกับผลิตภัณฑ์หลักได้

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

ภาพประกอบต่อไปนี้จะแสดงตัวอย่างของปุ่มเปรียบเทียบผลิตภัณฑ์ ปุ่มลบออกจากการเปรียบเทียบ ถาดเปรียบเทียบ และหน้าการเปรียบเทียบผลิตภัณฑ์

ภาพหน้าจอของภาพรวมการเปรียบเทียบผลิตภัณฑ์ที่แสดงปุ่มเปรียบเทียบผลิตภัณฑ์ปุ่มนําออกจากปุ่มเปรียบเทียบแผงถาดเปรียบเทียบและหน้าเปรียบเทียบผลิตภัณฑ์

หมายเหตุ

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

ในแผนภาพต่อไปนี้แสดงตัวอย่างของหน้าการเปรียบเทียบผลิตภัณฑ์

สกรีนช็อตของหน้าเปรียบเทียบผลิตภัณฑ์

เพิ่มโมดูลการเปรียบเทียบผลิตภัณฑ์ในหน้าการเปรียบเทียบผลิตภัณฑ์ใหม่

คุณสามารถสร้างหน้าการเปรียบเทียบผลิตภัณฑ์เฉพาะโดยเพิ่มโมดูลการเปรียบเทียบผลิตภัณฑ์ลงในเนื้อหาของหน้า นอกจากเปิดใช้งานลูกค้าเพื่อเปรียบเทียบรายละเอียดผลิตภัณฑ์ของผลิตภัณฑ์ต่างๆ แล้ว คุณสามารถตั้งค่าคอนฟิกโมดูลการเปรียบเทียบผลิตภัณฑ์ เพื่อให้ตัวเลือกในการซื้อสินค้าของลูกค้าเสร็จสมบูรณ์ได้อย่างรวดเร็ว หลังจากที่เปรียบเทียบผลิตภัณฑ์ โมดูลการเปรียบเทียบผลิตภัณฑ์ยังประกอบด้วยช่อง การเปรียบเทียบที่ว่างเปล่า ซึ่งคุณสามารถเพิ่มโมดูลบล็อคเนื้อหาที่อธิบายสถานะว่างเปล่าได้ (ตัวอย่างเช่น "การเปรียบเทียบผลิตภัณฑ์ของคุณว่างเปล่า")

หากต้องการเพิ่มโมดูลเปรียบเทียบผลิตภัณฑ์ไปยังหน้าเปรียบเทียบผลิตภัณฑ์ใหม่ ให้ทําตามขั้นตอนเหล่านี้:

  1. ไปที่ หน้า และจากนั้น ให้เลือก สร้าง เพื่อสร้างหน้าใหม่
  2. ในกล่องโต้ตอบ สร้างหน้าใหม่ ภายใต้ ชื่อหน้า ให้ป้อนชื่อของหน้าที่เหมาะสม (ตัวอย่างเช่น การเปรียบเทียบผลิตภัณฑ์) และจากนั้น เลือก ถัดไป
  3. ภายใต้ เลือกเทมเพลต ให้เลือกเทมเพลตที่เหมาะสม (ตัวอย่างเช่น เทมเพลตที่หน้าหมวดหมู่เริ่มต้นของคุณใช้) จากนั้นเลือก ถัดไป
  4. ภายใต้ เลือกโครงร่าง ให้เลือกโครงร่างหน้า (ตัวอย่างเช่น โครงร่างแบบยืดหยุ่น) แล้วเลือก ถัดไป
  5. ภายใต้ ตรวจทานและเสร็จสิ้น ให้ตรวจทานการตั้งค่าคอนฟิกหน้า ถ้าคุณต้องการแก้ไขข้อมูลหน้า ให้เลือก ย้อนกลับ ถ้าข้อมูลหน้าถูกต้อง ให้เลือก สร้างหน้า
  6. ใน ช่องหลัก เลือกจุดไข่ปลา (...) แล้วจากนั้นเลือก เพิ่มโมดูล
  7. ในกล่องโต้ตอบ เลือกโมดูล ให้เลือกโมดูล คอนเทนเนอร์ แล้วเลือก ตกลง
  8. ในช่อง คอนเทนเนอร์ เลือกจุดไข่ปลา (...) แล้วจากนั้นเลือก เพิ่มโมดูล
  9. ในกล่องโต้ตอบ เลือกโมดูล ให้เลือกโมดูล การเปรียบเทียบผลิตภัณฑ์ แล้วจากนั้น เลือก ตกลง
  10. ในช่อง ปุ่มมุมมองทางลัด เลือกจุดไข่ปลา (...) แล้วจากนั้น เลือก เพิ่มโมดูล
  11. ในกล่องโต้ตอบ เลือกโมดูล ให้เลือกโมดูล มุมมองทางลัดของสินค้า แล้วเลือก ตกลง
  12. ในบานหน้าต่างคุณสมบัติที่ด้านขวา ให้ตั้งค่าคุณสมบัติสำหรับโมดูล มุมมองทางลัดของสินค้า
  13. ในช่อง การเปรียบเทียบที่ว่างเปล่า เลือกจุดไข่ปลา (...) แล้วจากนั้น เลือก เพิ่มโมดูล
  14. ในกล่องโต้ตอบ เลือกโมดูล ให้เลือกโมดูล บล็อคเนื้อหา แล้วเลือก ตกลง
  15. ในบานหน้าต่างคุณสมบัติที่ด้านขวา ให้ตั้งค่าคุณสมบัติสำหรับโมดูล บล็อคเนื้อหา
  16. เลือก บันทึก และจากนั้น เลือก แสดงตัวอย่าง เพื่อแสดงตัวอย่างหน้า
  17. เลือก แก้ไขให้เสร็จสิ้น เพื่อตรวจสอบในหน้า และจากนั้น เลือก เผยแพร่ เพื่อเผยแพร่

ภาพประกอบต่อไปนี้แสดงตัวอย่างของหน้าการเปรียบเทียบว่างเปล่าในตัวสร้างไซต์

สกรีนช็อตของโมดูลการเปรียบเทียบผลิตภัณฑ์ในตัวสร้างไซต์

เพิ่มปุ่มการเปรียบเทียบผลิตภัณฑ์ไปยังไทล์ผลิตภัณฑ์ในหน้าผลการค้นหาและประเภท

ปุ่มการเปรียบเทียบผลิตภัณฑ์ช่วยให้ผู้ใช้สามารถเพิ่มผลิตภัณฑ์ลงในถาดการเปรียบเทียบได้อย่างรวดเร็ว เมื่อเลือกดูผลิตภัณฑ์ในหน้ารายการ หรือเพิ่มผลิตภัณฑ์หนึ่งรายการไปยังถาดเปรียบเทียบจากหน้ารายการโดยไม่ต้องไปที่ PDP

ปุ่มการเปรียบเทียบผลิตภัณฑ์ได้รับการสนับสนุนโดยโมดูล คอลเลกชันผลิตภัณฑ์ ผลการค้นหา และกล่องการซื้อของ PDP

หากต้องการเพิ่มปุ่มเปรียบเทียบผลิตภัณฑ์ไปยังไทล์ผลิตภัณฑ์ในหน้าผลลัพธ์การค้นหาและหมวดหมู่ ให้ทําตามขั้นตอนเหล่านี้:

  1. ในโปรแกรมสร้างไซต์ ให้ไปที่ หน้า และเปิดหน้าประเภทที่คุณต้องการเพิ่มปุ่มการเปรียบเทียบผลิตภัณฑ์
  2. ใน ช่องหลัก เลือกจุดไข่ปลา (...) แล้วจากนั้นเลือก เพิ่มโมดูล
  3. ในกล่องโต้ตอบ เลือกโมดูล ให้เลือกโมดูล ผลการค้นหา แล้วเลือก ตกลง
  4. ในช่อง ปุ่มการเปรียบเทียบผลิตภัณฑ์ ของโมดูล ผลการค้นหา เลือกปุ่มจุดไข่ปลา (...) แล้วเลือก เพิ่มโมดูล
  5. ในกล่องโต้ตอบ เลือกโมดูล ให้เลือกโมดูล ปุ่มการเปรียบเทียบผลิตภัณฑ์ แล้วจากนั้น เลือก ตกลง
  6. ในบานหน้าต่างคุณสมบัติที่ด้านขวา ให้ตั้งค่าคุณสมบัติสำหรับโมดูล ปุ่มการเปรียบเทียบผลิตภัณฑ์
  7. เลือก บันทึก และจากนั้น เลือก แสดงตัวอย่าง เพื่อแสดงตัวอย่างหน้า
  8. เลือก แก้ไขให้เสร็จสิ้น เพื่อตรวจสอบในหน้า และจากนั้น เลือก เผยแพร่ เพื่อเผยแพร่

เพิ่มโมดูลแผงแสดงตัวอย่างการเปรียบเทียบผลิตภัณฑ์ลงในหน้าบนเว็บไซต์ของคุณ

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

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

คุณต้องเพิ่มโมดูลแผงแสดงตัวอย่างการเปรียบเทียบผลิตภัณฑ์ลงในหน้าด้วยตนเอง เพิ่มมอดูลการแสดงตัวอย่างแผงเดียวบนหน้าเท่านั้น ถ้าคุณเพิ่มอินสแตนซ์ของโมดูลหลายอินสแตนซ์ลงในหน้า โมดูลแรกจะปรากฏขึ้นและส่วนที่เหลือจะถูกละเว้น

สกรีนช็อตของแผงแสดงตัวอย่างการเปรียบเทียบผลิตภัณฑ์

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

ตั้งค่าจํานวนสูงสุดของผลิตภัณฑ์ที่จะแสดงในถาดเปรียบเทียบ

คุณสามารถตั้งค่าจํานวนสูงสุดของผลิตภัณฑ์ที่จะแสดงในถาดเปรียบเทียบโดยไปที่ การตั้งค่า > ไซต์ ส่วนขยาย ในตัวสร้างไซต์ คุณสามารถตั้งค่าขีดจํากัดสูงสุดที่แตกต่างกันสําหรับมุมมองเดสก์ท็อป และอุปกรณ์เคลื่อนที่หรือแท็บเล็ต ตามค่าเริ่มต้น จะไม่มีการบังคับใช้ขีดจํากัด ถ้าคุณไม่ได้ตั้งค่าขีดจํากัดสูงสุด

หมายเหตุ

เพื่อให้ได้รับประสบการณ์การใช้งานที่ดีที่สุด ให้ตั้งค่าจํานวนผลิตภัณฑ์สูงสุดในถาดเปรียบเทียบเป็น 2 สําหรับมุมมองพอร์ตอุปกรณ์เคลื่อนที่และ 4 สําหรับมุมมองพอร์ตเดสก์ท็อป การตั้งค่านี้จะลดจํานวนการเลื่อนแนวนอน

ในการตั้งค่าจํานวนสูงสุดของผลิตภัณฑ์ในถาดเปรียบเทียบ ให้ทําตามขั้นตอนเหล่านี้:

  1. ในตัวสร้างไซต์ ไปที่ การตั้งค่าไซต์ > ส่วนขยาย
  2. สําหรับ ผลิตภัณฑ์ในขีดจํากัดการเปรียบเทียบ - คุณสมบัติอุปกรณ์เดสก์ท็อป ให้ใส่จํานวนผลิตภัณฑ์สูงสุดที่ปรากฏในถาดเปรียบเทียบสําหรับมุมมองของเดสก์ท็อป
  3. สําหรับ ผลิตภัณฑ์ที่อยู่ในขีดจํากัดการเปรียบเทียบ - คุณสมบัติอุปกรณ์เคลื่อนที่และแท็บเล็ต ให้ใส่จํานวนผลิตภัณฑ์สูงสุดที่ปรากฏในถาดเปรียบเทียบสําหรับมุมมองอุปกรณ์เคลื่อนที่และแท็บเล็ต
  4. บนแถบคำสั่ง ให้เลือก บันทึกและเผยแพร่

สกรีนช็อตของการตั้งค่าไซต์เพื่อจํากัดผลิตภัณฑ์ในถาดเปรียบเทียบ