วิธีปรับแต่งแบบฟอร์มใน WordPress Block Editor [2024]

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

Gutenberg Editor มีบล็อกฟอร์มเริ่มต้นหรือไม่

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

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

3 ปลั๊กอิน Gutenberg ที่ดีที่สุดในการปรับแต่งแบบฟอร์มสำหรับ WordPress Block Editor

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

1. สร้างบล็อกของบล็อกสำคัญ

มีบล็อกสร้างสรรค์มากกว่า 50 บล็อก Essential Blocks สำหรับ Gutenberg กำลังกลายเป็นหนึ่งในปลั๊กอินบล็อก Gutenberg ที่ได้รับความนิยมมากที่สุดอย่างรวดเร็ว หนึ่งในนั้นคือ Form Block ที่ช่วยให้คุณสามารถสร้างและปรับแต่งแบบฟอร์มได้อย่างสมบูรณ์เพื่อวัตถุประสงค์ต่างๆ เช่น การสมัครสมาชิก การติดต่อ การชำระเงิน การบริจาค และอื่นๆ อีกมากมาย

ด้วย บล็อก Essential Blocks Form คุณจะมีตัวเลือกการปรับแต่งและสไตล์ที่ไม่จำกัด บล็อกแบบฟอร์มให้การผสานรวมกับ reCAPTCHA และ Mailchimp รวมถึงให้คุณเข้าถึงฟังก์ชันการทำงานที่หลากหลาย Form Block ได้แนะนำบล็อกภายในทั้งหมดเก้าบล็อกเพื่อเพิ่มฟิลด์ที่กำหนดเองและปรับแต่งแบบฟอร์มของคุณเพื่อเพิ่มประสบการณ์ผู้ใช้ของคุณให้สูงสุด บล็อกภายในที่โดดเด่นอื่นๆ ได้แก่ ฟิลด์ข้อความ, ฟิลด์ Textarea, ฟิลด์อีเมล, ฟิลด์ตัวเลข, ฟิลด์เลือก, ฟิลด์ช่องทำเครื่องหมาย, ฟิลด์วิทยุ, ตัวเลือกวันที่เวลา ฯลฯ

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

2. เครื่องมือสร้างฟอร์มแบบกำหนดเองของ Forminator

สำหรับเว็บไซต์หรือสถานการณ์ทุกประเภท Forminator เป็นปลั๊กอินสร้างแบบฟอร์ม WordPress ที่ใช้งานง่ายโดยเฉพาะ คุณสามารถสร้างแบบฟอร์มประเภทใดก็ได้ รวมถึงการสั่งซื้อ การชำระเงิน การติดต่อ อีเมล คำติชม แบบสำรวจเชิงโต้ตอบ ฯลฯ การใช้งานที่ได้รับความนิยมมากขึ้นคือแบบทดสอบพร้อมผลลัพธ์แบบเรียลไทม์ คำถามแบบ “ไม่มีคำตอบที่ผิด” แบบ BuzzFeed ตัวประมาณค่าบริการ และ แบบฟอร์มการลงทะเบียนกับ PayPal และ Stripe เป็นตัวเลือกการชำระเงิน

การตั้งค่าและปรับแต่งแบบฟอร์มสำหรับเว็บไซต์ WordPress ของคุณนั้นง่ายดายด้วยเครื่องมือสร้างภาพแบบลากและวางของ Forminator รวบรวมข้อมูล ทำให้เนื้อหาของคุณมีการโต้ตอบ และสร้าง Conversion มากขึ้นด้วย Forminator

3. แบบฟอร์มบล็อกของนาก

Otter เป็นอีกหนึ่งห้องสมุดยอดนิยมของ Gutenberg ที่มีรูปแบบบล็อกเป็นของตัวเอง Otter Blocks Form Block สำหรับ WordPress ช่วยให้ผู้ใช้สามารถเพิ่มแบบฟอร์มการติดต่อที่ปรับแต่งได้ลงในเว็บไซต์ของตนได้อย่างง่ายดาย มันผสานรวมกับเครื่องมือทางการตลาด เช่น SendinBlue และ Mailchimp สำหรับการสร้างลูกค้าเป้าหมาย รวมถึงการป้องกันบอทด้วย CAPTCHA และเสนอตัวเลือกสไตล์ขั้นสูง แบบฟอร์มสามารถปรับแต่งได้ในแง่ของสีข้อความ ขนาด ระยะห่างรายการ และอื่นๆ ทำให้เป็นเครื่องมืออเนกประสงค์สำหรับปรับปรุงการโต้ตอบและฟังก์ชันการทำงานของเว็บไซต์

วิธีปรับแต่งแบบฟอร์มใน WordPress Block Editor โดยใช้ Essential Blocks

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

ขั้นตอนที่ 1: ติดตั้งและเปิดใช้งานปลั๊กอิน Essential Blocks

หากต้องการสร้างและปรับแต่งแบบฟอร์มใน WordPress คุณต้อง ติดตั้งและเปิดใช้งานปลั๊กอิน ในแดชบอร์ด WordPress ของคุณ ดังนั้นไปที่ Plugins → Add New ค้นหา Essential Blocks แล้วติดตั้ง หลังจากนั้นให้เปิดใช้งานปลั๊กอินด้วย

คุณจะพบบล็อกแบบฟอร์มในแท็บ 'บล็อก' ในแดชบอร์ดปลั๊กอิน เปิดใช้งานการบล็อกจากที่นั่น ตอนนี้คุณก็พร้อมที่จะสร้างและปรับแต่งแบบฟอร์มใน Gutenberg แล้ว

ขั้นตอนที่ 2: ปรับแต่งแบบฟอร์มใน Gutenberg

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

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

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

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

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

ขั้นตอนที่ 3: เผยแพร่แบบฟอร์มที่สร้างขึ้นใหม่

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

นี่คือวิดีโอบทช่วยสอนที่คุณสามารถดูคำแนะนำเชิงลึกได้

สร้างแบบฟอร์มที่โดดเด่นและสร้างโอกาสในการขาย

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