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

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

ในบทความนี้ เราจะแสดงวิธีสร้างฟอร์มที่ประกอบด้วยฟิลด์อัปโหลดไฟล์

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

อ่านคำแนะนำของเราเกี่ยวกับ: วิธีการติดตั้ง Elementor บน WordPress

ขั้นแรก สร้างหน้าใหม่หรือเผยแพร่และแก้ไขด้วย Elementor

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

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

เพิ่มวิดเจ็ตแบบฟอร์มโดยลากจากแผงด้านซ้ายไปยังพื้นที่ผ้าใบ

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

โดยค่าเริ่มต้น คุณมีแบบฟอร์มที่ประกอบด้วยสามฟิลด์: ชื่อ อีเมล และข้อความ ลบฟิลด์ที่คุณไม่ต้องการโดยคลิกที่ไอคอน x บนฟิลด์

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

อ่าน: วิธีเพิ่ม reCAPTCHA ให้กับฟอร์ม Elementor ของคุณ

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

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

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

วิธีสร้างแบบฟอร์มอัพโหลดไฟล์ใน Elementor

นิยามของการกระทำ

จะดีมากถ้าคุณสามารถเชื่อมต่อแบบฟอร์ม Elementor กับ แบบฟอร์มบริการแบ็กเอนด์ เช่น getform ou ฟอร์มแครี่. ขออภัย Elementor ไม่รองรับการผสานรวมกับบริการแบ็กเอนด์ของแบบฟอร์มใดๆ

ค้นหาวิธีการ: วิธีเพิ่มตัวแบ่งเพื่อสร้างส่วนใน Elementor

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

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

จากนั้นเปิดตัวเลือก E-mail และกำหนดที่อยู่อีเมลที่จะส่งแบบฟอร์ม กำหนดหัวเรื่องของอีเมลด้วย

วิธีสร้างแบบฟอร์มอัพโหลดไฟล์ใน Elementor

อยู่ภายใต้ตัวเลือกเสมอ E-mail, ตั้งค่าเนื้อหาอีเมลเป็น option ข่าวสาร

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

คุณยังสามารถปรับแต่งข้อมูลเมตาเนื้อหาของอีเมลของคุณได้ในส่วน ข้อมูลเมตา. ลบข้อมูลเมตาที่คุณไม่ต้องการรวม

วิธีสร้างแบบฟอร์มอัพโหลดไฟล์ใน Elementor

ข้อมูลเมตาจะปรากฏใต้เนื้อหาของอีเมล

ในทุ่งนา จากอีเมล์, จากชื่อและตอบกลับคุณสามารถเว้นว่างไว้ได้

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

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

หากต้องการสร้างตัวเลือกการจัดสไตล์ขั้นสูง คุณสามารถเข้าถึงแท็บ สไตล์ นี่คือตัวเลือกการจัดสไตล์บางส่วนที่คุณสามารถตั้งค่าได้

  • กำหนดช่องว่างระหว่างบรรทัดและตัวพิมพ์ของฉลาก

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

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

  • กำหนดรูปแบบฟิลด์ สีพื้นหลัง สีเส้นขอบ ความกว้างของเส้นขอบ และรัศมีเส้นขอบ

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

วิธีสร้างแบบฟอร์มอัพโหลดไฟล์ใน Elementor
  • ปุ่มปรับแต่ง

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

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

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

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

วิธีสร้างแบบฟอร์มอัพโหลดไฟล์ใน Elementor

ข้อผิดพลาดข้างต้นมักเกิดขึ้นหากคุณใช้บริการเว็บโฮสติ้ง การแบ่งปัน ซัพพลายเออร์ส่วนใหญ่ของเว็บโฮสติ้ง ฟังก์ชั่นปิดการใช้งานที่ใช้ร่วมกัน php send_mail, ซึ่งใช้โดยฟังก์ชันการทำงานของ WordPress wp_mail เพื่อส่งอีเมล

รับ Elementor Pro ทันที!

สรุป

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

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

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

...