สำหรับธุรกิจบางประเภท เช่น บริการแก้ไขรูปภาพ การเพิ่มการเปรียบเทียบรูปภาพอาจเป็นเครื่องมือที่มีประโยชน์ในการอธิบายบริการของคุณ คุณสามารถเพิ่มการเปรียบเทียบรูปภาพในหน้าแรก หน้า Landing Page หรือหน้าใดๆ ที่คุณพูดถึงบริการที่คุณนำเสนอ
Elementor แท้จริงแล้วไม่มีวิดเจ็ตหรือฟังก์ชันใด ๆ เพื่อเพิ่มการเปรียบเทียบภาพ แต่คุณสามารถดาวน์โหลดได้โดยใช้โปรแกรมเสริม มีโมดูลเพิ่มเติม Elementor ซึ่งมีวิดเจ็ตเพื่อเพิ่มการเปรียบเทียบภาพ สามในนั้นคือ: ส่วนเสริมที่จำเป็น, Addons มีความสุขและ JetElements.
ในบทความนี้ เราจะแสดงวิธีเพิ่มการเปรียบเทียบรูปภาพ Elementor โดยใช้ JetElements
JetElements ตัวเองเป็นโปรแกรมเสริมระดับพรีเมียมสำหรับ Elementor ที่พัฒนาโดย Crocoblock เป็นส่วนหนึ่งของตระกูล JetPlugins ส่วนเสริมมาพร้อมกับวิดเจ็ตที่เรียกว่า ภาพเปรียบเทียบ ซึ่งคุณสามารถใช้เพื่อเพิ่มการเปรียบเทียบภาพไปยังหน้า Elementor
วิธีเพิ่มการเปรียบเทียบรูปภาพใน Elementor
ตรวจสอบให้แน่ใจว่าคุณได้ติดตั้งและเปิดใช้งานส่วนเสริม JetElements ก่อนเริ่มต้น หากคุณยังใหม่กับ Elementor คุณสามารถอ่านบทความก่อนหน้าของเราเพื่อเรียนรู้ วิธีใช้ Elementor.
เราจะเพิ่มวิดเจ็ตโดยตรง ภาพเปรียบเทียบ ในบทความนี้.
ก่อนที่คุณจะเริ่ม คุณสามารถเตรียมภาพสองภาพเพื่อเปรียบเทียบได้ ตัวอย่างเช่น คุณสามารถเตรียมภาพก่อนและภาพหลังได้ เมื่อคุณพร้อมเพียงลากวิดเจ็ต ภาพเปรียบเทียบ ในกล่องแก้ไข Elementor
ตามค่าเริ่มต้น วิดเจ็ต JetElements Image Compare จะสร้างการเปรียบเทียบภาพสองภาพ หากคุณต้องการเพียงแค่สร้างการเปรียบเทียบภาพ (สองภาพเพื่อเปรียบเทียบ) คุณสามารถลบการเปรียบเทียบภาพที่มีอยู่ได้
อ่าน: Elementor: วิธีเพิ่มแอนิเมชั่น Lottie
หากต้องการเพิ่มภาพก่อนและหลัง ให้เปิดการเปรียบเทียบภาพที่มีอยู่ (โดยคลิกที่ภาพ) เพื่อแก้ไข เนื้อหา. เพียงเลือกภาพก่อนหน้าบน ก่อนภาพ ส่วนและเลือกภาพหลังจากบน หลังภาพ ส่วน. อย่างที่คุณเห็น คุณยังสามารถแทนที่ป้ายกำกับสำหรับแต่ละส่วนได้
เมื่อเลือกภาพเสร็จแล้ว ก็สามารถเปิดบล็อค การตั้งค่า เพื่อกำหนดตำแหน่งเริ่มต้นของตัวคั่น หากคุณต้องการเพิ่มการเปรียบเทียบภาพมากกว่าหนึ่งภาพ คุณสามารถตั้งค่าการตั้งค่าภาพหมุนได้
จากนั้นคุณสามารถจัดรูปแบบการเปรียบเทียบภาพของคุณโดยสลับไปที่แท็บ สไตล์. คุณสามารถเปิดช่องปรับแต่งได้ห้าช่องเพื่อจัดรูปแบบการเปรียบเทียบภาพของคุณ แต่ถ้าคุณต้องการเพียงเพิ่มการเปรียบเทียบภาพ คุณเพียงแค่ต้องเปิดสามช่วงตึกแรก
- ทั่วไป
คุณสามารถเปิดบล็อกนี้เพื่อตั้งค่าช่องว่างภายใน เงาของกล่อง ประเภทเส้นขอบ และรัศมีของเส้นขอบ
- ฉลาก
คุณสามารถเปิดบล็อกนี้เพื่อจัดรูปแบบป้ายกำกับเปรียบเทียบ (ป้ายกำกับ “ก่อน” และ “หลัง”) คุณสามารถตั้งค่าต่างๆ เช่น การจัดตำแหน่งแนวนอน การจัดแนวตั้ง สีข้อความ สีพื้นหลัง ตัวพิมพ์ (ตระกูลแบบอักษร ลักษณะแบบอักษร ขนาดแบบอักษร) ฯลฯ...
- จัดการ
คุณสามารถเปิดบล็อกนี้เพื่อจัดรูปแบบแฮนเดิลได้ คุณสามารถตั้งค่าต่างๆ เช่น การจัดตำแหน่งแฮนเดิล ความกว้างของการควบคุม ความสูงของการควบคุม สีของแฮนเดิล (ไม่ว่าจะเป็นสถานะปกติหรือโฮเวอร์) และอื่นๆ
หากคุณเพิ่มการเปรียบเทียบภาพมากกว่าหนึ่งภาพ คุณยังสามารถเปิดบล็อค ลูกศรหมุน et จุดหมุน เพื่อจัดรูปแบบลูกศรและจุดนำทาง
แค่นั้นแหละ. คุณสามารถคลิกที่ปุ่ม Publier / อัปเดต สำหรับ ประกาศ / แก้ไขหน้าของคุณเมื่อคุณแก้ไขเสร็จแล้ว
รับ Elementor Pro ทันที!!!
สรุป
ที่นี่ ! เพียงเท่านี้บทความนี้ก็จะแสดงให้คุณเห็นว่า เพิ่มการเปรียบเทียบภาพใน Elementor. หากคุณมีข้อกังวลใด ๆ เกี่ยวกับวิธีการเดินทางไปที่นั่น แจ้งให้เราทราบภายใน ความเห็น.
อย่างไรก็ตามคุณสามารถปรึกษาได้ ทรัพยากรของเราหากคุณต้องการองค์ประกอบเพิ่มเติมเพื่อดำเนินโครงการสร้างเว็บไซต์อินเทอร์เน็ตของคุณโดยปรึกษากับเราใน การสร้างบล็อก WordPress หรือที่อยู่บน Divi: ธีม WordPress ที่ดีที่สุดตลอดกาล.
แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.
...
