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

เพื่อให้เว็บไซต์โหลดเร็วขึ้นบนอุปกรณ์มือถือ Google ได้สร้างโครงการที่เรียกว่า Accelerated Mobile Pages หรือ AMP และถึงแม้ว่ามันจะให้ประสบการณ์การท่องเว็บบนมือถือที่ยอดเยี่ยมด้วยการทำให้หน้าเว็บของคุณโหลดเร็วขึ้น แต่ก็ปิดการใช้งานคุณสมบัติที่มีประโยชน์มากมายบนเว็บไซต์ของคุณ หนึ่งในคุณสมบัติเหล่านั้นที่ถือได้ว่าเป็นการสูญเสียครั้งใหญ่คือแบบฟอร์มการติดต่อ เนื่องจาก AMP ใช้ชุด HTML และ JavaScript ที่จำกัด จึงไม่สามารถโหลดแบบฟอร์ม WordPress ของคุณได้อย่างถูกต้องบนหน้า AMP โชคดีที่มีวิธีแก้ไขปัญหาที่ง่าย WPForms เป็นปลั๊กอินฟอร์ม WordPress ที่เป็นมิตรกับผู้เริ่มต้นใช้งาน ซึ่งช่วยให้คุณสร้างฟอร์ม WordPress ที่พร้อมสำหรับ AMP ดังนั้น ในบทความต่อไปนี้ เราจะอธิบายรายละเอียดเกี่ยวกับวิธีการสร้างฟอร์ม AMP ใน WordPress โดยใช้ WPForms อย่างละเอียด

เรียนรู้วิธีสร้าง AMP Forms ใน WordPress

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

การสร้างแบบฟอร์ม WordPress ด้วย WPForms

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

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

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

การเพิ่มแบบฟอร์ม AMP ให้กับเพจ

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

วิธีเพิ่ม Google reCAPTCHA ลงในแบบฟอร์ม AMP

WPForms มี honeypot ต่อต้านสแปมเพื่อดักจับและบล็อกสแปมโดยค่าเริ่มต้น นอกจากนี้ คุณสามารถใช้ Google reCAPTCHA เพื่อลดการส่งสแปม ในการใช้ Google reCAPTCHA กับแบบฟอร์ม AMP คุณจะต้องลงทะเบียนไซต์ของคุณสำหรับ Google reCAPTCHA v3 และรับคีย์ Google API โดยไปที่เว็บไซต์ Google reCAPTCHA และคลิกที่ปุ่ม 'Admin Console' ที่มุมบนขวาของหน้า จากนั้นคุณจะต้องลงชื่อเข้าใช้ด้วยบัญชี Google ของคุณ เมื่อทำเช่นนั้น คุณจะเห็นหน้า 'ลงทะเบียนไซต์ใหม่' เริ่มกรอกข้อมูลโดยป้อนชื่อเว็บไซต์ของคุณในช่องป้ายกำกับ Google AMP รองรับเฉพาะ reCAPTCHA v3 ดังนั้นคุณจะต้องเลือกจากตัวเลือกประเภท reCAPTCHA

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

การปรับเปลี่ยนเพิ่มเติม

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

เมื่อคุณมีคีย์ Google API เพื่อเพิ่ม reCAPTCHA ในแบบฟอร์ม AMP แล้ว ให้ไปที่หน้า WPForms > การตั้งค่า > reCAPTCHA ในแดชบอร์ด WordPress ของคุณ จากนั้นเลือกตัวเลือก reCAPTCHA v3 และวางรหัสเว็บไซต์และรหัสลับ คลิกที่ปุ่มบันทึกการตั้งค่า เมื่อเพิ่ม Google reCAPTCHA ลงใน WPForms แล้ว คุณสามารถเปิดใช้งานได้ในแบบฟอร์มเมื่อจำเป็น ไปที่ WPForms > All Forms และเลือกแบบฟอร์มที่คุณต้องการเปิดใช้งาน reCAPTCHA เมื่อหน้าจอการตั้งค่าแบบฟอร์มปรากฏขึ้น ให้คลิกที่แท็บ การตั้งค่า และเลือกส่วน การตั้งค่าทั่วไป คุณจะเห็นช่องกาเครื่องหมาย "เปิดใช้งาน Google v3 reCAPTCHA" ทำเครื่องหมายที่ช่องนั้นและบันทึกแบบฟอร์มของคุณ หลังจากนั้น ให้กลับมาที่หน้าติดต่อของคุณอีกครั้งและดูแบบฟอร์ม AMP พร้อมการทำงานของ reCAPTCHA

ไม่ถึงขนาดนั้น

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