วิธีสร้างหน้า Landing Page ใน WordPress ด้วย Elementor

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

หน้า Landing Page คือโฆษณาออนไลน์ที่ได้รับการออกแบบมาเพื่อวัตถุประสงค์นั้นโดยเฉพาะ จุดประสงค์ของหน้า Landing Page คือการแนะนำให้ผู้ใช้ดำเนินการ (CTA) พวกเขามักจะมีอัตราการแปลงที่สูงกว่าโพสต์บล็อกปกติหรือหน้าเว็บไซต์ พวกเขายังสามารถใช้เพื่อสร้างลูกค้าเป้าหมายและสร้างรายชื่ออีเมล การใช้ Elementor และอินเทอร์เฟซการออกแบบแบบลากและวางแบบภาพ คุณสามารถสร้างหน้า Landing Page สำหรับเว็บไซต์ WordPress ได้ ผู้เข้าชมที่ถูกฟุ้งซ่านจากสิ่งรบกวนสมาธิขณะใช้หน้า Landing Page สามารถดำเนินการต่างๆ ที่คุณต้องการให้พวกเขาทำ มีปลั๊กอิน Elementor ฟรีให้ดาวน์โหลดบน WordPress.org หรือคุณสามารถติดตั้งได้โดยไปที่ Plugins > Add New

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

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

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

ฉันจะสร้างหน้า Landing Page ของ Elementor เป็นโฮมเพจของฉันได้อย่างไร

หากคุณกำลังใช้ตัวสร้างเพจ Elementor มีขั้นตอนง่ายๆ ไม่กี่ขั้นตอนในการทำให้หน้า Landing Page ของคุณเป็นหน้าแรก ขั้นแรก ไปที่การตั้งค่า Elementor ในแดชบอร์ด WordPress ของคุณและเลือกตัวเลือก ' Static Front Page ' ถัดไป สร้างหน้าใหม่และเลือก 'Elementor Canvas' เป็นเทมเพลตหน้า ตอนนี้คุณสามารถเพิ่มเนื้อหาที่คุณต้องการและบันทึกหน้าได้ สุดท้าย ไปที่การตั้งค่า > การอ่านในแดชบอร์ด WordPress และตั้งค่าตัวเลือก 'การแสดงหน้าแรก' เป็น 'หน้าคงที่' เลือกหน้า Landing Page จากเมนูแบบเลื่อนลงและคลิก 'บันทึกการเปลี่ยนแปลง' หน้า Landing Page ของคุณถูกตั้งค่าเป็นหน้าแรกของคุณแล้ว!

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

วิธีการเผยแพร่หน้า Landing Page ของ Elementor

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

Elementor มีแลนดิ้งเพจหรือไม่?

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

ในวิดีโอทีละขั้นตอนนี้ คุณจะได้เรียนรู้วิธีสร้าง หน้า Landing Page ที่มีสไตล์ ด้วย Elementor เมื่อคุณเลือกเมนูแบบเลื่อนลงแล้ว คุณสามารถเริ่มเพิ่มบล็อคที่จะทำหน้าที่เป็นหน้า Landing Page หน้า Landing Page สามารถจัดโครงสร้างได้หลายวิธี เมื่อสร้างหน้า Landing Page โดยทั่วไปส่วนหัวจะถูกจำกัด เมื่อผู้เยี่ยมชมเข้าชมหน้าเพจเป็นครั้งแรก เขาหรือเธอจะถูกนำเสนอพร้อมฮีโร่ กรอกแบบฟอร์มต่อไปนี้: Title, Sub-Sub-Subscriber และ Sub-Subscriber ก่อนเผยแพร่หน้า Landing Page คุณควรตรวจสอบดูว่าทุกอย่างได้รับการจัดระเบียบอย่างเหมาะสมหรือไม่ บล็อกทั้งหมดตอบสนองต่ออุปกรณ์เคลื่อนที่อย่างสมบูรณ์ ช่วยให้คุณเปลี่ยนระยะขอบ ช่องว่างภายใน และการตั้งค่าอื่นๆ บนอุปกรณ์เคลื่อนที่และแท็บเล็ต โดยทำตามบทช่วยสอนนี้ คุณจะได้เรียนรู้วิธีการใช้งาน

URL หน้า Landing Page ของ Elementor

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

วิธีสร้างเพจโดยใช้ Elementor

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

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

คุณสามารถเปลี่ยนสี ขนาด คำแนะนำเครื่องมือ และคุณลักษณะอื่นๆ ของการนำทางแบบหน้าเดียวได้โดยคลิกที่แท็บ ลักษณะ คุณสามารถเพิ่มสไตล์และเงาของกล่องให้กับเส้นขอบได้ นี่คือตัวอย่างของเว็บไซต์หน้าเดียวที่น่าทึ่งด้วย Elementor One-Page Navigation Widget

