ไม่มีสินค้าในตะกร้า
WooCommerce
วิธีลงสินค้าแบบ Variation Swatches บนธีม Flatsome โดยไม่ใช้ปลั๊กอิน
Variation Swatches Product คือการลงสินค้าแบบเลือกรูปแบบได้ เช่น เลือกสี เลือกขนาด เป็นต้น แต่แทนทีตัวเลือกจะเป็นแค่รายการที่เป็นตัวอักษรเรียบๆ แต่เราจะสร้างตัวเลือกรายการเป็นรูปแบบที่เราต้องการ เช่น เลือกสี ก็แสดงเป็นปุ่มสี ให้ลูกค้าได้กดเลือกเองได้เลย
ตัวอย่าง
สินค้า Variation Product ทั่วไป
สินค้า Variation Product แบบ Swatches
สินค้าที่ใช้ตัวเลือก Variation Swatches จะดูมีความสนใจ ดูน่าคลิก เลือกซื้อสินค้ามากกว่านั้นเอง
วิธีการตั้งค่า Variation Swatches บนธีม Flatsome มีดังนี้
1.เช็คเวอร์ชั่นของธีม Flatsome ก่อน
ธีม Flatsome ที่จะใช้งานฟัง Variation Swatches ได้ต้องเป็นธีม Flatsome เวอร์ชั่น 3.14 ขึ้นไปนะ ดังนั้น เราต้องเช็คเวอร์ชั่นของธีมตัวเองก่อน
วิธีเช็คว่าธีมที่เราใช้เป็นเวอร์ชั่นไหน ให้เราคลิกที่เมนูหลังบ้านตรงคำว่า Flatsome ได้เลย
ถ้าใครใช้ธีมที่เป็นเวอร์ชั่นต่ำกว่า 3.14 ก็ต้องอัพเดทธีมก่อนนะ ถ้าใครอัพเดทธีมไม่เป็นอ่านบทความนี้ก่อนครับ วิธีอัพเดทธีม Flatsome แบบไม่ต้องใส่ License
2. สร้างคุณสมบัติของสินค้า (attributes)
Product attributes คือ การจัดหมวดหมู่สินค้า ที่มีคุณสมบัติเฉพาะเจาะจง ตัวอย่างเช่น การจัดเรียงสินค้าตาม สี ไซต์ ขนาด ยี้ห้อ สถานที่ ฯลฯ
ในบทความนี้เราจะยกตัวอย่างการสร้าง attribute สัก 2 แบบที่เป็นที่นิยมกัน คือ สี และ ขนาด ซึ่งมีวิธีการสร้างดังนี้
ไปที่เมนู Product > attribute
ช่อง name: ใส่ชื่อคุณสมบัติ เช่น color / size หรือจะใส่เป็นภาษาไทยก็ได้ เช่น สี / ไซส์
ช่อง Type: เลือกรูปแบบการแสดงผลเลือกได้ 3 แบบคือ UX Color / UX Image / UX Label
ช่อง Swatch size: คือ ขนาดของ Swatches ที่เราต้องการแสดงว่าอยากให้มีขนาดใหญ่ กลาง หรือเล็ก
ช่อง Swatch shape: คือ เลือกหน้าตาที่จะแสดงว่าจะให้เป็นสีเหลี่ยม หรือวงกลม
ลองกดเล่นดูนะ จากนั้นคลิก Add attribute ให้เรียบร้อย
ให้พวกเราลองสร้าง attribute มาสัก 2 แบบ คือ Colors กับ Size ผลลัพธ์ที่ได้ก็จะเป็นแบบนี้ครับ
3. ตั้งค่า Configure terms (เงื่อนไขของคุณสมบัติ)
คลิกที่ Configure terms.
ใส่ชื่อสีที่เราต้องการลงไป และเลือกค่าสีที่ต้องการ
ผลลัพธ์ที่ได้จากการตั้งค่าส่วนนี้ก็จะเป็นแบบนี้ครับ
Product Colors
Product Size
4. ลงสินค้าประเภท Variable product
ไปที่ Product > add new > เลือกลงสินค้าแบบ Variable product > ดูที่หัวข้อ Attribute > คุณสมบัติที่เราสร้างไว้ในที่นี้ก็จะมีอยู่ 2 คุณสมบัติคือ Colors กับ Size
ติ๊กเลือกตามรูปทั้ง 2 จุด จากนั้นเลือก Value ค่าสีที่เราสร้างไว้ ว่าสินค้าตัวนี้มีสีให้เลือกสีไหนบ้าง
ผลลัพธ์ที่ได้ก็จะเป็นแบบนี้ กด Save ให้เรียบร้อย
จากนั้นให้เลือกหัวข้อ Variation > คลิกเลือก Generate variation
จากนั้นให้เข้าไปใส่รายละเอียดสินค้าเพิ่มเติมให้เรียบร้อย เช่น รูปภาพหน้าปก ราคา เป็นต้น ไล่ทำให้ครบทุก Variation ที่เราสร้าง
เมื่อตั้งค่าทุกอย่างเสร็จก็ให้กด Save และกดเผยแพร่สินค้าตัวนั้นได้เลย จากนั้นลองไปดูผลลัพธ์ของสินค้าที่เราได้ทำ Variation Swatches
สรุป
Variation Swatches คือฟังชั่นมาใหม่ของธีม Flatsome เวอร์ชั่น 3.14 ขึ้นไป เพื่อทำให้หน้าสินค้าของเราดูมีความน่าสนใจมากขึ้น และเราสามารถทำฟังชั่นนี้ได้โดยไม่จำเป็นต้องใส่ปลั๊กอินเพิ่มเติมเลยนั้นเอง
อ่านบทความที่เกี่ยวข้องเพิ่มเติม
