วิธีปรับแต่งแบบฟอร์ม WordPress ด้วย WPForms
เผยแพร่แล้ว: 2024-09-30การสร้างประสบการณ์ที่เป็นส่วนตัวสำหรับผู้ใช้ของคุณสามารถสร้างความแตกต่างในการเพิ่มการมีส่วนร่วมและเพิ่มอัตราการกรอกแบบฟอร์มได้
หากคุณกำลังจัดการไซต์ WordPress คุณอาจสงสัยว่าคุณจะปรับแต่งแบบฟอร์มเพื่อให้เกี่ยวข้องกับผู้เยี่ยมชมของคุณมากขึ้นได้อย่างไรโดยไม่เพิ่มความซับซ้อน
ในคู่มือนี้ ฉันจะแนะนำคุณเกี่ยวกับฟีเจอร์ WPForms อันทรงพลังที่ทำให้การสร้างแบบฟอร์มส่วนบุคคลเป็นเรื่องง่าย และอธิบายว่าพวกเขาสามารถเปลี่ยนแปลงการสร้างแบบฟอร์มของคุณและปรับปรุงความพึงพอใจของผู้ใช้ได้อย่างไร
ปรับแต่งแบบฟอร์ม WordPress ของคุณตอนนี้!
- 1. ตัวเลือก AI เพื่อแปลงรูปแบบการสร้างแบบฟอร์มของคุณ
- 2. ตำแหน่งทางภูมิศาสตร์สำหรับการปรับเปลี่ยนในแบบของคุณตามเป้าหมาย
- 3. กรอกฟิลด์แบบฟอร์มล่วงหน้าโดยใช้พารามิเตอร์ URL หรือสตริงการสืบค้น
- 4. การใช้ลอจิกแบบมีเงื่อนไขสำหรับฟอร์มไดนามิก
- 5. แบบฟอร์มหลายขั้นตอนเพื่อประสบการณ์ผู้ใช้ที่ไม่ซ้ำใคร
- 6. จัดรูปแบบแบบฟอร์มของคุณด้วย Block Editor
1. ตัวเลือก AI เพื่อแปลงรูปแบบการสร้างแบบฟอร์มของคุณ
แม้ว่าการสร้างแบบฟอร์มจะรวดเร็วและง่ายดายด้วย WPForms แต่การกรอกเมนูแบบเลื่อนลงและคำถามแบบปรนัยยังคงต้องใช้เวลา เพื่อให้สิ่งต่าง ๆ ง่ายขึ้น คุณสามารถไว้วางใจฟีเจอร์ AI Choices ได้
สิ่งที่คุณต้องทำคือคลิกปุ่มและอธิบายสิ่งที่คุณต้องการ จากนั้น WPForms AI จะกรอกข้อมูลในช่องทำเครื่องหมาย รายการแบบเลื่อนลง และตัวเลือกแบบปรนัยในไม่กี่วินาที!
ส่วนที่ดีที่สุดคือ AI Choices พร้อมใช้งานสำหรับทุกคน ไม่ว่าคุณจะมีใบอนุญาต WPForms แบบฟรีหรือแบบชำระเงินก็ตาม นี่คือวิธีการใช้งาน:
AI Choices ทำงานอย่างไรใน WPForms
สร้างแบบฟอร์มทุกประเภทด้วยช่องแบบหลายตัวเลือกหรือดรอปดาวน์ หรือประหยัดเวลาโดยใช้เทมเพลตฟอร์มที่สร้างไว้ล่วงหน้าของเรา WPForms เสนอรายการเทมเพลตฟอร์ม WordPress มากกว่า 1,900 รายการ
เมื่อคุณอยู่ในตัวสร้างแบบฟอร์มแล้ว ให้เปิด ตัวเลือกฟิลด์ สำหรับฟิลด์หลายตัวเลือกหรือดรอปดาวน์ที่เกี่ยวข้อง จากนั้นคลิกที่ปุ่ม สร้างตัวเลือก เพื่อเริ่มเพิ่มรายการตัวเลือก AI!

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

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

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

