วิธีใช้วิดเจ็ต Elementor Shortcodes [คู่มือสำหรับผู้เริ่มต้น]

เผยแพร่แล้ว: 2021-05-30

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

สองสามวันต่อมาใน WordPress Elementor ฉันรู้ว่าฉันสามารถยกระดับกระบวนการสร้างได้สิบเท่าเพียงแค่ใช้ 'Elementor Shortcodes'

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

รหัสย่อของ Elementor คืออะไร

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

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

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

ขั้นแรก คุณต้องคัดลอกข้อมูลโค้ดของส่วนประกอบที่เลือกแล้ววางลงในตำแหน่งที่คุณต้องการทำซ้ำ

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

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

นั่นเป็นหนึ่งในการใช้รหัสย่อวิดเจ็ตขั้นพื้นฐานที่สุด และจริงๆ แล้วมีการใช้งานอย่างมีประสิทธิภาพมากกว่า ดังนั้นหากคุณกำลังคิดอยู่แล้ว…

จะใช้รหัสย่อของ Elementor เมื่อใดและอย่างไร

นี่เป็นกรณีในชีวิตจริงที่ฉันพบว่าเหมาะที่สุดสำหรับการใช้รหัสย่อของ WordPress Elementor:

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

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

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

ไม่ใช่ทุกธีมที่ออกแบบโดยใช้ Elementor ดังนั้นการพยายามแปลงเป็นหน้าเว็บ Elementor อาจทำให้โครงสร้างหน้าเสียหาย

นอกจากนี้ ปลั๊กอินอื่นๆ ที่ไม่รองรับ Elementor จะไม่ให้สิทธิ์เข้าถึงเพื่อแก้ไของค์ประกอบเหล่านั้น และทำให้คุณอยู่ในสถานะหายนะ

แต่ไม่ต้องกังวล...

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

จะติดตั้งรหัสย่อสำหรับ Elementor ได้อย่างไร

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

คำเตือนเล็กน้อย - ทั้งสามขั้นตอนในคู่มือการติดตั้งนี้กำหนดให้คุณต้องติดตั้ง Elementor ใน WordPress ดังนั้น หากคุณยังไม่ได้ดำเนินการดังกล่าว ให้ดำเนินการอย่างรวดเร็วและทบทวนขั้นตอนในภายหลัง

คู่มือการติดตั้งนี้มีสองขั้นตอน – การติดตั้งอัตโนมัติและการติดตั้งด้วยตนเอง

การติดตั้งอัตโนมัติ

  1. ตรงไปที่ 'ปลั๊กอิน' และทำตาม 'เพิ่มใหม่' จากหน้าจอเดียวกัน
  2. มองหา WordPress Shortcodes สำหรับ Elementor
  3. ติดตั้งปลั๊กอินและเปิดใช้งาน

การติดตั้งด้วยตนเอง

  1. ดาวน์โหลด RS<a href=" #”> Elementor Shortcode
  2. แตกไฟล์ shortcode.zip ไฟล์ปลั๊กอินจะอยู่ในไดเร็กทอรีชื่อ rselements-lite
  3. อัปโหลดไฟล์ปลั๊กอินไปยังตำแหน่งการติดตั้ง WordPress ของคุณ ไดเร็กทอรีควรเป็นแบบนี้ – /wp-content/plugins/elementor-short-code.
  4. เปิดใช้งานปลั๊กอินจากส่วน 'ปลั๊กอิน' ในเมนู WordPress

การติดตั้งด้วยตนเองเป็นเพียงตัวอย่างหนึ่งของปลั๊กอินหนึ่งโดยเฉพาะ และกระบวนการนี้ก็คล้ายกันกับปลั๊กอินใดๆ ที่คุณต้องการติดตั้งด้วยตนเอง

วิธีป้อนเทมเพลต Elementor โดยใช้รหัสย่อ

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

WordPress -> เทมเพลต -> เทมเพลตที่บันทึกไว้

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

เทมเพลตที่บันทึกไว้แต่ละรายการมีรหัสสั้นของตัวเอง ซึ่งพร้อมใช้งานในหน้าอื่นๆ เสมอ

ตัวอย่างเช่น คุณต้องการสร้างป๊อปอัป WooCommerce ซึ่งลูกค้าของคุณสามารถดูสถานะคำสั่งซื้อได้

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

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

Elementor ป้อนเนื้อหาลงในหน้าเว็บโดยมีหรือไม่มีรหัสย่อหรือไม่

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

หาก Elementor ใช้รหัสย่อสำหรับทุกเทมเพลตที่สร้างขึ้นในไลบรารี องค์ประกอบของไลบรารีนั้นจะขึ้นอยู่กับปลั๊กอิน Elementor อย่างมาก

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

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

แต่ก่อนที่จะทำอย่างนั้น มันทำสำเนาของเทมเพลตที่คุณออกแบบไว้เป็นโค้ดบนหน้า

ดังนั้น ครั้งหน้าที่คุณคัดลอกบางสิ่งจากที่หนึ่งไปยังอีกที่หนึ่ง คุณกำลังวางรหัสที่ด้านหลัง แต่ทางสายตา คุณกำลังใช้รหัสย่อในการดำเนินการ

ตัวสร้างเพจก่อนหน้านี้เคยมีการพึ่งพาดังกล่าวในปลั๊กอินและเทมเพลตเฉพาะ ซึ่งเป็นเรื่องยากที่จะใช้ปลั๊กอินอื่นบนเว็บไซต์

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

บทสรุป

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