การสร้างหน้าใหม่บนเว็บไซต์ WordPress ของคุณ

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

ไม่พบหน้า Landing Page ของ Elementor

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

วิธีสร้างหน้า Landing Page เป็นโฮมเพจของคุณ

หากคุณต้องการสร้างหน้า Landing Page เป็นหน้าแรก ให้ทำเครื่องหมายที่ช่อง "Your homepage displays:" แล้วเปลี่ยนตัวเลือก "A static page" ในเครื่องมือปรับแต่งเป็น "หน้า Landing Page ของคุณ" หน้าแรกที่คุณสร้างในขั้นตอนข้างต้นจะมองเห็นได้จากเมนูดรอปดาวน์

ตัวอย่างหน้า Landing Page ของ Elementor

มีหลายวิธีในการสร้างหน้า Landing Page โดยใช้ Elementor วิธีหนึ่งคือการใช้เทมเพลตหน้า Landing Page ที่ออกแบบไว้ล่วงหน้า นี่อาจเป็นตัวเลือกที่ดีหากคุณต้องการสร้างหน้า Landing Page อย่างรวดเร็วและง่ายดาย อีกทางเลือกหนึ่งคือใช้ Elementor Page Builder เพื่อสร้าง หน้า Landing Page ที่กำหนดเอง ตัวเลือกนี้ช่วยให้คุณควบคุมการออกแบบหน้า Landing Page ได้มากขึ้น แต่อาจใช้เวลาสร้างเพิ่มขึ้นเล็กน้อย

หน้า Landing Page คือเว็บไซต์หน้าเดียวที่แนะนำให้ผู้ใช้ดำเนินการหากจำเป็นต้องซื้อ สมัครรับข้อมูล ดาวน์โหลด หรือลงชื่อสมัครใช้รายชื่ออีเมล ผู้คนถูกดึงดูดโดยโฆษณาที่ปรากฏในอีเมล โซเชียลเน็ตเวิร์ก และเว็บไซต์อื่นๆ เมื่อหน้า Landing Page มีข้อมูลเกี่ยวกับสาเหตุที่ผู้ใช้ต้องการผลิตภัณฑ์ ก็เป็นวิธีที่มีประสิทธิภาพในการเปลี่ยนผู้เข้าชม ข้อมูล ภาพ ประโยชน์ คำกระตุ้นการตัดสินใจ (CTA) ปุ่ม และไอคอนโซเชียลล้วนเป็นส่วนหนึ่งของหน้า Landing Page Elementor ทำให้ผู้ใช้สามารถออกแบบเลย์เอาต์ของหน้าตามตำแหน่งที่ต้องการได้ เมื่อคุณหารด้วยสิ่งที่ต้องมีหรือไม่ คุณกำลังสร้างสถานการณ์ที่ยากมาก หากคุณต้องการให้หน้า Landing Page ใช้งานได้ คุณควรหลีกเลี่ยงการใช้วิดเจ็ตมากเกินไป

ด้วยปลั๊กอิน JetElements สำหรับ Elementor คุณสามารถเข้าสู่ระบบโลกเวทมนตร์การออกแบบเว็บได้ วิดเจ็ตสามารถแบ่งออกเป็นหมวดหมู่ต่างๆ ได้ ขึ้นอยู่กับฟังก์ชันของมัน: ให้ผู้ใช้สัมผัสผลิตภัณฑ์ ขีดข่วนฉลาก ลอกฝาครอบออก และทำสิ่งเดียวกันกับที่เราทำในชีวิตประจำวัน ต่อไปนี้เป็นเทมเพลตทางเลือกห้าแบบสำหรับหน้า Landing Page ของ Elementor ที่ต้องพิจารณา ด้วย JetElements คุณสามารถปรับแต่ง วิดเจ็ตหน้า Landing Page ทั้งหมดได้ เนื่องจากวิดเจ็ตทางด้านซ้ายเป็นแบบลากและวาง คุณควรวางวิดเจ็ตที่ดีที่สุดในตำแหน่งที่เหมาะสม ปุ่ม CTA, แบบฟอร์มการติดต่อ, ตัวจับเวลา, แถบเลื่อนตรวจสอบ, ป๊อปอัป, วิดีโอ YouTube, แผนที่ และองค์ประกอบอื่นๆ ที่สื่อถึงประสบการณ์ของ Elementor คือตัวอย่างของวิดเจ็ต Aptitude บนหน้า Landing Page ของ Elementor