วิธีสร้างแบบฟอร์มการติดต่อใน Elementor

อยากทราบวิธีสร้าง แบบฟอร์มติดต่อ ใน Elementor?

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

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

วิธีสร้างแบบฟอร์มการติดต่อใน Elementor

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

ในบทความนี้ เราจะไปที่การเพิ่มวิดเจ็ต Form ในกล่องแก้ไขของ Elementor เพียงเพิ่มวิดเจ็ต Form จากแผงวิดเจ็ตไปยังกล่องแก้ไขดังนี้:

อย่างที่คุณเห็น วิดเจ็ต Form จะสร้างฟอร์มที่ประกอบด้วยสามฟิลด์โดยอัตโนมัติ

อ่าน: วิธีเพิ่มตารางราคาใน Elementor

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

หากต้องการลบฟิลด์ที่มีอยู่ คุณสามารถคลิกที่ X ของฟิลด์ที่คุณต้องการลบ

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

การกำหนดรูปแบบการดำเนินการ

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

ดูเพิ่มเติม: วิธีสร้างภาพโค้งมนใน Elementor

เลือกการดำเนินการที่คุณต้องการกำหนดในฟิลด์ที่พร้อมใช้งาน (คุณสามารถเพิ่มการดำเนินการได้หลายรายการ) ในตัวอย่างนี้ เราเลือก E-mail.

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

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

ตัวอย่างเช่น การตั้งค่าด้านล่างจะส่งเฉพาะเนื้อหาของฟิลด์ข้อความ

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

ความหมายของข้อความ

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

ดูเพิ่มเติมที่: วิธีสร้างส่วนสมาชิกในทีมด้วย Elementor

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

การปรับแต่งแบบฟอร์ม

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

• ฟอร์ม

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

• สนาม

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

• ปุ่ม

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

• Messages

คุณสามารถเปิดบล็อกนี้เพื่อกำหนดรูปแบบตัวอักษรและสีของข้อความ

• ขั้นตอน

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

เมื่อคุณปรับแต่งฟอร์มและเพจเสร็จแล้ว คุณสามารถเผยแพร่เพจของคุณได้

ข้อผิดพลาดที่อาจเกิดขึ้น

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

Elementor และปลั๊กอินแบบฟอร์มการติดต่อส่วนใหญ่ - รวมถึงแบบฟอร์มการติดต่อ 7 - ใช้คุณสมบัติการส่งจดหมายเริ่มต้นของ WordPress ที่เรียกว่า wp_mail. ฟังก์ชันนี้ขึ้นอยู่กับฟังก์ชัน ส่งอีเมล์ ซึ่งขึ้นอยู่กับ PHP ในการทำงาน

อ่าน: วิธีเพิ่มแถบเลื่อนข้อความรับรองใน Elementor

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

ในการแก้ไขปัญหานี้ คุณสามารถติดตั้งและกำหนดค่าบริการจัดส่งจดหมายแบบกำหนดเองบน WordPress ของคุณได้ หรือหากเป็นไปได้ คุณสามารถขอให้ผู้ให้บริการโฮสต์ของคุณเปิดใช้งานคุณลักษณะนี้ ส่งอีเมล์ ของ PHP

ในที่สุด

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

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

รับ Elementor Pro ทันที!

สรุป

ที่นี่คือ ! บทความนี้จะแสดงวิธีสร้างแบบฟอร์มการติดต่อใน Elementor เท่านั้น หากคุณมีข้อสงสัยในการเดินทาง f onแจ้งให้เราทราบใน ความเห็น.

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

แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.

...