2. ตำแหน่งทางภูมิศาสตร์สำหรับการปรับเปลี่ยนในแบบของคุณแบบกำหนดเป้าหมาย
WPForms Geolocation Addon เป็นเครื่องมือที่มีประโยชน์อย่างเหลือเชื่อสำหรับการจับภาพและใช้ตำแหน่งของผู้เยี่ยมชมเพื่อปรับแต่งฟิลด์แบบฟอร์มในแบบของคุณ
ด้วยการผสานรวมกับ Google Maps คุณลักษณะนี้สามารถตรวจจับเมือง รัฐ และประเทศของผู้ใช้ได้โดยอัตโนมัติ ช่วยให้คุณสามารถปรับแต่งประสบการณ์การใช้งานแบบฟอร์มตามสถานที่ตั้งของพวกเขาได้
ตัวอย่างเช่น คุณสามารถตั้งค่าประเทศหรือรัฐเริ่มต้นในเมนูแบบเลื่อนลงได้โดยอัตโนมัติ ทำให้ผู้ใช้สามารถกรอกแบบฟอร์มได้ง่ายขึ้นโดยไม่ต้องเลือกสถานที่ตั้งด้วยตนเอง
ตำแหน่งทางภูมิศาสตร์ทำงานอย่างไรใน WPForms
หากต้องการตั้งค่าตำแหน่งทางภูมิศาสตร์ใน WPForms คุณจะต้องติดตั้งและกำหนดค่า Geolocation Addon ต่อไปนี้เป็นภาพรวมโดยย่อของขั้นตอนในการเริ่มต้น:
ขั้นแรก ตรวจสอบให้แน่ใจว่าคุณมี WPForms Pro เนื่องจาก Geolocation Addon มีให้ใช้งานในแผน Pro เท่านั้น จากนั้นติดตั้งและเปิดใช้งาน Addon

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

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

3. กรอกฟิลด์แบบฟอร์มล่วงหน้าโดยใช้พารามิเตอร์ URL หรือสตริงการสืบค้น
การกรอกฟิลด์แบบฟอร์มล่วงหน้าด้วย WPForms โดยใช้พารามิเตอร์ URL หรือสตริงการสืบค้นเป็นวิธีที่ดีในการปรับปรุงประสบการณ์ผู้ใช้ โดยเฉพาะสำหรับผู้เยี่ยมชมที่กลับมา ช่วยให้คุณสามารถส่งข้อมูลไปยังแบบฟอร์มของคุณได้โดยตรง ซึ่งช่วยประหยัดเวลาของผู้ใช้จากการป้อนข้อมูลอีกครั้ง
การใช้สตริงการสืบค้นเพื่อเติมฟิลด์ข้อความอัตโนมัติ
สตริงการสืบค้นคือข้อมูลชิ้นเล็กๆ ที่เพิ่มลงใน URL ซึ่งมักจะอยู่หลังเครื่องหมายคำถาม (?) ใช้เพื่อส่งข้อมูลจากหน้าหนึ่งไปยังอีกหน้าหนึ่ง
ใน WPForms สตริงการสืบค้นสามารถกรอกข้อมูลในฟิลด์แบบฟอร์มโดยอัตโนมัติเมื่อผู้ใช้เยี่ยมชมเพจที่มี URL เฉพาะนั้น
นี่เป็นวิธีที่ดีในการปรับแต่งแบบฟอร์มสำหรับผู้ใช้ที่กลับมาที่ไซต์ของคุณหรือคลิกลิงก์พิเศษจากอีเมลหรือโฆษณา
ตัวอย่างเช่น หากคุณต้องการให้กรอกข้อมูลในช่องชื่อผู้ใช้ล่วงหน้า คุณสามารถสร้าง URL ที่มีลักษณะดังนี้:
https://yourwebsite.com/form-page/?name=John
ในกรณีนี้ "ชื่อ" คือช่องแบบฟอร์ม และ "John" คือค่าที่ปรากฏขึ้นโดยอัตโนมัติในช่องนั้นเมื่อผู้ใช้เข้าชมเพจ

