Magento E-Commerce ร้านค้าออนไลน์สำเร็จรูป

12.เพิ่มสินค้าประเภท Configurable products และเพิ่ม Attribute

admin | January 26, 2012 | 3 Comments

การเพิ่ม Attribute ซึ่งเปรียบเหมือนเงื่อนไขในการเลือกซื้อสินค้าที่หน้าร้าน เช่น ระบุ สี, ขนาด, รูปทรง และอื่นๆ บางสินค้าจำเป็นต้องระบุมากกว่า 1 เงื่อนไข เช่น ต้องเลือกสี พร้อมกับขนาด เป็นต้น บางสินค้ามีเงื่อนไขพร้อมกันมากมาย

สำหรับ Configurable Product จะนำเงื่อนไข (Attribute) ที่เราได้เซตไว้ ยกตัวอย่างกรณีศึกษา เช่น ร้านค้าขาย ลิปสติก จะมีโค้ดสี ให้เลือกซื้อกว่า 100 สี ,

และในตัวอย่างที่นี้ ร้านเราจำหน่ายรองเท้า จะมีสีอยู่สามสีในสต๊อก คือสี ชมพู , ดำ และแดง แต่ละสี มีจำนวนที่ไม่เท่ากัน

และที่หน้าร้าน ผู้ซื้อสามารถเลือกสีก่อนสั่งซื้อได้ และ ถ้าสั่งซื้อสีไหนที่จำนวนเกินกว่าที่สีนั้นสต๊อกมีอยู่ หน้าร้านจะแจ้งทันทีว่า “สินค้าไม่พอจำหน่าย”

แล้ว เมื่อผู้ซื้อสั่งซื้อเสร็จแล้ว ที่หลังร้าน เจ้าของจะเห็นทันทีว่าสีไหน ถูกซื้อไป และจำนวนจะลดลง เพื่อสอดคล้องกับของในสต๊อก แบบนี้ จะดีไม่น้อยใช่มั้ยครับ :-)

 

เราจะมี Attribute เดิม ที่ทางโปรแกรมสร้างให้มาแล้วแต่ตอนแรก ซึ่งสามารถศึกษาแต่ละตัวได้ แต่ในที่นี้ เราจะทำการสร้างขึ้นมาใหม่ โดยเราตั้งใจ ให้สินค้าที่เป็นรองเท้าชนิดหนึ่ง มีการให้เลือกสี (หรือพร้อมขนาด) ก่อนทำการสั่งซื้อ

ไปที่เมนู Catalog > Attributes > Manage Attributes > Add New Attribute

เมนู Properties > Attribute Properties

Attribute Code: ใส่ชื่อ ต้องไม่ซ้ำกัน เช่น color2

Catalog input type: เป็น Dropdown เป็นต้น

Values Required: Yes เพื่อให้จำเป็นต้องเลือกก่อน ถึงจะสั่งซื้อที่หน้าร้านได้

Apply To: เลือก Selected Product Types แล้วเลือก Simple Product, Grouped Product, Configurable Product

Use to Create Configurable Product: Yes เพื่อให้ Attribute นี้เป็นตัวแปรในส่วนของ Configurable product (ในที่นี้ คือการเลือก สี )

เมนู Manage Label / Options 1.

1. พิมพ์ Color ลงในช่อง เพื่อเป็นชื่อเรียก 2.

2. คลิก Add Option ตามจำนวนที่เราต้องการป้อนค่า

3. พิมพ์ชื่อสี เช่น Pink, Black, Red

4. ป้อนลำดับ โดยค่าตั้งต้นแล้วเราไม่จำเป็นต้องใส่อะไร ซึ่งโปรแกรมจะเรียงตามลำดับของตัวอักษร a-z หรือตัวเลข 0-9 แต่กรณีถ้าเราต้องการบังคับให้ลำดับไหนขึ้นก่อนหลัง ก็ให้ป้อนค่า 0,1,2,3,… ตามลำดับ

คลิก Save Attribute

ไปที่เมนู Catalog > Attributes > Manage Attribute Set > Add New Set

เราจะทำการเพิ่มชื่อประเภทของหมวดหมู่ Attribute ด้วยตัวเอง จากของเดิม จะเห็นว่ามี Default, Cell Phones, Cameras เป็นต้น ซึ่งแต่ละอัน ก็มี Attribute แตกต่างกันออกไป แล้วแต่ที่เราจะเพิ่ม ในที่นี้เราจะเพิ่มชื่อ My Shoes ลงไปเป็น Attribute Set อันใหม่

 

Name: พิมพ์ชื่อที่ต้องการ คือ My Shoes

Based On: เลือก Default หมายถึงว่า เราอยากให้หมวดหมู่ Attribute นี้ ตรงกับหมวดหมู่ Attribute อันไหน ก็ให้เลือกอันนั้นก่อน

คลิก Save Attribute Set

จากภาพ ในฝั่งของ Unassigned Attributes จะพบ color2 ที่เราสร้างมา ให้ลากมาวางฝั่งของ Groups

เสร็จต่อมาให้ลาก color ในฝั่ง Group ไปยังฝั่งของ Unassigned Attributes แทน

คลิก Save Attribute Set

