วิดเจ็ตสินค้าพร้อมข้อความ (รายละเอียดสินค้า) | เครื่องมือสร้างร้านค้า

e-commerce_social_commerce__1_.png

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

⚠️ ก่อนที่คุณจะเริ่มต้น:

  • ปัจจุบันเครื่องมือสร้างหน้าร้านค้ารองรับเฉพาะธีม Ultra Chic, Kingsman, Varm และ Phillia
  • หลังจากสร้างร้านค้าโดยใช้เครื่องมือสร้างร้านค้า หน้าเพจยังคงสามารถแสดงได้แม้ว่าคุณจะเปลี่ยนไปใช้ธีมอื่น แต่ไม่สามารถแก้ไขได้และเลย์เอาต์อาจมีความยุ่งเหยิง โปรดทราบสิ่งนี้ก่อนที่จะเผยแพร่หน้าเพจ

 

1. เพิ่มวิดเจ็ตสินค้าพร้อมข้อความ

ขั้นตอนที่ 1

ไปที่หน้าผู้ดูแลระบบ SHOPLINE > [การออกแบบร้านค้าออนไลน์] > [หน้าเพจ] และคลิกหน้าเพจแบบขั้นสูง/ปุ่มแก้ไขเพื่อเปิดหน้าการตั้งค่าหน้าเพจขึ้นมา

1.png

ขั้นตอนที่ 2

คลิกปุ่มวิดเจ็ต

2.png

ขั้นตอนที่ 3

คลิกที่วิดเจ็ตสินค้าพร้อมข้อความ (รายละเอียดสินค้า) ภายใต้สินค้า

1.png

ขั้นตอนที่ 4

คุณสามารถเพิ่มสินค้าและแก้ไขข้อความที่เกี่ยวข้องกันได้โดยการคลิกวิดเจ็ตสินค้าและข้อความเพื่อแก้ไขเนื้อหา

2.png

คลิกที่ไอคอน PWT_CN_4-0.png ทางด้านซ้ายเพื่อลากหรือเรียงลำดับ

3.png

 

ขั้นตอนที่ 5

คลิกสินค้าและคลิกปุ่ม +สินค้า จะมีหน้าต่างแสดงสินค้าปรากฏขึ้นมา

4.png

 

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

6.png

 

*หมายเหตุ: 

  • หากคุณเพิ่มสินค้าที่เป็นสินค้าแบบซ่อนอยู่ โปรดตรวจสอบให้แน่ใจว่าได้เปิดใช้งาน "สินค้าที่ซ่อน" มิฉะนั้นระบบจะไม่สามารถแสดงภาพหรือราคาของสินค้าที่ซ่อนอยู่ได้ 7.png
  • หากสินค้าที่คุณเพิ่มไม่ได้เผยแพร่ ระบบจะไม่สามารถแสดงรูปภาพและราคาของสินค้าได้ (ดังแสดงในภาพด้านบน) โปรดไปที่ [สินค้าและหมวดหมู่] > [สินค้า] ในผู้ดูแลระบบร้านค้าเพื่อเผยแพร่สินค้าและดำเนินการแก้ไขต่อในตัวสร้างร้านค้า

 

ขั้นตอนที่ 6

คลิกข้อความและกรอกข้อความของสินค้าและปรับการตั้งค่าที่เกี่ยวข้อง ช่องต่อไปนี้สามารถปรับแก้ไขได้:

  • ชื่อ: กรอกชื่อสินค้า สามารถปรับแต่งสไตล์เหล่านี้ได้ ลำดับการแสดงของการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
    • แท็กหัวข้อ: มีทั้งหมด 6 ตัวเลือก ตั้งแต่แท็ก H1 - H6 ค่าเริ่มต้นของระบบจะเป็นแท็ก H3
    • สีตัวหนังสือ: กดเปิดจานสีเพื่อเลือกสีของตัวหนังสือ หรือกรอกรหัสสี
    • ขนาดตัวอักษร: สามารถเลือกขนาด 16/20/24/28/32 ได้ ขนาดจริงของตัวอักษรจะปรับตามขนาดตัวอักษรที่ตั้งค่าไว้ในการตั้งค่าร้านค้า