ดูคู่มือนี้เพื่อเรียนรู้วิธีใช้สตริงการสืบค้นเพื่อกรอกช่องข้อความอัตโนมัติ
การตั้งค่าแบบฟอร์มที่กรอกไว้ล่วงหน้าใน WPForms
อีกวิธีหนึ่งในการตั้งค่าช่องแบบฟอร์มที่กรอกไว้ล่วงหน้าคือให้ผู้เยี่ยมชมกรอกแบบฟอร์มพื้นฐานก่อน จากนั้นจึงส่งข้อมูลนั้นไปยังแบบฟอร์มที่สองเมื่อคลิกปุ่ม ส่ง
ในการดำเนินการนี้ คุณจะต้องตั้งค่า ประเภทการยืนยัน เพื่อ ไปที่ URL (เปลี่ยนเส้นทาง) และกำหนดค่าฟิลด์ที่จะเติมข้อมูลโดยใช้สตริงการสืบค้น
ตัวอย่างเช่น คุณจะเพิ่ม URL เช่นนี้ใน URL เปลี่ยนเส้นทางเพื่อเปิดใช้งานการเติมข้อมูลฟิลด์แบบไดนามิก:
- ?wpf: นี่เป็นจุดเริ่มต้นของสตริงการสืบค้นสำหรับฟังก์ชันการกรอกล่วงหน้าของ WPForms
- รหัสแบบฟอร์ม: ระบุว่าข้อมูลจะไปยังแบบฟอร์มใด (ในกรณีนี้ รหัสแบบฟอร์มจะเป็น 20)
- รหัสฟิลด์: ระบุว่าฟิลด์ใดในรูปแบบที่คุณกำหนดเป้าหมาย (ในที่นี้ รหัสฟิลด์คือ 1)
- ตัวระบุฟิลด์ย่อย (ไม่บังคับ): ใช้หากคุณกำหนดเป้าหมายส่วนใดส่วนหนึ่งของฟิลด์ที่มีหลายส่วน เช่น เมืองในช่องที่อยู่ (เช่น มีป้ายกำกับว่า "ฟิลด์ย่อย")
- =: เครื่องหมายเท่ากับบอกระบบว่าค่าของฟิลด์เริ่มต้นที่ใด
- ค่า: นี่คือข้อมูลที่คุณต้องการกรอกอัตโนมัติในฟิลด์ ต้องแทนที่ช่องว่างในค่าด้วย %20 เพื่อให้ทำงานได้อย่างถูกต้องใน URL

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

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

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

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

6. จัดรูปแบบแบบฟอร์มของคุณด้วย Block Editor
หากคุณต้องการให้แบบฟอร์มของคุณมีรูปลักษณ์ที่เป็นส่วนตัว WPForms จะผสานรวมกับตัวแก้ไขบล็อก WordPress ได้อย่างราบรื่น วิธีนี้ช่วยให้คุณจัดรูปแบบแบบฟอร์มโดยไม่ต้องเขียนโค้ดที่กำหนดเองใดๆ
การแบ่งส่วนต่างๆ ด้วยส่วนหัวที่ชัดเจน การปรับระยะห่าง และการเพิ่มแบบอักษรหรือปุ่มที่กำหนดเอง คุณทำให้แบบฟอร์มใช้งานง่ายและสนุกสนานในการกรอกแบบฟอร์มมากขึ้น
การปรับแต่งแบบฟอร์มโดยใช้ Block Editor
เริ่มต้นด้วยการฝังแบบฟอร์มของคุณลงในตัวแก้ไขบล็อกโดยตรง ซึ่งคุณสามารถดูตัวอย่างและแก้ไขเค้าโครงได้อย่างง่ายดาย ด้วยการใช้ บล็อก WPForms ภายในตัวแก้ไข คุณจะสามารถควบคุมวิธีการแสดงแบบฟอร์มของคุณบนเพจได้อย่างเต็มที่

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

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

