ด้วยตัวแก้ไขหน้าเพจใหม่นี้ เมื่อเพิ่ม/แก้ไขหน้าเพจแบบขั้นสูง คุณสามารถใช้วิดเจ็ตคลังรูปภาพเพื่อทำให้แท็บของคุณสมบูรณ์ด้วยรูปภาพและทำให้ดูสวยงามมากยิ่งขึ้น
⚠️ ก่อนที่คุณจะเริ่มต้น:
- ปัจจุบันเครื่องมือสร้างหน้าร้านค้ารองรับเฉพาะธีม Ultra Chic, Kingsman, Varm และ Phillia
- หลังจากสร้างร้านค้าโดยใช้เครื่องมือสร้างร้านค้า หน้าเพจยังคงสามารถแสดงได้แม้ว่าคุณจะเปลี่ยนไปใช้ธีมอื่น แต่ไม่สามารถแก้ไขได้และเลย์เอาต์อาจมีความยุ่งเหยิง โปรดทราบสิ่งนี้ก่อนที่จะเผยแพร่หน้าเพจ
1. เพิ่มวิดเจ็ตรูปภาพ
ขั้นตอนที่ 1
ไปที่หน้าผู้ดูแลระบบ SHOPLINE > [การออกแบบร้านค้าออนไลน์] > [หน้าเพจ] และคลิก [หน้าเพจแบบขั้นสูง] คลิกปุ่มแก้ไขเพื่อเปิดหน้าการตั้งค่าหน้าเพจขึ้นมา
ขั้นตอนที่ 2
คลิกปุ่มวิดเจ็ต
ขั้นตอนที่ 3
เลือกวิดเจ็ตคลังรูปภาพ
ขั้นตอนที่ 4
1. อัปโหลดทีละหลายรายการ
ระบบจะจัดเรียงตามวันที่แก้ไขไฟล์รูปภาพ จากบนลงล่าง จากรูปที่แก้ไขล่าสุดไปจนถึงรูปที่แก้ไขก่อนหน้า
2.อัปโหลดทีละรายการ
คุณยังสามารถอัปโหลดรูปภาพทีละรายการได้และรูปตัวอย่างขนาดย่อจะถูกจัดเรียงในรูปแบบเดียวกับการอัปโหลดทีละหลายรายการ
*หมายเหตุ:
- ในขณะนี้รองรับการเพิ่มสูงสุด 16 รูปภาพ
- หากการอัปโหลดล้มเหลวเนื่องจากรูปแบบไฟล์, ปริมาณ และอื่นๆ การแจ้งเตือนดังต่อไปนี้อาจปรากฎขึ้นมา
- การอัปโหลดล้มเหลว
ข้อความแสดงข้อผิดพลาด: การอัปโหลดล้มเหลว (ไม่สามารถแสดงรูปตัวอย่างขนาดย่อได้) - การอัปโหลดล้มเหลวบางส่วน
ข้อความแสดงข้อผิดพลาด: การอัปโหลดล้มเหลวบางรูปภาพ (ในขณะที่แสดงรูปตัวอย่างขนาดย่อ ระบบจะข้ามไฟล์ที่เกิดข้อผิดพลาดโดยอัตโนมัติ)
- การอัปโหลดล้มเหลว
หากคุณได้เพิ่มวิดเจ็ตรูปภาพหลายรูปภาพ คลิกที่ไอคอน ทางด้านซ้ายเพื่อลากและเรียงลำดับรูปภาพใหม่
ขั้นตอนที่ 5
คลิกที่วิดเจ็ตรูปภาพเพื่ออัปโหลดรูปภาพแยกสำหรับอินเทอร์เฟซเดสก์ท็อปและมือถือ
*หมายเหตุ: ขอแนะนำให้ความกว้างของรูปภาพเวอร์ชันเดสก์ท็อปมากกว่า 2,000 พิกเซล และความกว้างของรูปภาพเวอร์ชันมือถือควรมากกว่า 1080 พิกเซล
คลิกที่เมนู “ภาษา” และรายการภาษาที่รองรับจะปรากฏขึ้นมา คุณสามารถอัปโหลดรูปภาพสำหรับแต่ละอินเทอร์เฟซภาษาแยกกันได้
ขั้นตอนที่ 6
การตั้งค่าเกี่ยวกับรูปภาพ
- การครอบรูปภาพ: เลือกส่วนของรูปภาพที่ต้องการครอปและแสดง (ซ้ายบน/บนกลาง/ขวาบน/ซ้ายกลาง/ตรงกลาง/ขวากลาง/ล่างกลาง/ขวาล่าง)
- ข้อความ Alt รูปภาพ: กรอกข้อความแสดงแทนรูปภาพ เพื่ออธิบายเนื้อหาของภาพซึ่งช่วยให้เครื่องมือค้นหาเข้าใจเนื้อหาของภาพได้ดีขึ้น หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับคำอธิบาย ALT ของรูปภาพ โปรดดูบทความนี้
- หน้ากาก: เลือกระดับการใส่หน้ากากให้กับรูปภาพ
- ชื่อ: กรอกชื่อสินค้า สามารถปรับแต่งสไตล์เหล่านี้ได้ ลำดับการแสดงของการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
- แท็กหัวข้อ: มีทั้งหมด 6 ตัวเลือก ตั้งแต่แท็ก H1 - H6 ค่าเริ่มต้นของระบบจะเป็นแท็ก H3
- สีตัวหนังสือ: กดเปิดจานสีเพื่อเลือกสีของตัวหนังสือ หรือกรอกรหัสสี
- ขนาดตัวอักษร: สามารถเลือกขนาด 16/20/24/28/32 ได้ ขนาดจริงของตัวอักษรจะปรับตามขนาดตัวอักษรที่ตั้งค่าไว้ในการตั้งค่าร้านค้า
- ลิงก์ URL: เพิ่มลิงก์ URL ให้กับรูปภาพ ซึ่งเมื่อลูกค้าคลิกที่รูปภาพ พวกเขาจะสามารถเข้าไปยังหน้าเพจใหม่ได้โดยตรง
คุณสามารถเลือกสองวิธีในการเปิดลิงก์ URL:
- หน้าต่างปัจจุบัน: เปิดหน้าเพจโดยตรงจากหน้าต่างปัจจุบัน
- หน้าต่างใหม่: เปิดหน้าเพจที่หน้าต่างใหม่
*หมายเหตุ:
- ลำดับการแสดงการตั้งค่าสไตล์คือ: การตั้งค่าสไตล์วิดเจ็ต > การตั้งค่าร้านค้า
- หากได้ปรับแก้เค้าโครงของหน้าเพจด้วยการใช้ custom liquid คุณจำเป็นต้องแก้ไขกฏสำหรับ custome liquid หลังจากที่ปรับเปลี่ยนการตั้งค่าสไตล์ของวิดเจ็ต
- ปัจจุบัน Shopper App ยังไม่รองรับการปรับแต่งสีข้อความและขนาดตัวอักษรของวิดเจ็ต
ขั้นตอนที่ 7
รองรับการตั้งค่าอื่นๆ
A. เต็มจอ
โหมดเต็มจอไม่ได้เปิดอยู่:
โหมดเต็มจอเปิดอยู่:
B. ระยะขอบ
ปรับระยะขอบระหว่างรูปภาพและหน้าเพจ
C. รูปภาพต่อแถว
คุณสามารถกำหนดจำนวนรูปภาพต่อแถวได้สำหรับเวอร์ชันเดสก์ท็อปและมือถือ
D. สัดส่วนรูปภาพ
คุณสามารถกำหนดสัดส่วนรูปภาพทั้งในเวอร์ชันเดสก์ท็อปและมือถือได้
- สัดส่วนภาพที่แนะนำสำหรับเวอร์ชันเดสก์ท็อป
- สี่เหลี่ยมผืนผ้า (อัตราส่วน 2:1 ) - ขนาดภาพเดี่ยวที่แนะนำ: 2000 x 1000 พิกเซล
- สี่เหลี่ยมผืนผ้า (อัตราส่วน 3:4 ) - ขนาดภาพเดี่ยวที่แนะนำ: 1500 x 2000 พิกเซล
- สีเหลี่ยมจัตุรัส (อัตราส่วน 1:1 ) - ขนาดภาพเดี่ยวที่แนะนำ: 2000 x 2000 พิกเซล
- สัดส่วนดั้งเดิมของรูปภาพ
- สัดส่วนภาพที่แนะนำสำหรับเวอร์ชันมือถือ
- สี่เหลี่ยมผืนผ้า (อัตราส่วน 2:1 ) - ขนาดภาพเดี่ยวที่แนะนำ: 1080 x 540 พิกเซล
- สี่เหลี่ยมผืนผ้า (อัตราส่วน 3:4 ) - ขนาดภาพเดี่ยวที่แนะนำ: 810 x 1080 พิกเซล
- สีเหลี่ยมจัตุรัส (อัตราส่วน 1:1 ) - ขนาดภาพเดี่ยวที่แนะนำ: 1080 x 1080 พิกเซล
- สัดส่วนดั้งเดิมของรูปภาพ
E. การจัดตำแหน่งข้อความ
ขั้นตอนที่ 8
ระหว่างขั้นตอนการตั้งค่า คุณสามารถคลิกปุ่มบันทึกด้านล่างเพื่อดูตัวอย่าง หรือคลิกดูตัวอย่างหน้าเพจทางด้านขวามือบน
*หมายเหตุ: คุณสามารถเลือกว่าจะดูตัวอย่างที่หน้าเวอร์ชันเดสก์ท็อปหรือมือถือได้
หรือคลิกปุ่มดูตัวอย่างที่ด้านบนขวามือเพื่อดูตัวอย่างหน้าร้านค้า
ขั้นตอนที่ 9
หลังจากเสร็จสิ้นการตั้งค่า คลิกปุ่มเผยแพร่ด้านบนขวามือ เพื่อที่ลูกค้าสามารถเห็นเนื้อหาใหม่ทั้งหมดที่หน้าร้านค้า
อ่านเพิ่มเติม
- แถบการประกาศ/การตั้งค่าส่วนหัว | เครื่องมือสร้างร้านค้า
- วิดเจ็ตข้อความ | เครื่องมือสร้างร้านค้า
- วิดเจ็ตรูปภาพพร้อมข้อความ | เครื่องมือสร้างร้านค้า
- วิดเจ็ตตัวเลื่อน | เครื่องมือสร้างร้านค้า
- วิดเจ็ตรายการสินค้า | เครื่องมือสร้างร้านค้า
- วิดเจ็ตตัวเลื่อนสินค้า | เครื่องมือสร้างร้านค้า
- การตั้งค่า SEO | เครื่องมือสร้างร้านค้า
- การตั้งค่าส่วนท้าย | เครื่องมือสร้างร้านค้า
ข้อคิดเห็น