วิธีสร้างแบบฟอร์มสั่งซื้อเสื้อยืดออนไลน์ใน WordPress [Easy & Simple Way]

เผยแพร่แล้ว: 2022-07-06

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

แล้วคุณต้องการอะไร? คุณต้องสร้างแบบฟอร์มเสื้อยืดออนไลน์ที่ทุกคนสามารถเลือกการออกแบบ เลือกสีและขนาดของเสื้อยืด เลือกที่อยู่ที่คุณต้องการให้จัดส่งเสื้อยืด ตัวเลือกการชำระเงิน และสิ่งที่ไม่อนุญาต

Fluent Forms คือเครื่องมือสร้างแบบฟอร์มที่เป็นมิตรกับผู้เริ่มต้นมากที่สุด ดาวน์โหลดตอนนี้และเริ่มสร้างแบบฟอร์มที่สวยงามฟรี !!!

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

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

โปรแกรมสร้างแบบฟอร์มสั่งทำเสื้อยืดออนไลน์

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

ไปเลย-

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

ช่องป้อนข้อมูลจำนวนมาก : ช่องบังคับในการสร้างแบบฟอร์มการสั่งซื้อเสื้อยืดออนไลน์-

  1. ชื่อสนาม
  2. ฟิลด์ที่อยู่ (พร้อมการเติมข้อความอัตโนมัติและการรวมแผนที่ Google)
  3. ช่องอีเมล
  4. ช่องทำเครื่องหมายและหลายตัวเลือก
  5. ช่องชำระเงิน
  6. อัปโหลดไฟล์
  7. รายการแบบเลื่อนลงสำหรับการเลือกสี การออกแบบ ขนาด ฯลฯ
  8. ช่องรีพีทเตอร์

นอกจากนี้ คุณจะได้รับช่องป้อนข้อมูลมากกว่า 40 ช่อง ยกเว้นช่องเหล่านี้เพื่อสร้างแบบฟอร์มออนไลน์ทุกประเภทที่คุณต้องการ ดูวิธีการทำแบบฟอร์มขอเช็คด้วย Fluent Forms

ช่องใส่แบบฟอร์ม Fluent Forms
ช่องใส่แบบฟอร์ม Fluent Forms

คุณลักษณะ และการผสานรวม ที่สำคัญ : คุณอาจจำเป็นต้องใส่ตรรกะตามเงื่อนไขลงในแบบฟอร์มของคุณ หรือบางทีอาจต้องใช้เครื่องคิดเลขเพื่อช่วยให้ลูกค้าของคุณติดตามงบประมาณของพวกเขา หรือบางทีอาจต้องเห็นภาพเสื้อยืด ทั้งหมดนี้สามารถทำได้ด้วย Fluent Forms

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

หากคุณต้องการดูแลลีดหรือลูกค้าขาจรให้เป็นลูกค้าประจำ คุณอาจต้องการการจัดการลูกค้าสัมพันธ์หรือเครื่องมือ CRM สำหรับเครื่องมือสร้างแบบฟอร์ม และใช่ Fluent Forms มีการผสานรวมดั้งเดิมจำนวนมากเพื่อรักษาลีด

นอกจากนี้ คุณยังได้รับการผสานรวมมากกว่า 45 รายการ ตั้งแต่ระบบอัตโนมัติไปจนถึงเครื่องมือแชร์ไฟล์ ตั้งแต่การเป็นสมาชิกไปจนถึงเครื่องมือแจ้งเตือน และอื่นๆ

ชิคแชทพอแล้ว มาทำฟอร์มกัน

วิธีสร้างแบบฟอร์มสั่งซื้อเสื้อยืดออนไลน์ (ตั้งแต่เริ่มต้น)

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

ขั้นตอนที่ 1: สร้างแบบฟอร์มสั่งซื้อเสื้อยืดออนไลน์

ในการสร้างแบบฟอร์มการสั่งซื้อเสื้อยืดออนไลน์โดยไม่ต้องเขียนโค้ด สิ่งแรกที่คุณต้องทำคือติดตั้งตัวสร้างแบบฟอร์มบนไซต์ WordPress ของคุณ การติดตั้ง Fluent Forms นั้นค่อนข้างตรงไปตรงมา

หลังจากติดตั้งและเปิดใช้งานปลั๊กอินแล้ว ให้วางเมาส์เหนือ Fluent Forms จากด้านซ้ายและเลือก เพิ่มใหม่ เพื่อสร้างแบบฟอร์มของคุณ ตอนนี้ป๊อปอัปจะปรากฏขึ้น ให้เลือกตัวเลือก New Blank Form เพื่อเริ่มต้นแบบฟอร์มใหม่ของคุณ

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

นี่คือที่ที่คุณต้องตัดสินใจเกี่ยวกับโครงสร้างแบบฟอร์ม บางคนชอบกระโดดเข้าสู่ส่วนการออกแบบเสื้อยืดโดยตรง และบางคนชอบที่จะหาข้อมูลพื้นฐานของผู้ใช้ก่อน

