การอัปโหลดรูปภาพ
คุณสามารถใช้รูปภาพหลากหลายรูปแบบในร้านค้าออนไลน์ของคุณได้ รวมถึงโลโก้บริษัท ภาพสินค้า สไลด์โชว์ แบนเนอร์ และรูปภาพโพสต์บล็อก จะเป็นการดีที่สุดที่จะอัปโหลดในขนาดหรือรูปแบบที่แน่นอน โดยขึ้นอยู่กับว่าวิธีและตำแหน่งที่คุณต้องการใช้รูปภาพ
อัปโหลดรูปภาพ
คุณสามารถอัปโหลดรูปภาพสำหรับร้านค้าออนไลน์ของคุณได้บนสองตำแหน่ง:
อัปโหลดรูปภาพในหน้าไฟล์
คุณสามารถอัปโหลดรูปภาพในหน้าไฟล์ของส่วน Shopify admin ของคุณ ซึ่งมีประโยชน์เพราะคุณสามารถเข้าถึงรูปภาพเหล่านี้ได้ในขณะที่แก้ไขธีมของคุณ หากต้องการดูข้อมูลเพิ่มเติม ให้ดูที่การอัปโหลดไฟล์ลงในเว็บไซต์ของคุณ
อัปโหลดรูปภาพในเครื่องมือแก้ไขธีม
คุณสามารถเพิ่มรูปภาพในธีมของคุณได้ในเครื่องมือแก้ไขธีม
ขั้นตอน:
- ในส่วน Shopify admin ให้ไปที่ร้านค้าออนไลน์ > ธีม
- ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นคลิกที่ "ปรับแต่ง"
- จากแอป Shopify ให้แตะที่ร้านค้า
- ในส่วนช่องทางการขาย ให้แตะที่ร้านค้าออนไลน์
- แตะจัดการธีม
- ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นแตะที่ "ปรับแต่ง"
- แตะที่แก้ไข
- จากแอป Shopify ให้แตะที่ร้านค้า
- ในส่วนช่องทางการขาย ให้แตะที่ร้านค้าออนไลน์
- แตะจัดการธีม
- ค้นหาธีมที่คุณต้องการแก้ไข จากนั้นแตะที่ "ปรับแต่ง"
- แตะที่แก้ไข
-
จากแถบเครื่องมือของเครื่องมือแก้ไขธีม ให้คลิกที่ส่วนที่คุณต้องการเพิ่มรูปภาพ เลือกส่วนที่มีเครื่องมือเลือกรูปภาพ:
เพิ่มรูปภาพโดยการคลิกที่เลือกรูปภาพ หากต้องการอัปโหลดรูปภาพจากคอมพิวเตอร์ของคุณให้คลิกอัปโหลด หากต้องการใช้รูปภาพสต็อกฟรีจากBurstให้คลิกรูปภาพฟรี
คลิกที่รูปภาพเพื่อดูตัวอย่างในธีมของคุณ เมื่อคุณพบรูปภาพที่ต้องการใช้แล้ว ให้คลิกเลือก
คลิกที่บันทึก
รูปแบบของรูปภาพ
Shopify รองรับรูปแบบของรูปภาพต่อไปนี้:
- JPEG หรือ JPG
- Progressive JPEG
- PNG
- GIF
Shopify ให้บริการรูปภาพในรูปแบบ WebP บนเบราว์เซอร์ที่รองรับ
หมายเหตุ: นอกเหนือจากการแปลงรูปแบบที่ไม่รองรับให้เป็นรูปแบบที่รองรับแล้ว Shopify จะไม่แก้ไขรูปภาพของคุณในการอัปโหลด หากคุณอัปโหลดรูปภาพที่ไม่ใช่รูปแบบที่รองรับ Shopify จะแปลงรูปภาพนั้นเป็น JPEG หรือ PNG รูปภาพส่วนใหญ่จะถูกแปลงเป็น JPEG
ควรใช้รูปภาพ JPEG เมื่อใด
รูปภาพ JPEG เหมาะสำหรับภาพถ่ายและภาพนิ่งอื่นๆ ที่มีสีซับซ้อน รูปแบบ JPEG มีแถบสีหลายล้านสี JPEG ยังมีการบีบอัดข้อมูลแบบสูญเสียบางส่วน ซึ่งสามารถช่วยให้การโหลดหน้าเว็บเป็นไปอย่างรวดเร็วโดยไม่สูญเสียคุณภาพของรูปภาพ
ใช้รูปแบบ JPEG สำหรับประเภทของรูปภาพต่อไปนี้
- สินค้า
- แบนเนอร์หรือสไลด์โชว์
- หน้าเว็บและบล็อกโพสต์
ควรใช้รูปภาพ PNG เมื่อใด
รูปภาพ PNG เหมาะสำหรับภาพกราฟิกและไอคอนที่มีสีเรียบและไม่มีการไล่ระดับสี รูปแบบ PNG ยังสามารถรองรับภาพโปร่งใสได้อีกด้วย
ใช้รูปแบบ PNG สำหรับประเภทของรูปภาพต่อไปนี้
- โลโก้
- ไอคอน
- เส้นขอบและลวดลายตกแต่ง
อัตราการบีบอัด
เพื่อรักษาระดับความเร็วในการโหลด Shopify จึงบีบอัดรูปภาพที่แสดงในร้านค้าออนไลน์ของคุณ การบีบอัดรูปภาพเป็นการลดขนาดไฟล์เพื่อให้สามารถโหลดหน้าได้เร็วขึ้น การบีบอัดทำให้สามารถจัดเก็บรูปภาพได้มากขึ้นในพื้นที่ดิสก์หรือพื้นที่หน่วยความจำตามที่กำหนด นอกจากนี้ เวลาที่ใช้ในการเข้าถึงรูปภาพจะลดลงอย่างมาก การบีบอัดอาจส่งผลให้คุณภาพของรูปภาพเปลี่ยนไป ซึ่งขึ้นอยู่กับรูปแบบ ขนาด และคุณภาพดั้งเดิมของรูปภาพของคุณ
ระดับคุณภาพรูปภาพของ Shopify หลังจากการบีบอัดมีดังนี้:
- JPEG: ระหว่าง 65 - 90 เปอร์เซ็นต์
- PNG: 90 เปอร์เซ็นต์
- GIF: ไม่มีการเปลี่ยนแปลงคุณภาพ
สำหรับรูปภาพ JPEG ระดับคุณภาพรูปภาพที่บีบอัดขึ้นอยู่กับคุณภาพรูปภาพ JPEG ดั้งเดิม รวมถึงขนาดของของรูปภาพที่ออกมา:
คุณภาพดั้งเดิม | ขนาดรูปภาพที่แสดง | คุณภาพรูปภาพที่แสดง |
---|---|---|
86% ขึ้นไป | ความสูงหรือความกว้างตั้งแต่ 1024 พิกเซลขึ้นไป | 85% |
65 - 85% | ความสูงหรือความกว้างตั้งแต่ 1024 พิกเซลขึ้นไป | คุณภาพดั้งเดิม |
64% ลงไป | ความสูงหรือความกว้างตั้งแต่ 1024 พิกเซลขึ้นไป | 65% |
76% ขึ้นไป | ทั้งความสูงและความกว้างน้อยกว่า 1024 พิกเซล | 75% |
65 - 75% | ทั้งความสูงและความกว้างน้อยกว่า 1024 พิกเซล | คุณภาพดั้งเดิม |
64% ลงไป | ทั้งความสูงและความกว้างน้อยกว่า 1024 พิกเซล | 65% |
ขีดจำกัดการอัปโหลด
การอัปโหลดรูปภาพลงใน Shopify มีข้อจำกัดทั้งในแง่ของจำนวนเมกะพิกเซลและขนาดไฟล์ (วัดเป็นเมกะไบต์) ใช้เมกะพิกเซลเพื่อระบุว่าใช้จำนวนกี่ล้านพิกเซลในการประกอบขึ้นเป็นรูปภาพ ใช้เมกะไบต์เพื่อระบุว่าใช้จำนวนพื้นที่หน่วยความจำหรือดิสก์กี่ล้านไบต์ในการจัดเก็บรูปภาพ
รูปภาพที่อัปโหลดลงใน Shopify ต้องไม่เกินขีดจำกัดต่อไปนี้:
- 20 เมกะพิกเซล
- 20 เมกะไบต์
หมายเหตุ: มีรูปภาพและขีดจำกัดขนาดของไฟล์ที่แตกต่างกันสำหรับการอัปโหลดรูปภาพสินค้า
โปรไฟล์สี
เมื่อคุณดูรูปภาพในร้านค้าออนไลน์ของคุณ สีในรูปภาพอาจดูแตกต่างจากสีในต้นฉบับที่คุณได้อัปโหลดลงใน Shopify สิ่งนี้สามารถเกิดขึ้นได้เมื่อรูปภาพมีโปรไฟล์สีซึ่งเป็นชุดของข้อมูลที่เก็บไว้ในไฟล์ที่มี .ICC
หรือส่วนขยาย .ICM
โปรไฟล์สีมักจะฝังอยู่ในรูปภาพเพื่อช่วยกำหนดมาตรฐานวิธีการที่สีปรากฏในอุปกรณ์ต่างๆ เมื่อรูปภาพปรากฏในร้านค้าออนไลน์ของคุณ โปรไฟล์สีของรูปภาพเหล่านั้นจะถูกลบออก
ระบบจะลบโปรไฟล์สีออกด้วยเหตุผลบางประการ:
- อุปกรณ์บางส่วนไม่สามารถอ่านโปรไฟล์สี
.ICC
หรือ.ICM
ได้ ดังนั้นการทำให้สียังคงเดิมอาจส่งผลให้เกิดความไม่สอดคล้องกันของสีในรูปภาพในอุปกรณ์ต่างๆ - เมื่อรูปภาพที่อัปโหลดไม่มีโปรไฟล์สี เว็บเบราว์เซอร์นั้นจะนำ sRGB (โปรไฟล์สีที่ใช้บ่อยที่สุดในการแสดงรูปภาพบนเว็บ) มาใช้ ซึ่งทำให้มั่นใจได้ว่ารูปภาพของคุณจะแสดงผลเหมือนกันในเว็บเบราว์เซอร์และอุปกรณ์หลักทั้งหมด
- โปรไฟล์สีอาจใช้พื้นที่ดิสก์จำนวนมาก ซึ่งอาจส่งผลให้ใช้เวลาในการโหลดนาน
ลบโปรไฟล์สีออกจากรูปภาพ
คุณสามารถลบโปรไฟล์สีออกจากรูปภาพของคุณได้โดยการบันทึกโดยไม่มีโปรไฟล์สีก่อนที่จะอัปโหลดลงใน Shopify กระบวนการนี้จะแตกต่างกันไป ขึ้นอยู่กับโปรแกรมแก้ไขรูปภาพของคุณ
ลบโปรไฟล์สีออกโดยใช้ Adobe Illustrator หรือ Adobe Photoshop
วิธีการลบโปรไฟล์สีออกโดยใช้ Adobe Illustrator หรือ Adobe Photoshop:
คลิก แก้ไข > กำหนดโปรไฟล์
เลือก ไม่ต้องจัดการสีเอกสารนี้
คลิก ตกลง
ลบโปรไฟล์สีออกโดยใช้ Adobe InDesign
วิธีการลบโปรไฟล์สีออกโดยใช้ Adobe InDesign:
คลิก แก้ไข > กำหนดโปรไฟล์
สำหรับโปรไฟล์ RGB และโปรไฟล์ CMYK ให้เลือก ละทิ้ง (ใช้พื้นที่การทำงานปัจจุบัน)
คลิก ตกลง
สำหรับรายละเอียดเพิ่มเติม คุณสามารถดูได้ที่เอกสารประกอบของ Adobe เกี่ยวกับโปรไฟล์สี
หลักปฏิบัติที่ดีที่สุดสำหรับสไลด์โชว์และรูปภาพแบบเต็มความกว้าง
ธีม Shopify จำนวนมากมีรูปภาพขนาดใหญ่หรือสไลด์โชว์ที่ปรับขนาดตามความสูงของเบราว์เซอร์ของคุณ (Boundless และ Brooklyn) หรือปรับให้เข้ากับขนาดหน้าจอของคุณ (Venture)
หากคุณใช้หนึ่งในธีมเหล่านี้หรือมีสไลด์โชว์หรือรูปภาพพื้นหลังขนาดใหญ่ คุณจำเป็นต้องทราบว่ารูปภาพประเภทใดแสดงผลได้ดีที่สุด
เนื่องจากรูปภาพขนาดใหญ่ไม่สามารถปรับให้พอดีกับอุปกรณ์ทั้งหมด บางครั้ง Shopify จึงแสดงรูปภาพเพียงบางส่วน โดยขึ้นอยู่กับอุปกรณ์ที่คุณใช้ หากสไลด์โชว์รูปภาพของคุณมีรูปภาพขนาดใหญ่จำนวนมาก คุณอาจพบว่าไม่สามารถมองเห็นบางส่วนของรูปภาพนั้น
ข้อเสนอแนะ
เพื่อให้แน่ใจว่ารูปภาพของคุณทำงานได้ดีกับธีมของคุณ คุณควรคำนึงถึงกรณีดังต่อไปนี้:
ธีมบางส่วนมีการตั้งค่าการวางตำแหน่งรูปภาพที่คุณสามารถใช้เพื่อระบุว่าส่วนใดของภาพคือจุดโฟกัส หากธีมของคุณไม่มีการตั้งค่าดังกล่าว ให้ตรวจสอบให้แน่ใจว่าจุดโฟกัสของแต่ละรูปภาพอยู่ตรงกลาง เมื่อมีการครอบตัดรูปภาพของคุณในบางหน้าจอ ผู้คนจะเห็นจุดโฟกัสขณะที่พื้นที่โดยรอบถูกซ่อนไว้
รูปภาพที่คุณใช้สำหรับสไลด์โชว์หรือพื้นหลังไม่ควรมีข้อความอยู่ หากข้อความเป็นส่วนหนึ่งของรูปภาพ คุณอาจย้าย ครอบตัด หรือปรับแต่งตามธีมของคุณ ใช้เครื่องมือแก้ไขธีมเพื่อเพิ่มข้อความและลิงก์ไปยังสไลด์โชว์ของคุณ
สำหรับรูปภาพที่คุณใช้ในสไลด์โชว์หรือเป็นพื้นหลัง ให้เลือกรูปภาพที่เรียบง่ายเพื่อให้ข้อความที่อยู่ด้านบนอ่านง่าย
รูปภาพที่กว้างในหน้าจอที่สูง
อาจมีการครอบตัดรูปภาพที่กว้างออกไปด้านซ้ายและขวาเมื่ออุปกรณ์ที่ใช้ในการดูรูปภาพเหล่านั้นมีหน้าจอที่สูง (เช่น โทรศัพท์มือถือ หรือแท็บเล็ต):
รูปภาพที่สูงในหน้าจอที่กว้าง
อาจมีการครอบตัดรูปภาพที่สูงออกไปด้านบนและล่างเมื่ออุปกรณ์ที่ใช้ในการดูรูปภาพเหล่านั้นมีหน้าจอที่กว้าง (เช่น แล็ปท็อป หรือเดสก์ท็อป):