Screen Shot 2024-06-05 at 11.38.37 AM.png

  • ชื่อรอง: กรอกชื่อรองของสินค้า สามารถปรับแต่งสไตล์เหล่านี้ได้ ลำดับการแสดงของการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
    • แท็กหัวข้อ: มีทั้งหมด 6 ตัวเลือก ตั้งแต่แท็ก H1 - H6 ค่าเริ่มต้นของระบบจะเป็นแท็ก H4
    • สีตัวหนังสือ: กดเปิดจานสีเพื่อเลือกสีของตัวหนังสือ หรือกรอกรหัสสี
    • ขนาดตัวอักษร: สามารถเลือกขนาด 14/16/18/20/22 ได้ ขนาดจริงของตัวอักษรจะปรับตามขนาดตัวอักษรที่ตั้งค่าไว้ในการตั้งค่าร้านค้า

Screen Shot 2024-06-05 at 11.41.02 AM.png

  • เนื้อหา: กรอกคำอธิบายของสินค้า คุณสามารปรับแต่งการตั้งค่าของสไตล์เหล่านี้ได้
    • ขนาดตัวอักษร: สามารถเลือกขนาด 12/14/16/18/20 ได้ ขนาดจริงของตัวอักษรจะปรับตามขนาดตัวอักษรที่ตั้งค่าไว้ในการตั้งค่าร้านค้า
    • สีตัวหนังสือ: กดเปิดจานสีเพื่อเลือกสีของตัวหนังสือ หรือกรอกรหัสสี
    • รายการ: สามารถเพิ่มสัญลักษณ์แสดงรายการหัวข้อย่อย (bulleted lists) หรือเรียงลำดับรายการได้
    • แก้ไขแบบเต็มหน้าจอ: คุณสามารถเปิดโหมดแก้ไขแบบเต็มหน้าจอได้ เพื่อให้การแก้ไขต่างๆ สะดวกมากยิ่งขึ้น

Screen Shot 2024-06-04 at 5.49.21 PM.png

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

Screen Shot 2024-06-05 at 11.02.35 AM.png

*หมายเหตุ:

    • ลำดับการแสดงการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
    • หากได้ปรับแก้เค้าโครงของหน้าเพจด้วยการใช้ custom liquid คุณจำเป็นต้องแก้ไขกฏสำหรับ custome liquid หลังจากที่ปรับเปลี่ยนการตั้งค่าสไตล์ของวิดเจ็ต
    • ปัจจุบัน Shopper App ยังไม่รองรับการปรับแต่งสีข้อความและขนาดตัวอักษรของวิดเจ็ต

 

ขั้นตอนที่ 7

ดำเนินการต่อเพื่อปรับการตั้งค่าอื่นๆที่เกี่ยวข้อง

  • ระยะขอบ: คุณสามารถปรับระยะขอบระหว่างหน้าเพจและรูปภาพและข้อความได้
  • สัดส่วนรูปภาพ: ปัจจุบันยังรองรับการปรับสัดส่วนรูปภาพสำหรับเวอร์ชันเว็บเท่านั้น
  • การจัดตำแหน่งข้อความ: ปรับตำแหน่งข้อความ (ซ้าย/กลาง/ขวา)

10.png

 

ขั้นตอนที่ 8

เมื่อการตั้งค่าเสร็จสิ้น คุณสามารถคลิกปุ่มบันทึกด้านล่าง และหน้าต่างดูตัวอย่างของวิดเจ็ตสินค้าพร้อมข้อความจะปรากฏขึ้นทางด้านขวา

11.png

ขั้นตอนที่ 9

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

12.png

อ่านเพิ่มเติม



 

 

 

บทความนี้มีประโยชน์หรือไม่
0 จาก 0 เห็นว่ามีประโยชน์
มีคำถามเพิ่มเติมหรือไม่ ส่งคำร้องขอ

ข้อคิดเห็น