วิธีเพิ่มแบบฟอร์มสมัครสมาชิก Mailrelay โดยใช้ WordPress

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

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

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

ไม่ต้องกังวลในบทช่วยสอนนี้ เราจะแสดงวิธีต่างๆ ในการเพิ่มโค้ด HTML ที่สร้างโดย Mailrelay ในเว็บไซต์ของคุณซึ่งสร้างโดยใช้ WordPress แบบมีและไม่มีปลั๊กอิน

น่าสนใจใช่ไหม

การชี้แจงที่สำคัญ: สำหรับบทช่วยสอนนี้ เราจะถือว่าคุณได้สร้างแบบฟอร์มการเลือกรับในบัญชีของคุณแล้ว และคุณได้คัดลอกโค้ด HTML แล้ว ดังนั้น เราจะเน้นที่การอธิบายวิธีเพิ่มโค้ดนี้บน WordPress หากคุณยังไม่ได้สร้างแบบฟอร์ม หรือคุณยังไม่ได้คัดลอกโค้ด HTML เราขอแนะนำให้คุณอ่านโพสต์อื่นนี้ก่อนและทำตามขั้นตอนที่ระบุ: แบบฟอร์มการสมัคร Mailrelay V3

· วิธีผสานรวมแบบฟอร์มการสมัครใช้งาน Mailrelay โดยไม่ต้องใช้ปลั๊กอินใดๆ

เราต้องเริ่มบทช่วยสอนนี้โดยบอกว่าเราไม่สามารถหลอกตัวเองได้ พวกเราส่วนใหญ่จะพยายามหาปลั๊กอินเพื่อทำงานทั้งหมดให้กับเราบนไซต์ของเรา เพราะมันทำให้ชีวิตของเราง่ายขึ้นมาก

อย่างไรก็ตาม สิ่งสำคัญที่ต้องจำไว้คือการติดตั้งปลั๊กอินจำนวนมากบนไซต์ของเราสามารถโหลดหน้าเว็บได้

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

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

ยังไง?

โดยทำตามขั้นตอนเหล่านี้:

ในการเริ่มต้น คุณจะต้องลงชื่อเข้าใช้ WordPress และคลิกที่ " ลักษณะที่ปรากฏ" และบน "วิดเจ็ต"

ในส่วนวิดเจ็ต เราต้องหาวิดเจ็ตชื่อ “ HTML ที่กำหนดเอง ” เมื่อเราพบแล้ว เราสามารถลากไปยังพื้นที่วิดเจ็ตที่เราต้องการเพิ่มแบบฟอร์มการเลือกใช้ของเรา

ตามค่าเริ่มต้น WordPress มีพื้นที่วิดเจ็ตในแถบด้านข้างของหน้า

เราสามารถแทรกไว้ที่นั่น หรือถ้าธีมหรือเทมเพลตของเรามีส่วนอื่นๆ ของ วิดเจ็ตที่เปิดใช้งาน เราก็สามารถเปลี่ยนสถานที่ได้ (เช่น ในส่วนท้าย)

ในกรณีนี้ เราจะเพิ่มลงในพื้นที่ทั่วไปของวิดเจ็ต เนื่องจากเว็บไซต์ WordPress ทั้งหมดมีตัวเลือกนี้โดยค่าเริ่มต้น มาเพิ่ม โค้ด HTML ในแถบด้านข้างกัน

เราแค่ต้องลากวิดเจ็ตมาที่บริเวณนี้ เพิ่มชื่อ และวางโค้ดที่สร้างโดย Mailrelay จำไว้ว่าคุณได้สร้าง โค้ด HTML แล้วก่อนที่จะเริ่ม อ่านบทช่วยสอนนี้

หลังจากตั้งชื่อวิดเจ็ต (ในส่วนชื่อ) และใส่รหัส (ในส่วนเนื้อหา) แล้ว คุณจะต้องคลิกปุ่มบันทึก

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

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

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

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

