ฉันจะสร้างภาพหมุนบน WordPress ได้อย่างไร
เผยแพร่แล้ว: 2021-12-06ปรับปรุงล่าสุด - 8 มีนาคม 2022
คุณอาจไม่ทราบคำว่า carousel แต่ยังคงเห็นบ่อยในตลาดดิจิทัล ภาพหมุนถูกใช้ในเว็บไซต์ยุคใหม่ส่วนใหญ่: รูปภาพแบบเลื่อนรวมถึงบทสรุปเกี่ยวกับผลิตภัณฑ์หรือบริการที่ธุรกิจนำเสนอ ภาพจะหมุนและเข้าและออกจากมุมมองโดยอัตโนมัติ
ภาพหมุนช่วยให้ผู้เยี่ยมชมเว็บไซต์ติดงอมแงมได้นานขึ้น เนื่องจากรูปภาพแบบเลื่อนทำให้พวกเขาอยากรู้มากขึ้นเกี่ยวกับผลิตภัณฑ์หรือบริการที่ธุรกิจนำเสนอ ในบางกรณี การเลื่อนรูปภาพจะไม่ทำงานโดยอัตโนมัติ และผู้เข้าชมต้องหมุนรูปภาพด้วยตนเองเพื่อแสดงสไลด์ถัดไป
สร้างภาพหมุนใน WordPress
ภาพหมุนสามารถใส่ข้อความที่ชัดเจนและเปิดเผยเกี่ยวกับธุรกิจได้มากโดยไม่ต้องมีคำอธิบายแบบยาว ทั้งนี้ขึ้นอยู่กับโทนสีของธุรกิจ หากคุณอยากเรียนรู้วิธีรวมภาพหมุนในเว็บไซต์ของคุณ แสดงว่าคุณมาถูกที่แล้ว
เราจะอธิบายขั้นตอนการติดตั้งปลั๊กอิน Smart Slider 3 ใน word press มีเครื่องมืออื่นๆ อีกหลายอย่างสำหรับงาน และขั้นตอนการติดตั้งอาจคล้ายกับ Smart Slider 3
ก่อนที่จะเข้าสู่บทช่วยสอน มีคำเตือนเล็กน้อยหนึ่งข้อ หากคุณกำลังขายสินค้าบนเว็บไซต์ การเลือกภาพหมุนอาจไม่ใช่ตัวเลือกที่ฉลาดที่สุด ในแง่ของคอนเวอร์ชั่น แต่ถ้าคุณกำลังถ่ายภาพหรือออกแบบเว็บไซต์และต้องการให้ดูสวยงามน่าพึงพอใจ โปรดอ่านบล็อกทั้งหมด
เริ่มต้นด้วยการเลือกขนาดภาพ
Smart slide 3 จะปรับขนาดรูปภาพใน wordpress ตามรูปแบบการนำเสนอที่เลือก ดังนั้น หากรูปภาพมีขนาดใหญ่ เครื่องมือจะลดขนาดลงและในทางกลับกัน และคุณอาจทราบดีว่าเมื่อซูมภาพขนาดเล็ก คุณภาพจะเริ่มลดลง ดังนั้น พยายามอย่ารวมภาพที่เล็กกว่าขนาดของภาพหมุน
ยิ่งไปกว่านั้น รูปภาพขนาดใหญ่จะดูดีกว่าใน Carousel แต่ยังมีเวลาดาวน์โหลดที่สูงกว่าด้วย ดังนั้น คุณต้องสร้างสมดุลระหว่างคุณภาพและขนาด ดังนั้นมันจึงยังดูดีใน Slider
เคล็ดลับเล็ก ๆ ประการหนึ่ง: ภาพหมุนเลื่อนในแนวนอน ดังนั้นการเลือกภาพที่กว้างขึ้นจะน่าดึงดูดใจมากกว่าภาพสี่เหลี่ยมจัตุรัส
การติดตั้ง Smart Slider 3
กระบวนการติดตั้ง Smart Slider 3 ค่อนข้างเหมือนกันสำหรับเครื่องมืออื่นๆ ในตลาด ในการเริ่มต้น ขั้นแรก ให้เข้าสู่ระบบ word กด admin dashboard ทางด้านซ้ายมือ คุณจะเห็นแผงการนำทางที่มีตัวเลือกต่างๆ ให้เลือกมากมาย จากตัวเลือก ให้เลือกปลั๊กอินและคลิกลิงก์ "เพิ่มใหม่"
แถบค้นหาจะปรากฏขึ้นต่อหน้าคุณ ค้นหา Smart Slider 3 ในนั้น เมื่อติดตั้งปลั๊กอินแล้ว โปรดคลิกที่ตัวเลือกเปิดใช้งาน
การเดินทางของภาพหมุนเริ่มต้น
Smart Slider 3 ใช้รูปภาพจากไลบรารีสื่อ ดังนั้นอย่าลืมอัปโหลดรูปภาพบางรูปก่อนที่คุณจะเริ่มสร้าง Slider คุณสามารถดูวิดีโอแนะนำการใช้งานเพื่อรับข้อมูลเชิงลึกเกี่ยวกับวิธีเริ่มเลือกรูปภาพและเพิ่มลงในรูปแบบการนำเสนอของคุณได้ดียิ่งขึ้น กดที่ Smart Slider 3 และรับวิดีโอแนะนำ “Learn Smart Slider 3” ที่ให้ความรู้เชิงลึกเกี่ยวกับวิธีการใช้งานเครื่องมือ
คุณสามารถใช้ความช่วยเหลือจากวิดีโอหรือเพียงแค่อ่านบทความนี้เพื่อเริ่มต้น
เลือกตัวเลือกพื้นฐานจากเมนู
- ตั้งชื่อ Slider ของคุณเพื่อให้ค้นหา Carousel ได้ง่ายขึ้นเมื่อจัดการหลาย carousel พร้อมกัน
- ความกว้างและขนาดส่งผลต่อขนาดและรูปร่างของตัวเลื่อน ละเว้นการเลือกพิกเซลที่คุณต้องการกำหนดค่าให้ใช้ความกว้างเต็มของอุปกรณ์หรือเบราว์เซอร์
- การเลือกความกว้างและขนาดเริ่มต้นจะเป็นการตั้งค่า Carousel ที่ความกว้างและขนาดปัจจุบัน ในขณะที่การเลือกตัวเลือก "ความกว้างเต็ม" จะไม่สนใจมิติใดๆ และทำให้ภาพหมุนหมุนไปรอบๆ ความกว้างทั้งหมดของหน้าต่าง
หลังจากปรับภาพให้เหมาะสมแล้วให้กด "สร้าง"
การเพิ่มรูปภาพไปยัง Slider
เมื่อคุณกำหนดค่าขนาดและความกว้างเริ่มต้นของภาพหมุนแล้ว ขั้นตอนต่อไปที่ชัดเจนคือการเติมภาพหมุนด้วยภาพที่น่าสนใจ สำหรับสิ่งนี้ ให้ทำตามขั้นตอนด้านล่าง:
- คลิกที่เพิ่มภาพสไลด์ใน Smart Slider 3
- คุณจะได้รับตัวเลือกให้เลือกรูปภาพสำหรับ Slider ของคุณ คลิกที่ตัวเลือกนั้น
- เลือกรูปภาพจากไลบรารีของเวิร์ดเพรส
- ภาพหมุนจะนำเสนอภาพที่เลือก เมื่อคุณพอใจกับภาพที่เลือกแล้ว ให้คลิกที่ส่วน "เผยแพร่"
หากคุณวางแผนที่จะแทรกตัวเลื่อนภายในโค้ด ให้คัดลอกโค้ด PHP จากเครื่องมือหรือเลือกตัวเลือกตัวแก้ไขโพสต์
เมื่อคุณเริ่มเขียนบล็อกใหม่สำหรับเว็บไซต์ ตัวเลื่อนอัจฉริยะสามตัวเลือกจะปรากฏขึ้นบนหน้า หากคุณกำลังใช้ตัวแก้ไขแบบคลาสสิก ให้คลิกที่ไอคอนตัวเลื่อนอัจฉริยะ ตอนนี้ เลือก Slider แบบกำหนดเองที่คุณเตรียมไว้ก่อนหน้านี้ และเมื่อคุณเผยแพร่โพสต์ ตัวเลื่อนจะถูกอัปโหลดไปยังเว็บไซต์และพร้อมให้ผู้เยี่ยมชมได้เห็น
ม้าหมุนจะส่งต่อหรือลิงก์ย้อนกลับที่แถบเลื่อนทั้งสองด้านเพื่อเลื่อนดูรูปภาพด้วยตนเอง
ตามค่าเริ่มต้น ภาพหมุนจะไม่เลื่อนโดยอัตโนมัติ แต่คุณสามารถเปลี่ยนได้
วงจรอัตโนมัติสำหรับภาพหมุน
ในแดชบอร์ดผู้ดูแลระบบ WordPress ให้คลิกที่ลิงก์ Smart Slider 3 แล้วเลือกตัวเลือกแก้ไข เลือกรูปแบบ "เล่นอัตโนมัติ" และกด "เปิดใช้งาน" เวลาเริ่มต้นระหว่างสวิตช์คือแปดวินาที ตอนนี้ให้บันทึกการตั้งค่าที่อัปเดตจากปุ่มบันทึกที่ด้านขวามือของแผง
ใช้ Carousel เป็น Widget
Smart Slider ยังสามารถใช้เป็น WordPress Slider Image คุณสามารถเพิ่มตัวเลื่อนเหล่านี้ได้ทุกที่ในฐานะวิดเจ็ต เช่น แถบด้านข้าง
- คุณจะเห็นแผงการนำทางด้านซ้ายมือ คลิกเหนือลักษณะที่ปรากฏ แล้วคลิกลิงก์ "วิดเจ็ต"
- เมื่อคุณเห็นส่วน "วิดเจ็ตที่ใช้งานได้" ให้คลิกปุ่ม "ตัวเลื่อนอัจฉริยะ"
- เลือกโซนที่คุณต้องการให้แสดงภาพและเลือกปุ่ม "เพิ่มวิดเจ็ต"
รูปภาพหรือไม่มีรูปภาพเป็นคำถามใหญ่
การออกแบบและพัฒนาเว็บไซต์เป็นเรื่องเฉพาะบุคคล และสิ่งที่ผู้อื่นอาจเห็นว่าน่าสนใจ บางอย่างอาจไม่เป็นเช่นนั้น โดยต้องผ่านการอัปเดตและการแก้ไขหลายขั้นตอน และ Image carousel เคยเป็นข้อกำหนดที่เป็นที่ต้องการมากที่สุดในเว็บไซต์เมื่อธุรกิจต่างๆ เริ่มรวมเข้าด้วยกันในทุกที่
การสนทนาข้างต้นได้ให้คำแนะนำทีละขั้นตอนในการเพิ่มภาพหมุนในเว็บไซต์ กระบวนการนี้ไม่ซับซ้อนและต้องใช้ความอดทนและความเชี่ยวชาญในการเลือกภาพที่เกี่ยวข้องเพื่อเพิ่มรูปลักษณ์ของเว็บไซต์ ภาพหมุนจะมีส่วนร่วมอย่างมากสำหรับเว็บไซต์ที่สร้างสรรค์ ในขณะที่เว็บไซต์อีคอมเมิร์ซจะไม่เป็นประโยชน์
ดังนั้น ครั้งต่อไปที่คุณวางแผนที่จะเพิ่มภาพที่มีชีวิตชีวาในแถบเลื่อน ให้พิจารณาการประเมินว่าจะเพิ่มมูลค่าให้กับเว็บไซต์หรือส่งผลต่ออัตราการแปลงในระดับที่มีนัยสำคัญหรือไม่
อ่านเพิ่มเติม
- จะปรับขนาดภาพผลิตภัณฑ์ให้เหมาะสมได้อย่างไร
- ปลั๊กอิน Image Zoom ที่ดีที่สุดสำหรับ WooCommerce
- เคล็ดลับอันชาญฉลาดในการปรับปรุงรูปภาพ