feature image create plugin for landing page sell product in one page without using woocommerce

เขียนปลั๊กอิน Landing Page ขายสินค้าในหน้าเดียวโดยไม่ต้องใช้ WooCommerce

ติดต่องาน

ความต้องการของลูกค้า ( Requirement )

  • ต้องการสร้างสินค้า 1 ชิ้นต่อ 1 เว็บ landing page ให้ขายสินค้าในหน้าเดียวโดย ไม่ใช้ WooCommerce มีรายละเอียดความต้องการ ดังนี้
    1. ต้องการสร้างสินค้าและใส่รายละเอียดในเมนู Post
    2. ในหน้าเว็บต้องการให้มีข้อมูลสินค้า ได้แก่
      • ชื่อสินค้า
      • รูปภาพสินค้า
      • ราคาปกติ
      • ราคาลด
      • ค่าจัดส่ง
      • ขนาดสินค้า
      • สีของสินค้า
      • โปรโมชั่นจำนวนสั่งซื้อ
        • จำนวนสั่งซื้อ
        • จำนวนแถม
    3. สามารถตั้งค่าสินค้าแต่ละรูปแบบได้ โดยมีสินค้าทั้งหมด 4 รูปแบบ ได้แก่
      • สินค้าปกติ
      • สินค้ามีให้เลือกขนาด
      • สินค้ามีให้เลือกสี
      • สินค้ามีให้เลือกขนาดและสี
    4. สามารถเพิ่มโปรโมชั่นจำนวนสั่งซื้อของสินค้าที่หลังบ้านได้
    5. ต้องการให้หน้าสินค้าที่หน้าบ้าน แสดงตัวเลือก สี และ ขนาด (หากสินค้านั้นตั้งค่าให้มีการเลือกสีและขนาด)
    6. เมื่อลูกค้าคลิกเลือกโปรโมชั่นที่ต้องการสั่งซื้อแล้ว จะมี “สรุปยอดการสั่งซื้อ” แสดงทันที โดยไม่ต้องเสียเวลารอให้ขึ้นหน้าเว็บใหม่
    7. ต้องการให้หน้าข้อมูลการจัดส่งสินค้า มีรายละเอียดได้แก่
      • ชื่อ-นามสกุล
      • เบอร์โทร
      • บ้านเลขที่
      • จังหวัด
      • อำเภอ
      • ตำบล
      • ไปรษณีย์
      • หมายเหตุ
    8. ต้องการให้หน้าสั่งซื้อสำเร็จ (หน้า Thank you) มีรายละเอียด ได้แก่
      • รหัสการสั่งซื้อ
      • ชื่อลูกค้า
      • เบอร์โทร
      • ที่อยู่
      • ชื่อสินค้า
      • จำนวน ( แจ้งตามโปร เช่น 3 ชิ้นฟรี 1 ชิ้น เป็นต้น)
      • วิธีชำระเงิน ( เก็บเงินปลายทางเท่านั้น )
    9. ต้องการให้มี “ปุ่มแก้ไขข้อมูลการจัดส่งสินค้า” ในหน้าสั่งซื้อสำเร็จ (หน้า Thank you)
    10. ต้องการให้แอดมินสามารถดูรายการคำสั่งซื้อได้ที่หลังบ้าน
    11. ต้องการให้สามารถแก้ไขข้อความในหน้าสั่งซื้อสำเร็จได้

ผลลัพธ์การโม (Modified)

  • เขียนปลั๊กอิน WordPress ปลั๊กอิน Landing Page ขายสินค้าในหน้าเดียวโดยไม่ใช้ WooCommerce โดยมีรายละเอียด ดังนี้
    1. ระบบตั้งค่าการจัดการสินค้า และ ตั้งค่าข้อความในหน้าสั่งซื้อสำเร็จ โดยมีรูปแบบสินค้า ได้แก่
      • สินค้าปกติ
      • สินค้ามีให้เลือกขนาด
      • สินค้ามีให้เลือกสี
      • สินค้ามีให้เลือกขนาดและสี setting product type and text in thank you page
    2. ระบบหลังบ้านจัดการข้อมูลสินค้า 1 ชิ้น และ สร้าง shortcode เพื่อนำปุ่มสั่งซื้อสินค้ามาแสดงในหน้าเว็บที่ต้องการ โดยมีข้อมูลในการโพสสินค้า ได้แก่
      • ชื่อสินค้า
      • รูปภาพสินค้า ( ดึงมาจากรูปประจำโพส หรือ featured image )
      • ราคาปกติ
      • ราคาลด
      • ค่าจัดส่ง
      • ขนาดสินค้า
      • สีของสินค้า
      • โปรโมชั่นจำนวนสั่งซื้อ
        • จำนวนสั่งซื้อ
        • จำนวนแถม setting product detail and create shortcode for checkout process
  1. สร้างฟิลด์สำหรับเลือกขนาดและสี ให้แสดงในหน้าสินค้า หากสินค้านั้นถูกตั้งค่าเป็นสินค้าแบบมีขนาดและสีให้เลือก ดังรูป display product size and color field in frontend
  2. เมื่อลูกค้าคลิกเลือกโปรโมชั่นที่ต้องการสั่งซื้อ และเลือก สี, ขนาด แล้ว จะมี “สรุปยอดการสั่งซื้อ” แสดงทันที โดยไม่ต้องเสียเวลารอให้ขึ้นหน้าเว็บใหม่ ดังรูป after click checkout display order summary immediately
  3. หลังจากลูกค้าคลิกปุ่มสั่งซื้อสินค้าแล้ว ระบบจะพาไปยังหน้าข้อมูลการจัดส่งสินค้า ดังรูป shipping detail page
  4. เมื่อคลิกปุ่มยืนยันการสั่งซื้อ ระบบจะพาไปหน้าการสั่งซื้อสำเร็จ (หน้า Thank you) ประกอบด้วยข้อมูล ได้แก่
    • รหัสการสั่งซื้อ
    • ชื่อลูกค้า
    • เบอร์โทร
    • ที่อยู่
    • ชื่อสินค้า
    • จำนวน ( แจ้งตามโปร เช่น 3 ชิ้นฟรี 1 ชิ้น เป็นต้น)
    • วิธีชำระเงิน ( เก็บเงินปลายทางเท่านั้น )
    • ปุ่มแก้ไขข้อมูล
    • ข้อความ
    • ข้อความที่ได้ตั้งค่าไว้สำหรับหน้าสั่งซื้อสำเร็จ thank you page
  5. ระบบจัดการคำสั่งซื้อ โดยแสดงข้อมูลเป็นตารางคำสั่งซื้อที่ลูกค้าสั่งเข้ามา เพื่อให้ admin ดูคำสั่งซื้อได้จากหลังบ้าน ดังรูป order management backend