ต่อไปเราจะเพิ่มฟิลด์ชื่อ ที่อยู่ อีเมล และหมายเลขโทรศัพท์ทีละรายการ นี่เป็นสิ่งพื้นฐานที่ค่อนข้างง่าย เพียงค้นหาฟิลด์จากด้านขวาของหน้าตัวแก้ไขแล้วคลิกเพื่อเพิ่มลงในแบบฟอร์มของคุณ คุณยังสามารถลากฟิลด์เพื่อสับเปลี่ยนได้

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

แบบฟอร์มสั่งซื้อเสื้อยืด

ขั้นตอนที่ 2: สร้างส่วนสำหรับการปรับแต่งสไตล์เสื้อยืด

สำหรับเสื้อยืดแบบกำหนดเองของคุณ คุณต้องเลือกขนาด สี และปริมาณของเสื้อที่คุณต้องการ ดังนั้น เราจะเพิ่มคอนเทนเนอร์สามคอลัมน์และเพิ่มฟิลด์การชำระเงินโดยเปิดใช้งานตัวเลือกวิทยุ การแมปฟิลด์ปริมาณสินค้าด้วยฟิลด์การชำระเงิน และฟิลด์ดร็อปดาวน์ที่ชื่อว่าเลือกสี (ที่เราได้สร้างตัวเลือกสำหรับ สีที่ต่างกัน).

ออกแบบแบบฟอร์มสั่งซื้อเสื้อยืดออนไลน์

แล้วถ้ามีคนต้องการสั่งเสื้อยืดตัวอื่นที่มีขนาดและสีต่างกันล่ะ? ใช่ เราสามารถทำได้เช่นกัน ด้วยเคล็ดลับง่ายๆ ของ Conditional Logic คุณสามารถเพิ่มคอนเทนเนอร์อื่นที่มีฟิลด์เดียวกันที่กำหนดให้กับคอนเทนเนอร์เหล่านั้นได้

ส่วนการปรับแต่งเสื้อยืดสำหรับแบบฟอร์มการสั่งซื้อเสื้อยืดออนไลน์ของคุณ

เพิ่มช่องทำเครื่องหมายและตั้งชื่อว่า Add T-shirt จากนั้นคัดลอกคอนเทนเนอร์ก่อนหน้าและเปลี่ยนชื่อเป็น T-shirt 2 ตั้งค่า Conditional Logic ตามภาพหน้าจอ ตอนนี้ เมื่อใดก็ตามที่ผู้ใช้ตรวจสอบฟิลด์นี้ คอนเทนเนอร์ใหม่จะปรากฏขึ้น และเขา/เธอสามารถเพิ่มข้อกำหนดเสื้อยืดอื่นในคำสั่งซื้อของตนได้

ขั้นตอนที่ 3: ปรับแต่งส่วนการชำระเงินสำหรับแบบฟอร์มสั่งซื้อเสื้อยืดของคุณ

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

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

เพิ่ม HTML ที่กำหนดเองลงในแบบฟอร์มการสั่งซื้อเสื้อยืดของคุณ

สำหรับวิธีการชำระเงิน Fluent Forms นำเสนอการผสานการชำระเงินที่ได้รับความนิยมสูงสุดแก่คุณ คุณสามารถใช้ Stripe, PayPal, Mollie, RazorPay ฯลฯ สำหรับการชำระเงินตามแบบฟอร์มสั่งซื้อเสื้อยืดของคุณ การตั้งค่าวิธีการชำระเงินของคุณก็เหมือนกับการตั้งค่าการชำระเงินอื่นๆ คุณต้องผสานรวมผ่านคีย์ API

ขั้นตอนที่ 4: ทำให้เป็นแบบฟอร์มหลายขั้นตอนหากต้องการ

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

ค้นหาขั้นตอนของแบบฟอร์มจากช่องป้อนข้อมูล จากนั้นเพิ่มที่จุดเริ่มต้นของหน้าและจุดสิ้นสุด เพิ่มหนึ่งรายการต่อจากข้อมูลการเรียกเก็บเงิน และเพิ่มอีกหนึ่งรายการหลังจากการเลือกเสื้อยืด

ขั้นตอนที่ 5: การตั้งค่าการแจ้งเตือนและอีเมลสำหรับแบบฟอร์มการสั่งซื้อเสื้อยืด

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

คุณอาจเห็นตัวเลือกอื่นๆ ที่ด้านซ้ายของหน้าจอแล้ว ได้ คุณสามารถรวมแบบฟอร์มของคุณเข้ากับเครื่องมือต่างๆ เช่น ซอฟต์แวร์สมาชิก การแจ้งเตือน CRM ฯลฯ ได้หากต้องการ

ขั้นตอนที่ 6: จัดแต่งทรงผมแบบฟอร์มสั่งซื้อเสื้อยืดของคุณ

หากคุณทำตามทุกอย่างที่เราบอกคุณจนถึงตอนนี้ แสดงว่าคุณมีแบบฟอร์มการสั่งซื้อเสื้อยืดที่ใช้งานได้จริง คุณสามารถใช้ได้ทุกที่เช่นในบล็อกหรือหน้าหากต้องการ นอกจากนี้ คุณสามารถสร้างหน้า Landing Page สำหรับแบบฟอร์มนี้ซึ่งสามารถแชร์ผ่านลิงก์หรือปุ่มโดยตรง