ไปที่เมนู Catalog > Manage Products > Add Product

Attribute Set: เลือก My Shoes

Product Type: เลือก Configurable Product

คลิก Continue

จะเห็นว่ามี Attribute Color ให้เลือกถูก เนื่องจากเราได้ตั้งให้ถูกใช้ใน Configurable Product ในตอนสร้าง Attribute color2 นี้แล้ว

คลิก Continue

เสร็จแล้วทำการใส่รายละเอียดค่าต่างๆ ตามบทที่ 11 ที่เราได้เรียนรู้มา

ต่อมาทำการเพิ่มสินค้า คราวนี้เราจะมาเพิ่มสินค้าโดยเลือก

Attribute Set: เลือก My Shoes

Product Type: เลือก Simple Product

คลิก Continue

ทำการใส่รายละเอียดค่าต่างๆ ของสินค้า ที่ได้เรียนรู้ในบทที่ 11ซึ่ง แต่มีข้อแตกต่างบางจุดที่ควรเซตดังนี้

- SKU: ควรระบุมีชื่อสีตามหลังด้วย เพื่อให้ง่ายต่อการค้นหา เช่น SK01_Pink

- Visibility: Not Visible Individually เพื่อให้สินค้ารายการนี้ ไม่ถูกมองเห็นที่หน้าร้าน

- Color: ปรับเลือก ตามชื่อ ในที่นี้ ต้องเลือกเป็น Pink (ที่เราได้สร้างไว้ในตอนต้น)

- Price: ใส่ค่าเดียวกันกับ Configurable Product

- Images: ดังนั้นไม่จำเป็นต้องใส่ภาพใดๆเลย

- Description: ก็ไม่จำเป็นต้องใส่ค่าใดๆ อาจใส่เพียงเครื่องหมาย .

- Qty: จำเป็นต้องป้อน และ ในความต้องการของเรา เราจำเป็นต้องป้อนให้สอดคล้องกับสต็อคของ ของรองเท้าสีชมพูนี้ที่มีอยู่จริง สีอื่นๆ จะไม่เกี่ยวข้อง ทันที

- Stock Availability: ปรับเป็น In Stock

- Website: เลือก My e-commerce

- Categories: ไม่จำเป็นต้องเลือกที่ใดๆ

ทำการทำซ้ำ (Duplicate) แล้ว แก้ SKU: เป็นค่าอื่นๆต่อไป คือ Black, Red  / Color: เลือกสีที่ตรงกับชื่อ SKU /  Qty & Stock Availability ปรับตามที่เป็นตามจริง เฉพาะๆของสีนั้นๆ

สุดท้ายกลับไปแก้ไขยัง Configurable Product อีกครั้ง

 

เมนู Associated Products

1. ปรับเลือก Any  2.

2. คลิก Search

3. เลือกถูกทั้งหมด

จะเห็นว่า Attribute Color2 ที่เราได้ทำไว้ ได้นำเข้ามาทั้งหมดแล้ว มี Option: Pink, Black, Red ดังกล่าว เราจะเห็นช่อง Price ซึ่งสามารถป้อนค่าได้ เช่นสีแดงราคาจะเพิ่มอีก 200 บาท เราก็ป้อนตัวเลข 200 บาทลงไปในช่อง ของ Option: Red

คลิก Save

 

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

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

โดยสร้าง Simple Product แล้ว ไปที่เมนู Custom Options แล้วทำการเพิ่มรายละเอียด ดังภาพ ก็สามารถสร้างหน้าร้านตรงตามความต้องการได้ครับ เพียงแต่ เราไม่สามารถกำหนดได้เลยว่า สต๊อกของสีไหน ถูกลดลงไปเท่าไหร่ เท่านั้นเอง ^^

Category: สอน Magento ฟรี

About the Author (Author Profile)

E-Commerce Consulting & Solutions, Magento Expert

Comments (3)

Trackback URL | Comments RSS Feed

  1. Saranyu says:

    สวดยอดเลยครับลวดเพี่ย ติดตามผลงานอยู่นะครับ

  2. Popkung says:

    รายละเอียดสุดยอดเลยครับ กำลังหาข้อมูลอยู่พอดี

    แต่มีเรื่องสงสัยครับ ถ้าเลือก Attribute แล้ว ให้มันเปลี่ยนราคาด้วยเป็นได้มั้ยครับ

    อย่างเช่นเลือก option แล้ว บวกราคาเพิ่มครับ

    • admin says:

      ได้ครับ
      Simple product หลายๆตัว ซึ่งราคาแตกต่างกันไปก็ได้ ในที่นี้คือ สี ที่แตกต่างกันไป เราก็กำหนดราคาของ Simple product แต่ละสี ค่าไม่เท่ากัน เป็นต้น

      ส่วนกรณี ที่ไม่เล่นในแบบ Configurable product เราก็สามารถใช้ Simple product ก็ได้ เช่นกัน
      ตามรูปสุดท้าย ของบทนี้ ที่เราเข้าไปที่เมนู Custom Options จะมีช่องให้ใส่ราคา ก็ให้ใส่ลงไปในช่องนี้ แล้วดูผลลัพธ์เลยครับผม

Leave a Reply