· วิธีผสานรวมแบบฟอร์มสมัครสมาชิก Mailrelay ใน WordPress กับ Elementor (เวอร์ชันฟรี)

วิธีผสานรวมแบบฟอร์มการสมัคร Mailrelay ใน WordPress กับ Elementor (เวอร์ชันฟรี)

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

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

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

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

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

ค้นหา “ตัวสร้างหน้า องค์ประกอบ ” ในที่เก็บ WordPress และคลิกติดตั้ง

เมื่อติดตั้งแล้ว อย่าลืมเปิดใช้งาน และเราพร้อมที่จะรวมโค้ดของเรา

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

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

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

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

ในการเปลี่ยนแปลงหรือแก้ไขรูปแบบ คุณจะต้องแก้ไข HTML หรือใช้ปลั๊กอินเฉพาะที่ช่วยให้เราปรับแต่งแบบฟอร์มการสมัครรับข้อมูลของเรา (เช่น Bloom เป็นต้น)

· วิธีผสานรวมแบบฟอร์มสมัครสมาชิก Mailrelay ใน WordPress กับ Bloom

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

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

หากต้องการสร้างแบบฟอร์มใหม่ เพียงคลิกปุ่มสีน้ำเงินที่ด้านบนของหน้าจอ " new opt-in ” หรือรูปแบบใหม่

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

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

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

ทันทีหลังจากเลือกตัวเลือกนี้ ระบบจะแสดงกล่องสีเทาซึ่งเราสามารถแทรกโค้ดตัวอย่างของแบบฟอร์มได้ ในกรณีนี้ คุณควรวางโค้ด HTML ที่สร้างโดย Mailrelay และคลิกที่ปุ่ม "Next design your opt-in"

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

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

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

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

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

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

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

เราได้สร้างและกำหนดค่าแบบฟอร์ม Bloom แล้ว ขั้นตอนต่อไปคือการรวมเข้ากับเว็บไซต์ของเราอย่างถูกต้อง

ในการทำเช่นนั้น ในรูปแบบ Bloom / opt-in เราจะมองหาแบบฟอร์มที่เราเพิ่งสร้างขึ้น และทางด้านซ้าย เราจะพบสัญลักษณ์นี้ "[]"

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

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

ในทางกลับกัน หากเรากำลังทำงานกับ Gutenberg ซึ่งเป็นระบบใหม่ที่สร้างโดย WordPress เราสามารถรวม Shortcode ของเราโดยใช้วิดเจ็ตที่ฝังไว้เพื่อจุดประสงค์นี้โดยเฉพาะ

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

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

· บทสรุป

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

ดังที่เราได้เห็นแล้ว คุณสามารถผสานรวม Mailrelay กับ WordPress โดยไม่ต้องใช้ปลั๊กอิน ผ่านทางส่วนวิดเจ็ต หรือแม้แต่การใช้ Gutenberg ซึ่งเป็นคุณลักษณะใหม่ที่นำเสนอโดย WordPress

อย่างไรก็ตาม หากคุณมีโปรแกรมแก้ไขภาพอยู่แล้ว เช่น Divi, Elementor หรือปลั๊กอิน Opt-in อื่น ๆ คุณยังสามารถใช้พวกมันเพื่อเพิ่มแบบฟอร์มของคุณได้ทุกที่ที่คุณต้องการ ในกรณีของ Bloom ข้อได้เปรียบหลักที่เรามีคือปลั๊กอินช่วยให้เราแก้ไขรูปแบบแบบฟอร์มได้อย่างง่ายดาย เพื่อให้มีความเป็นส่วนตัวมากขึ้น และปรับโค้ดให้เข้ากับเลย์เอาต์ของไซต์ของเรา

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

และตอนนี้ คุณต้องการรวมฟอร์ม Mailrelay ของคุณเข้ากับเว็บไซต์ WordPress ของคุณหรือไม่?