วิธีเพิ่มแถบเลื่อนพิเศษให้กับไซต์ WordPress ของคุณ

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

ฉันจะเพิ่ม Slider ในเว็บไซต์ WordPress ของฉันได้ฟรีได้อย่างไร

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

วิธีเพิ่ม Slider ใน WordPress Custom Theme

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

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

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

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

วิธีเพิ่ม Slider ใน WordPress Elementor

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

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

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

วิธีเพิ่มตัวเลื่อนรูปภาพใน WordPress โดยไม่ต้องใช้ปลั๊กอิน

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