แต่แล้วการให้แบบฟอร์มนี้มีสไตล์ล่ะ? ใช่ คุณสามารถทำได้เช่นกัน เพิ่มรูปภาพเด่นลงในแบบฟอร์มของคุณผ่านฟิลด์ HTML ที่กำหนดเองซึ่งค่อนข้างเรียบง่าย หากคุณใช้เครื่องมือสร้างเพจ เช่น Elementor และ Oxygen คุณจะได้รับวิดเจ็ตเพิ่มเติมสำหรับฟอร์ม Fluent การทำให้แบบฟอร์มของคุณดูสมบูรณ์นั้นมีประโยชน์มาก โดยที่ผู้ใช้มักจะไม่สามารถเลื่อนได้โดยไม่ต้องดูอีกครั้ง

นี่คือแบบฟอร์มการสั่งซื้อเสื้อยืดพื้นฐานโดยไม่ต้องเขียนโค้ดหรือความช่วยเหลือจากผู้สร้างเพจแฟนซี -

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

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

จำการดึงข้อมูลแบบไดนามิกไปยังหน้าการยืนยันเพื่อความมั่นใจหรือไม่
เพียงแค่พิมพ์ {dynamic.Name_Attribute} เพื่อดึงข้อมูลของฟิลด์นั้น สำหรับแบบฟอร์มคำสั่งซื้อของเรา เราเพียงแค่ใส่ฟิลด์ HTML ที่กำหนดเองและใส่ข้อความยืนยันพร้อมกับแท็ก {dynamic.names} และ {dynamic.phone} โว้ว! นี่คือลักษณะที่ปรากฏในรูปแบบของคุณ

นอกจากนี้เรายังเพิ่มการออกแบบเสื้อยืดบางส่วนลงในสนามวิทยุเพื่อเลือกภาพ

เผยแพร่แบบฟอร์มการสั่งซื้อเสื้อยืดของคุณ

การเผยแพร่แบบฟอร์มการสั่งซื้อเสื้อยืดของคุณไม่ใช่วิทยาศาสตร์จรวด Fluent Forms จะให้ ID ที่ไม่ซ้ำกับทุกรูปแบบเสมอ เพียงคัดลอกและวางรหัสย่อไปยังหน้าหรือบล็อกโพสต์ที่คุณต้องการเผยแพร่แบบฟอร์มของคุณ

นอกจากนี้ หากคุณใช้คุณลักษณะหน้า Landing Page คุณสามารถเพิ่มสีพื้นหลัง ภาพพื้นหลัง โลโก้แบบฟอร์ม รูปภาพเด่น หัวเรื่องของหน้า และอื่นๆ เพื่อสร้างแบบฟอร์มที่ดูสง่างาม

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

รูปลักษณ์สุดท้ายของแบบฟอร์มการสั่งซื้อเสื้อยืดโดยไม่ต้องเขียนโค้ดใดๆ

ยังสับสน? ไม่ คุณไม่ได้พลาดอะไรไป

ด้วย Typeform คุณสามารถสร้างแบบฟอร์มโต้ตอบเพื่อให้แบบฟอร์มของคุณเหมือนการสนทนา

คุณสามารถสร้างแบบฟอร์มการสนทนาเชิงโต้ตอบด้วย Fluent Forms ได้เช่นกัน และมีตัวเลือกมากมาย เช่น การเข้าถึงแป้นพิมพ์แบบเต็ม การเพิ่มรูปภาพ/เลย์เอาต์ต่างๆ แม้แต่แอนิเมชั่น/วิดีโอลงในแบบฟอร์ม คลิกเพียงครั้งเดียวเพื่อเปลี่ยนรูปแบบที่ไม่โต้ตอบของคุณให้เป็นแบบสนทนา และอื่นๆ

หากคุณต้องการทำแบบฟอร์มสั่งซื้อเสื้อยืดเป็น Typeform คุณสามารถทำได้ด้วย Fluent Forms Conversational Form

ทำแบบฟอร์มสั่งซื้อเสื้อยืดโรงเรียนสำหรับชั้นเรียนหรือสโมสรของคุณตอนนี้ หากคุณต้องการความช่วยเหลือ ลองดูว่ารูปแบบการสนทนาทำงานอย่างไรในวิดีโอนี้

แบบฟอร์มสั่งซื้อเสื้อยืด Canva

นี่เป็นอีกตัวอย่างหนึ่งของแบบฟอร์มการสั่งซื้อเสื้อยืดออนไลน์

แบบฟอร์มสั่งซื้อเสื้อยืดออนไลน์สำหรับทีมมัสแตงเบสบอล

ดูคุณไม่ได้พลาดอะไร ที่จริงแล้ว ด้วย Fluent Forms คุณจะได้รับมากกว่าเครื่องมือสร้างแบบฟอร์มอื่นๆ ในการสร้างแบบฟอร์มการสั่งซื้อเสื้อยืดที่ยอดเยี่ยม

รับแบบฟอร์มอย่างคล่องแคล่ว Pro

ห่อ

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

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