เมื่อใช้เครื่องมือสร้างร้านค้าเพื่อเพิ่มหรือแก้ไขหน้าแบบขั้นสูง คุณสามารถใช้วิดเจ็ต "สินค้าพร้อมข้อความ" เพื่อเพิ่มโปรโมทการขายที่น่าสนใจสำหรับสินค้าของคุณและดึงดูดการเข้าชมและการเรียกดูของลูกค้ามากยิ่งขึ้น
⚠️ ก่อนที่คุณจะเริ่มต้น:
- ปัจจุบันเครื่องมือสร้างหน้าร้านค้ารองรับเฉพาะธีม Ultra Chic, Kingsman, Varm และ Phillia
- หลังจากสร้างร้านค้าโดยใช้เครื่องมือสร้างร้านค้า หน้าเพจยังคงสามารถแสดงได้แม้ว่าคุณจะเปลี่ยนไปใช้ธีมอื่น แต่ไม่สามารถแก้ไขได้และเลย์เอาต์อาจมีความยุ่งเหยิง โปรดทราบสิ่งนี้ก่อนที่จะเผยแพร่หน้าเพจ
1. เพิ่มวิดเจ็ตสินค้าพร้อมข้อความ
ขั้นตอนที่ 1
ไปที่หน้าผู้ดูแลระบบ SHOPLINE > [การออกแบบร้านค้าออนไลน์] > [หน้าเพจ] และคลิกหน้าเพจแบบขั้นสูง/ปุ่มแก้ไขเพื่อเปิดหน้าการตั้งค่าหน้าเพจขึ้นมา
ขั้นตอนที่ 2
คลิกปุ่มวิดเจ็ต
ขั้นตอนที่ 3
คลิกที่วิดเจ็ตสินค้าพร้อมข้อความ (รายละเอียดสินค้า) ภายใต้สินค้า
ขั้นตอนที่ 4
คุณสามารถเพิ่มสินค้าและแก้ไขข้อความที่เกี่ยวข้องกันได้โดยการคลิกวิดเจ็ตสินค้าและข้อความเพื่อแก้ไขเนื้อหา
คลิกที่ไอคอน ทางด้านซ้ายเพื่อลากหรือเรียงลำดับ
ขั้นตอนที่ 5
คลิกสินค้าและคลิกปุ่ม +สินค้า จะมีหน้าต่างแสดงสินค้าปรากฏขึ้นมา
คุณสามารถค้นหาสินค้าที่คุณต้องการเพิ่มตามชื่อและแท็กในแถบค้นหา หรือเลื่อนลงเพื่อค้นหาโดยตรง เมื่อเลือกสินค้าได้แล้ว ให้คลิกปุ่มยืนยัน
*หมายเหตุ:
- หากคุณเพิ่มสินค้าที่เป็นสินค้าแบบซ่อนอยู่ โปรดตรวจสอบให้แน่ใจว่าได้เปิดใช้งาน "สินค้าที่ซ่อน" มิฉะนั้นระบบจะไม่สามารถแสดงภาพหรือราคาของสินค้าที่ซ่อนอยู่ได้
- หากสินค้าที่คุณเพิ่มไม่ได้เผยแพร่ ระบบจะไม่สามารถแสดงรูปภาพและราคาของสินค้าได้ (ดังแสดงในภาพด้านบน) โปรดไปที่ [สินค้าและหมวดหมู่] > [สินค้า] ในผู้ดูแลระบบร้านค้าเพื่อเผยแพร่สินค้าและดำเนินการแก้ไขต่อในตัวสร้างร้านค้า
ขั้นตอนที่ 6
คลิกข้อความและกรอกข้อความของสินค้าและปรับการตั้งค่าที่เกี่ยวข้อง ช่องต่อไปนี้สามารถปรับแก้ไขได้:
- ชื่อ: กรอกชื่อสินค้า สามารถปรับแต่งสไตล์เหล่านี้ได้ ลำดับการแสดงของการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
- แท็กหัวข้อ: มีทั้งหมด 6 ตัวเลือก ตั้งแต่แท็ก H1 - H6 ค่าเริ่มต้นของระบบจะเป็นแท็ก H3
- สีตัวหนังสือ: กดเปิดจานสีเพื่อเลือกสีของตัวหนังสือ หรือกรอกรหัสสี
- ขนาดตัวอักษร: สามารถเลือกขนาด 16/20/24/28/32 ได้ ขนาดจริงของตัวอักษรจะปรับตามขนาดตัวอักษรที่ตั้งค่าไว้ในการตั้งค่าร้านค้า
- ชื่อรอง: กรอกชื่อรองของสินค้า สามารถปรับแต่งสไตล์เหล่านี้ได้ ลำดับการแสดงของการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
- แท็กหัวข้อ: มีทั้งหมด 6 ตัวเลือก ตั้งแต่แท็ก H1 - H6 ค่าเริ่มต้นของระบบจะเป็นแท็ก H4
- สีตัวหนังสือ: กดเปิดจานสีเพื่อเลือกสีของตัวหนังสือ หรือกรอกรหัสสี
- ขนาดตัวอักษร: สามารถเลือกขนาด 14/16/18/20/22 ได้ ขนาดจริงของตัวอักษรจะปรับตามขนาดตัวอักษรที่ตั้งค่าไว้ในการตั้งค่าร้านค้า
- เนื้อหา: กรอกคำอธิบายของสินค้า คุณสามารปรับแต่งการตั้งค่าของสไตล์เหล่านี้ได้
- ขนาดตัวอักษร: สามารถเลือกขนาด 12/14/16/18/20 ได้ ขนาดจริงของตัวอักษรจะปรับตามขนาดตัวอักษรที่ตั้งค่าไว้ในการตั้งค่าร้านค้า
- สีตัวหนังสือ: กดเปิดจานสีเพื่อเลือกสีของตัวหนังสือ หรือกรอกรหัสสี
- รายการ: สามารถเพิ่มสัญลักษณ์แสดงรายการหัวข้อย่อย (bulleted lists) หรือเรียงลำดับรายการได้
- แก้ไขแบบเต็มหน้าจอ: คุณสามารถเปิดโหมดแก้ไขแบบเต็มหน้าจอได้ เพื่อให้การแก้ไขต่างๆ สะดวกมากยิ่งขึ้น
- ปุ่มข้อความ: กรอกข้อความของปุ่ม
- ลิงก์ไปที่: ใส่ลิงก์สำหรับปุ่ม มีสองวิธีในการเปิด URL:
คุณสามารถเลือกสองวิธีในการเปิดลิงก์ URL:
- หน้าต่างปัจจุบัน: เปิดหน้าเพจโดยตรงจากหน้าต่างปัจจุบัน
- หน้าต่างใหม่: เปิดหน้าเพจที่หน้าต่างใหม่
*หมายเหตุ:
-
- ลำดับการแสดงการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
- หากได้ปรับแก้เค้าโครงของหน้าเพจด้วยการใช้ custom liquid คุณจำเป็นต้องแก้ไขกฏสำหรับ custome liquid หลังจากที่ปรับเปลี่ยนการตั้งค่าสไตล์ของวิดเจ็ต
- ปัจจุบัน Shopper App ยังไม่รองรับการปรับแต่งสีข้อความและขนาดตัวอักษรของวิดเจ็ต
ขั้นตอนที่ 7
ดำเนินการต่อเพื่อปรับการตั้งค่าอื่นๆที่เกี่ยวข้อง
- ระยะขอบ: คุณสามารถปรับระยะขอบระหว่างหน้าเพจและรูปภาพและข้อความได้
- สัดส่วนรูปภาพ: ปัจจุบันยังรองรับการปรับสัดส่วนรูปภาพสำหรับเวอร์ชันเว็บเท่านั้น
- การจัดตำแหน่งข้อความ: ปรับตำแหน่งข้อความ (ซ้าย/กลาง/ขวา)
ขั้นตอนที่ 8
เมื่อการตั้งค่าเสร็จสิ้น คุณสามารถคลิกปุ่มบันทึกด้านล่าง และหน้าต่างดูตัวอย่างของวิดเจ็ตสินค้าพร้อมข้อความจะปรากฏขึ้นทางด้านขวา
ขั้นตอนที่ 9
เมื่อการตั้งค่าดังกล่าวเสร็จสมบูรณ์ คลิกปุ่มเผยแพร่ด้านบนขวามือ เพื่อที่ลูกค้าสามารถเห็นเนื้อหาใหม่ที่เพิ่มเข้าไปที่หน้าร้านค้า

อ่านเพิ่มเติม
- วิดเจ็ตหมวดหมู่ | เครื่องมือสร้างร้านค้า
- วิดเจ็ตตัวเลื่อนสินค้า | เครื่องมือสร้างร้านค้า
- วิดเจ็ตรายการสินค้า | เครื่องมือสร้างร้านค้า

ข้อคิดเห็น