| วัตถุประสงค์ | เพิ่ม จัดระเบียบ ใช้ซ้ำ และปรับแต่งภาพและสื่ออื่น ๆ สำหรับ Cloudbeds Website ของคุณ |
| เหมาะสำหรับ | ผู้จัดการ/ผู้จัดการทั่วไป และผู้ดูแลระบบที่ดูแลสื่อบนเว็บไซต์หรือเตรียมภาพสำหรับ Cloudbeds Website |
| ใช้เมื่อ | คุณต้องการเพิ่มหรือจัดระเบียบสื่อเว็บไซต์ที่ใช้ซ้ำได้ เลือกขนาดหรือรูปแบบของภาพ หรือปรับปรุงประสิทธิภาพของภาพ |
| ข้อกำหนด | Cloudbeds Website และการเข้าถึงเพื่อเปิดตัวแก้ไข Cloudbeds Websites Editor |
| ผลลัพธ์ที่คาดหวัง | สื่อของคุณถูกจัดระเบียบใน Media Manager และพร้อมใช้งานซ้ำในตัวแก้ไข โดยมีภาพที่มีขนาดและรูปแบบเหมาะสมกับการใช้งานที่ตั้งใจไว้ |
บทนำ
ใช้ Media Manager ใน Cloudbeds Websites เพื่อเพิ่ม จัดระเบียบ และใช้ซ้ำสื่อเว็บไซต์จากคลังกลางเดียว Media Manager รองรับภาพ ไอคอน วิดีโอ เสียง และไฟล์ บทความนี้ยังให้ข้อมูลจำเพาะของภาพและคำแนะนำการปรับแต่งเพื่อให้คุณเลือกไฟล์ที่แสดงผลได้ดีโดยไม่ส่งผลกระทบต่อประสิทธิภาพของหน้าเว็บโดยไม่จำเป็น
ใช้ Media Manager เมื่อคุณต้องการสร้างหรือจัดระเบียบคลังสื่อที่ใช้ซ้ำได้ เมื่อคุณกำลังแก้ไขหน้าและต้องการวางทรัพย์สินที่มีอยู่ ให้ใช้ เพิ่ม > สื่อ ใน Cloudbeds Websites Editor
สารบัญ
- เข้าถึงตัวจัดการสื่อ
- อัปโหลดและจัดระเบียบสื่อ
- ใช้สื่อในตัวแก้ไขเว็บไซต์
- ข้อกำหนดและการปรับแต่งภาพ
- ขนาดภาพที่แนะนำ
- คำแนะนำการใช้ภาพตามประเภท
- ประสิทธิภาพภาพและการออกแบบตอบสนอง
เข้าถึงตัวจัดการสื่อ
เปิดตัวจัดการสื่อจากตัวแก้ไข Cloudbeds Websites เมื่อคุณต้องการดูหรือจัดการทรัพย์สินเว็บไซต์ที่นำกลับมาใช้ใหม่ได้
- จาก เมนูหลัก ของ Cloudbeds พีเอ็มเอส
ไปที่ Cloudbeds Digital Marketing แล้วเลือก Websites
- เลือก แก้ไขเว็บไซต์ของฉัน เพื่อเปิดตัวแก้ไข Cloudbeds Websites
- ในแผงตัวแก้ไขด้านซ้าย เลือก CMS แล้วเลือก ตัวจัดการสื่อ
แถบนำทางตัวแก้ไขจะแสดง ตัวจัดการสื่อ ภายใต้ CMS ในแผงด้านซ้าย:
อัปโหลดและจัดระเบียบสื่อ
ตัวจัดการสื่อเก็บทรัพย์สินเว็บไซต์ที่นำกลับมาใช้ใหม่ไว้ในที่เดียว คุณสามารถจัดการ ภาพ, ไอคอน, วิดีโอ, เสียง และ ไฟล์ จากคลังเดียวกันได้
คุณสามารถใช้ตัวจัดการสื่อเพื่อ:
- อัปโหลดหรือ นำเข้าสื่อ: เพิ่มเนื้อหาจากคอมพิวเตอร์ของคุณหรือบริการคลาวด์ที่รองรับ เช่น Facebook, Dropbox, Google Drive, Google Photos และ Instagram
- สร้างโฟลเดอร์: จัดกลุ่มทรัพย์สินที่เกี่ยวข้องเป็นหมวดหมู่ เช่น โลโก้, ภาพภายนอก หรือประเภทห้องพักเฉพาะ เพื่อให้ง่ายต่อการค้นหาและนำกลับมาใช้ใหม่
- เปลี่ยนชื่อไฟล์และโฟลเดอร์: ใช้ชื่อที่ชัดเจนเพื่อให้ง่ายต่อการระบุทรัพย์สินหรือหมวดหมู่ในภายหลัง
- จัดระเบียบตามประเภทเนื้อหา: ใช้พื้นที่สำหรับ ภาพ, ไอคอน, วิดีโอ, เสียง และไฟล์ เพื่อทำงานกับประเภทสื่อที่คุณต้องการ
สำหรับการสมัครสมาชิก Cloudbeds Website Builder ที่เริ่มตั้งแต่ปลายเดือนพฤษภาคม 2569 เป็นต้นไป ภาพที่มีอยู่ในโปรไฟล์ที่พักและการตั้งค่าห้องใน Cloudbeds พีเอ็มเอส จะถูกนำเข้าไปยังคลังตัวแก้ไขโดยอัตโนมัติ
ใช้ตัวควบคุมในตัวจัดการสื่อเพื่อเพิ่มและจัดระเบียบทรัพย์สินเว็บไซต์ที่นำกลับมาใช้ใหม่ของคุณ:
- เลือก เพิ่มภาพใหม่ เพื่ออัปโหลดภาพจากคอมพิวเตอร์ของคุณค่ะ
- เลือก นำเข้าภาพ เพื่อดึงภาพจากแหล่งภายนอกที่รองรับค่ะ
- เลือก + เพิ่มโฟลเดอร์ เพื่อสร้างหมวดหมู่สำหรับสินทรัพย์ที่เกี่ยวข้อง เช่น โลโก้ ภาพภายนอก หรือประเภทห้องพักค่ะ
- ใช้แท็บ ภาพ, ไอคอน, วิดีโอ, เสียง และ ไฟล์ เพื่อสลับระหว่างประเภทสื่อค่ะ
- ใช้ตัวควบคุม จัดเรียง และการแสดงผลที่มีอยู่เพื่อจัดระเบียบและค้นหาสินทรัพย์ในคลังค่ะ
ตัวจัดการสื่อด้านล่างนี้แสดงตัวควบคุมเหล่านี้และสินทรัพย์ที่สามารถนำกลับมาใช้ใหม่ได้ในคลังแล้วค่ะ:
ใช้สื่อในตัวแก้ไขเว็บไซต์
สื่อที่เพิ่มในตัวจัดการสื่อจะพร้อมใช้งานสำหรับนำกลับมาใช้ใหม่ขณะกำลังแก้ไขเว็บไซต์ของคุณ เมื่อคุณพร้อมที่จะวางสินทรัพย์ที่มีอยู่บนหน้า ให้ใช้ เพิ่ม > สื่อ ในตัวแก้ไข Cloudbeds Websites และเลือกสื่อที่ต้องการใช้ค่ะ
แผงสื่อจะแสดงสินทรัพย์ สื่อเว็บไซต์ และ สื่อฟรี ที่สามารถนำกลับมาใช้ใหม่ได้ พร้อมปุ่ม + เพิ่มสื่อ ที่พร้อมใช้งานหลังจากที่คุณเลือกสื่อที่ต้องการแล้วค่ะ:
ข้อกำหนดและการปรับแต่งภาพ
Cloudbeds Websites จะสร้างภาพขนาดเล็กลงโดยอัตโนมัติเมื่อจำเป็น เพื่อให้ภาพที่มีขนาดเหมาะสมถูกส่งไปยังอุปกรณ์เดสก์ท็อป แท็บเล็ต และมือถือ ภาพต้นฉบับจะไม่ถูกขยาย และภาพขนาดเล็กจะถูกสร้างขึ้นเฉพาะเมื่อภาพที่อัปโหลดมีขนาดใหญ่พอที่จะต้องใช้เท่านั้นค่ะ
| ข้อกำหนด | ข้อจำกัด |
|---|---|
| จำนวนไฟล์ต่อเว็บไซต์ | สูงสุด 15,000 ไฟล์ รวมทั้งภาพ วิดีโอ คลิปเสียง และไฟล์อื่นๆ |
| ขนาดไฟล์สูงสุด | 200 MB ต่อไฟล์ |
| พื้นที่ภาพสูงสุด | 3,145,728 พิกเซล คำนวณโดยการคูณความกว้างของภาพกับความสูง |
ภาพที่เกินขีดจำกัดที่รองรับอาจไม่สามารถอัปโหลดได้ ไม่แสดงภาพขนาดย่อ หรือไม่โหลดในตัวแก้ไขหรือบนเว็บไซต์จริง
การปรับแต่งภาพสามารถปิดได้สำหรับภาพพื้นหลังที่รองรับ วิดเจ็ตภาพ และวิดเจ็ตแกลเลอรีภาพ การปิดการปรับแต่งอาจส่งผลต่อความเร็วและประสิทธิภาพของหน้า
ขยายส่วนด้านล่างเพื่อดูประเภทไฟล์ภาพที่รองรับและรายละเอียดความเข้ากันได้ของ WebP
ประเภทไฟล์ภาพที่รองรับ
Cloudbeds Websites รองรับประเภทไฟล์ภาพดังต่อไปนี้:
- PNG
- JPG
- JPEG
- GIF
- SVG
- SVG+XML
- ICO
- X-icon
- WebP
ความเข้ากันได้ของ WebP
คำแนะนำภาพปัจจุบันรองรับภาพ WebP บนอุปกรณ์ดังต่อไปนี้:
- iPhone: รุ่น 14 ขึ้นไป
- Mac/Safari: รุ่นล่าสุด
- Chrome: ทุกเวอร์ชัน
- Android: ทุกเวอร์ชัน
ขนาดภาพที่แนะนำ
ใช้ขนาดเหล่านี้เป็นแนวทางทั่วไปเมื่อเตรียมภาพสำหรับตำแหน่งต่างๆ บนเว็บไซต์ เลือกขนาดที่เหมาะสมกับการใช้งานของภาพแทนการอัปโหลดไฟล์ที่ใหญ่เกินความจำเป็นของเลย์เอาต์
| การใช้งานภาพ | ขนาดที่แนะนำ |
|---|---|
| ความกว้างของภาพพื้นหลัง | 2880 px |
| เดสก์ท็อป | 1920 px |
| แท็บเล็ต | 1280 px |
| มือถือ | 640 px |
| ภาพขนาดย่อสำหรับบล็อก | 160 px หรือ 300 px |
คำแนะนำเกี่ยวกับภาพตามการใช้งาน
ส่วนประกอบต่าง ๆ ของพอร์ทัลใช้ภาพในรูปทรงและขนาดที่แตกต่างกัน เปิดส่วนที่เกี่ยวข้องเมื่อคุณกำลังเตรียมภาพสำหรับตำแหน่งเฉพาะค่ะ
ภาพสไลเดอร์
ภาพสไลเดอร์มักจะแสดงในขนาดใหญ่และอาจยืดขยายครอบคลุมพื้นที่กว้างของหน้าเว็บ ใช้ภาพที่มีความกว้างเพียงพอและมีระยะขอบรอบวัตถุหลักเพื่อไม่ให้เนื้อหาสำคัญถูกครอบตัดเมื่อปรับขนาดภาพ
- อัตราส่วนภาพที่ใช้บ่อย: 16:9 และ 3:4
- ความละเอียดที่ใช้บ่อย: 1600x900, 1280x720 และ 1280x960 พิกเซล
สำหรับสไลเดอร์แบบสี่เหลี่ยมจัตุรัส ให้ใช้สัดส่วนภาพ 1:1 รักษาอัตราส่วนภาพให้สม่ำเสมอภายในสไลเดอร์เดียวกันเพื่อการออกแบบที่ดูเป็นหนึ่งเดียวกันมากขึ้น
ภาพแกลเลอรีรูปภาพ
เลย์เอาต์แกลเลอรีรูปภาพรองรับอัตราส่วนภาพที่หลากหลาย ปรับอัตราส่วนภาพให้ตรงกับสไตล์แกลเลอรีที่ต้องการใช้ และรักษาอัตราส่วนให้สม่ำเสมอเมื่อเลย์เอาต์ขึ้นอยู่กับขนาดภาพที่เท่ากัน
- แกลเลอรีสไตล์สี่เหลี่ยมจัตุรัส: อัตราส่วน 1:1
- แกลเลอรีภาพสูง: เช่น 2:5 หรือ 200x500 พิกเซล
- คำแนะนำความละเอียดทั่วไป: ใช้ความละเอียดที่เหมาะสมกับเลย์เอาต์ แต่หลีกเลี่ยงภาพที่มีขนาดใหญ่กว่า 1500 พิกเซลเมื่อเป็นไปได้เพื่อช่วยให้หน้าเว็บโหลดเร็วขึ้น
ไอคอน
ไอคอนสามารถใช้ไฟล์ PNG แบบโปร่งใส, JPEG หรือ SVG ได้
- อัตราส่วนภาพที่ใช้บ่อย: 1:1 แม้อัตราส่วนอื่นก็สามารถใช้ได้
- ความละเอียดที่ใช้บ่อย: 200x200 พิกเซล หรือ 80x80 พิกเซล ไฟล์ SVG สามารถปรับขนาดได้โดยไม่จำกัดความละเอียด
ไฟล์ SVG อาจเพิ่มโค้ดในหน้าเว็บมากกว่าไฟล์ภาพมาตรฐาน การใช้ไฟล์ SVG ที่ซับซ้อนจำนวนมากในหน้าเดียวกันอาจส่งผลต่อการโหลดหรือฟังก์ชันการทำงาน เมื่อจำเป็นควรแปลงไอคอน SVG บางส่วนเป็นไฟล์ภาพมาตรฐาน เช่น PNG หรือ JPEG
ฟาวิไอคอน
ฟาวิไอคอนจะแสดงในแท็บของเบราว์เซอร์ ไม่ได้แสดงบนหน้าเว็บไซต์ แนะนำให้ใช้ไฟล์รูปแบบ ICO
- อัตราส่วนภาพที่ต้องใช้: 1:1
- ความละเอียดที่อนุญาต: 24x24, 36x36 และ 48x48 พิกเซล
โลโก้
แนะนำให้ใช้ไฟล์รูปแบบ SVG สำหรับโลโก้ เพราะสามารถปรับขนาดได้โดยไม่สูญเสียคุณภาพของภาพ
ประสิทธิภาพของภาพและการออกแบบตอบสนอง
ใช้ภาพที่มีขนาดใหญ่พอเหมาะกับตำแหน่งที่ต้องการแสดง แต่หลีกเลี่ยงการอัปโหลดไฟล์ที่มีขนาดใหญ่เกินความจำเป็น ภาพที่ใหญ่เกินไปอาจทำให้ประสิทธิภาพของหน้าเว็บลดลงโดยไม่ก่อให้เกิดการปรับปรุงภาพที่เห็นได้ชัดหลังจากปรับขนาดภาพ
จับคู่ภาพต้นฉบับกับการใช้งานที่ตั้งใจไว้ เช่น หากภาพจะแสดงที่ขนาดประมาณ 300x300 px ให้หลีกเลี่ยงการอัปโหลดภาพขนาด 4000x4000 px เว้นแต่จะต้องใช้ภาพขนาดใหญ่นั้นในที่อื่น
อัตราส่วนภาพหมายถึงความสัมพันธ์ระหว่างความกว้างและความสูงของภาพ ภาพที่มีอัตราส่วน 16:9 อาจมีขนาด 1600x900 px, 1280x720 px หรือความละเอียดอื่นที่มีอัตราส่วนเดียวกัน
ภาพที่ดูเหมาะสมบนเลย์เอาต์เดสก์ท็อปกว้าง อาจต้องการการปรับแต่งที่แตกต่างกันบนอุปกรณ์ขนาดเล็กกว่า ใช้การควบคุมการแสดงผลหรือขนาดเฉพาะอุปกรณ์ที่มีให้เมื่อคุณต้องการการจัดการภาพที่แตกต่างสำหรับเลย์เอาต์แท็บเล็ตหรือมือถือ
บทความที่เกี่ยวข้อง
เมื่อคุณรู้วิธีจัดการสื่อที่ใช้ซ้ำได้และเตรียมภาพสำหรับ Cloudbeds Websites แล้ว ให้ใช้แหล่งข้อมูลเหล่านี้เพื่อการนำทางตัวแก้ไขที่กว้างขึ้น คำถามที่พบบ่อยเกี่ยวกับภาพ และกระบวนการทำงานกับภาพพื้นหลัง:
ข้อคิดเห็น
โปรด ลงชื่อเข้าใช้ เพื่อแสดงข้อคิดเห็น