เพิ่ม attributes ให้กับสินค้าใน prestashop

attributes เป็นการเพิ่มคุณลักษณะเพิ่มเติมให้กับสินค้าของเราใน prestashop เช่น สี ความจุ ขนาด ฯ โดยสามารถกำหนดราคาเฉพาะคุณลักษณะได้ด้วย สมมติ ipod ขนาด 8gb ราคา 500 และ 16gb ราคา 1,000 โดยเราไม่ต้องสร้างสินค้าใหม่ขึ้นมาเป็นสองชิ้นแต่เราจะใช้ attributes เข้ามาช่วย

ตัวอย่างนี้ผมจะสอนเกี่ยวกับการกำหนดสีของสินค้า โดยลูกค้าจะสามารถเลือกได้ว่าจะเอาสีไหน แล้วถ้าเลือกขนาดนี้จะราคาเท่าไร ตัวอย่างนี้จะเป็น iPod shuffle สีน้ำเงิน เขียว และชมพู ขนาดจะมี 8gb และ 16gb
1. ให้เราไปหน้า admin ของ prestashop จากนั้นไปที่เมนู Catalog >> Attributes and groups จากนั้นทำการเพิ่มกลุ่มของคุณลักษณะก่อน
prestashop

2. ใส่รายละเอียดลงไป ในหัวข้อ กลุ่มสี: ให้ติ้กถูกด้วยครับเดียวเราจะมาเล่น Color picker กัน
prestsahop

3. คลิกเพิ่มคุณลักษณะ แล้วทำการเพิ่มคุณลักษณะ (attributes) ลงในกลุ่มที่เราสร้างขึ้น ในที่นี้ผมก็ใส่ น้ำเงิน เขียว ชมพู
prestashop

4. ที่นี่เราจะมาเพิ่มในส่วนของ Color picker กันให้คลิกที่กลุ่ม color เราจะเจอกับ attributes ที่เราทำการเพิ่มเข้ามาจากนั้นคลิกแก้ไข
prestashop

5. กำหนดค่าสีลงไปให้ใกล้เคียงกับสินค้าของเรา เช่น ชมพู ก็จะเป็น #FF00E2 โดยค่าสีจะเป็นโหมดของ HTML สามารถดูได้จาก http://html-color-codes.com/
prestashop

กำหนดเสร็จจะได้ดังรูป
prestashop

6. เพิ่มกลุ่ม Diskspace มาอีก 1 กลุ่มและใส่ attributes เป็น 8gb และ 16gb แต่หัวข้อ กลุ่มสี: ในข้อ 2 กลุ่มนี้ให้ติ้กผิดไปครับคือไม่เลือกนั้นเอง เสร็จแล้วจะได้ดังรูป
prestashop

7. ตอนนี้เราก็กำหนด attributes ครบแล้วให้เราไปทำการแก้ไขสินค้าของเรา ในที่นี้คือ iPod shuffle โดยผมได้ใส่รูป iPod shuffle ครบทั้งสามสีไว้แล้ว ให้ไปที่ การจัดกลุ่ม แล้วทำการเพิ่มคุณลักษณะที่ต้องการของสินค้าลงไป ดังตัวอย่างในรูปจะเป็น ipod shuffle สีชมพู ขนาด 8gb รูปภาพเราก็ติ้กที่สีชมพูด้วย เพราะเมื่อลูกค้าคลิกที่ attributes ตัวนี้รูปภาพจะเปลี่ยนเป็นสีชมพูตาม แล้วกด Add This Combinations
prestashop

8. ต่อมาผมก็จะทำการเพิ่ม สีชมพู ขนาด 16gb ให้ราคาเพิ่มขึ้น 800 บาทดังรูป
prestsahop

9. จากนั้นกำหนด attributes ให้ครบตามต้องการ
prestashop

10. เลื่อนลงมาด้านล่างสุดที่หัวข้อ Color picker: ให้เลือกกลุ่ม color แล้วกด ตกลง เพื่อใช้งาน Color picker กับสินค้าคัวนี้
prestashop

เสร็จละครับขั้นตอนในการใช้งาน attributes ของ prestashop เรามาดูหน้าร้านกันว่าจะเป็นยังไง
เมื่อคลิกเข้ามาชมสินค้า
prestashop

ลูกค้าสามารถคลิกเลือกสีได้จาก Color picker เมื่อทำการคลิกเลือกสีรูปภาพสินค้าจะเปลี่ยนไปตามที่เราได้ตั้งไว้ข้างต้น เช่น คลิกสีน้ำเงิน รูปภาพก็เปลี่ยนเป็นสีน้ำเงิน
prestashop

เมื่อเลือกขนาดความจุ ราคาก็จะเปลี่ยนตาม
prestashop

บทความแนะนำ
    blog comments powered by Disqus