คำถามที่พบบ่อย — วิธีปรับแต่งแบบฟอร์ม WordPress ด้วย WPForms
การปรับเปลี่ยนแบบฟอร์ม WordPress ในแบบของคุณเป็นหัวข้อยอดนิยมที่ผู้อ่านของเราสนใจ ต่อไปนี้เป็นคำตอบสำหรับคำถามทั่วไปเกี่ยวกับเรื่องนี้:
จะสร้างแบบฟอร์มที่กำหนดเองใน WordPress ได้อย่างไร?
หากต้องการสร้างแบบฟอร์มที่กำหนดเองใน WordPress คุณสามารถใช้ปลั๊กอิน WPForms หลังจากติดตั้งปลั๊กอินแล้ว ให้ไปที่ WPForms »เพิ่มใหม่ จากนั้นเลือกเทมเพลตหรือเริ่มจากศูนย์
ปรับแต่งแบบฟอร์มของคุณโดยการลากและวางฟิลด์ให้เข้าที่ จากนั้นกำหนดการตั้งค่า สุดท้าย ฝังแบบฟอร์มบนหน้าใดก็ได้โดยใช้รหัสย่อหรือตัวแก้ไขบล็อก
ฉันจะเปลี่ยนการออกแบบแบบฟอร์มใน WordPress ได้อย่างไร?
คุณสามารถเปลี่ยนการออกแบบแบบฟอร์มของคุณที่สร้างด้วย WPForms ได้อย่างง่ายดายโดยใช้ธีมของแบบฟอร์ม ไปที่ตัวแก้ไขบล็อกหลังจากฝังแบบฟอร์มของคุณแล้วเลือกธีมที่ตรงกับสไตล์เว็บไซต์ของคุณ คุณยังสามารถใช้บล็อก WPForms เพื่อปรับสี แบบอักษร และเค้าโครงได้
ฉันจะสร้างสมาร์ทแท็กที่กำหนดเองใน WPForms ได้อย่างไร
การสร้างสมาร์ทแท็กแบบกำหนดเองใน WPForms ต้องใช้โค้ดเล็กน้อย คุณจะต้องเชื่อมต่อกับ WPForms โดยใช้ wpforms_smart_tag_process และเขียนฟังก์ชันที่กำหนดพฤติกรรมของแท็ก
เมื่อตั้งค่าแล้ว คุณสามารถใช้สมาร์ทแท็กที่กำหนดเองในช่องแบบฟอร์มหรือการแจ้งเตือนเพื่อแทรกข้อมูลผู้ใช้แบบไดนามิกได้ ดูคู่มือนี้เพื่อดูข้อมูลเพิ่มเติมเกี่ยวกับการสร้างสมาร์ทแท็กแบบกำหนดเอง
คุณสามารถปรับแต่ง WPForms ได้หรือไม่?
ใช่ WPForms สามารถปรับแต่งได้สูง คุณสามารถใช้ Conditional Logic เพื่อปรับแต่งประสบการณ์ผู้ใช้ ธีมของแบบฟอร์มเพื่อปรับการออกแบบ และส่วนเสริมต่างๆ เพื่อปรับแต่งประสบการณ์ของแบบฟอร์ม
WPForms ยังมีคุณสมบัติขั้นสูง เช่น แบบฟอร์มที่กรอกไว้ล่วงหน้า ตำแหน่งทางภูมิศาสตร์ และสมาร์ทแท็กเพื่อการปรับแต่งเพิ่มเติม
จากนั้น สำรวจคุณสมบัติ WPForms ที่ซ่อนอยู่เหล่านี้
WPForms เต็มไปด้วยเครื่องมือและตัวเลือกที่ไม่ชัดเจนในทันที แต่สามารถปรับปรุงขั้นตอนการทำงานและแบบฟอร์มที่คุณสร้างได้อย่างมาก ลองอ่านคู่มือนี้เพื่อเรียนรู้เกี่ยวกับฟีเจอร์ที่อาจแอบแฝงอยู่ในสายตาของคุณ
สร้างแบบฟอร์ม WordPress ของคุณตอนนี้
พร้อมที่จะสร้างแบบฟอร์มของคุณแล้วหรือยัง? เริ่มต้นวันนี้ด้วยปลั๊กอินตัวสร้างแบบฟอร์ม WordPress ที่ง่ายที่สุด WPForms Pro มีเทมเพลตฟรีมากมายและมีการรับประกันคืนเงินภายใน 14 วัน
หากบทความนี้ช่วยคุณได้ โปรดติดตามเราบน Facebook และ Twitter เพื่อรับบทช่วยสอนและคำแนะนำ WordPress ฟรีเพิ่มเติม