วิดเจ็ตข้อความ | เครื่องมือสร้างร้านค้า

e-commerce_social_commerce__1_.png

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

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

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

 

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

ขั้นตอนที่ 1

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

1.png

 

ขั้นตอนที่ 2

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

2.png

 

ขั้นตอนที่ 3

เลือกวิดเจ็ต “ข้อความ”

3.png

 

ขั้นตอนที่ 4

ระบบจะเพิ่มชุดข้อความ 1 ชุดโดยค่าเริ่มต้น คลิกปุ่มข้อความเพื่อเพิ่มข้อความเพิ่มเติม

*หมายเหตุ: ปัจจุบันรองรับการเพิ่มได้สูงสุด 4 ชุดข้อความ

4.png

 

หากคุณได้เพิ่มวิดเจ็ตข้อความหลายชุด คลิกที่ไอคอน ___2022-06-30___10.34.59.png ทางด้านซ้ายเพื่อลากและเรียงลำดับ

5.png

 

ขั้นตอนที่ 5

เลือกข้อความเพื่อเปิดการตั้งค่าข้อความ

  • ชื่อ: กรอกชื่อสินค้า สามารถปรับแต่งสไตล์เหล่านี้ได้ ลำดับการแสดงของการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
    • แท็กหัวข้อ: มีทั้งหมด 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:
    • หน้าต่างปัจจุบัน: เปิดหน้าเพจโดยตรงจากหน้าต่างปัจจุบัน
    • หน้าต่างใหม่: เปิดหน้าเพจที่หน้าต่างใหม่

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

*หมายเหตุ:

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

 

ขั้นตอนที่ 6

รองรับการตั้งค่าอื่นๆ

A. การจัดตำแหน่งข้อความ

8.png

 

B. ระยะขอบ

สามารถปรับระยะขอบระหว่างข้อความและช่องว่างเว็บไซต์ได้

9.png

 

ขั้นตอนที่ 7

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

*หมายเหตุ: คุณสามารถเลือกว่าจะดูตัวอย่างที่หน้าเวอร์ชันเดสก์ท็อปหรือมือถือได้

10.png11.png

 

หรือคลิกปุ่มดูตัวอย่างที่ด้านบนขวามือเพื่อดูตัวอย่างหน้าร้านค้า

12.png

 

ขั้นตอนที่ 8

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

13.png

 

Read more

 

 

 

 

 

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

ข้อคิดเห็น