您可以在您的在線商店中使用許多不同類型的圖片，包括您的公司 logo、產品圖片、幻燈片、橫幅和博客文章圖片。Shopify 可自動確保在您的在線商店中使用最佳可用格式顯示圖片，此外，Shopify 還提供通過裁剪和調整大小操作來動態轉換圖片的功能。
備注上傳前無需手動壓縮圖片。請始終上傳您可以提供的最佳質量的圖片。
您可以在模板編輯器中為模板添加圖片。您還可以在 Shopify 后臺的文件頁面中上傳圖片。有關詳細信息，請參閱將文件上傳到您的網站。
步驟： 在 Shopify 后臺中，轉至在線商店 > 模板。 在要自定義的模板旁邊，點擊自定義。 使用下拉菜單選擇要編輯的模板。 在模板編輯器工具欄中，點擊要添加圖片的分區或塊。點擊選擇圖片，然后執行以下操作之一：
若要從計算機上傳圖片，請點擊上傳。 若要使用 Burst 中的免費圖庫圖片，請點擊導出免費圖片。點擊圖片以在您的模板中查看圖片預覽。找到您要使用的圖片后，點擊選擇。
點擊保存。
使用元字段添加圖片如果您為圖片設置了元字段，則您可以使用動態源選擇器添加圖片。有關元字段和支持的圖片格式的更多信息，請參閱元字段內容類型和值。
您可以使用以下元素創建圖片橫幅：
一張或兩張圖片 文本 一個操作按鈕在臺式電腦上，橫幅圖片并排顯示。由于此格式不適合移動設備，因此您可以通過在圖片橫幅模板設置中選擇在移動設備上堆疊圖片選項來堆疊圖片橫幅圖片。有關圖片橫幅和幻燈片的詳細信息，請參閱適用于幻燈片和圖片橫幅的最佳做法。
您可以使用焦點來定義在線商店模板中的圖片的最重要部分。您在圖片上設置焦點后，便會形成一個焦點區域。焦點將始終顯示在圖片框架內，即使模板可為了適應布局而裁剪圖片也是如此。通過設置焦點，當模板使用不同的縱橫比以及在不同尺寸的屏幕上使用圖片時，您可以更好地控制圖片的顯示方式。
每張圖片只能有一個焦點，但您可以隨時更改或刪除焦點。
以下版本的 Shopify 免費模板中提供設置焦點功能：
Craft 版本 5.0.0 或更高版本 Crave 版本 5.0.0 或更高版本 Colorblock 版本 3.0.0 或更高版本 Dawn 版本 7.0.0 或更高版本 Refresh 版本 2.0.0 或更高版本 Ride 版本 3.0.0 或更高版本 Sense 版本 5.0.0 或更高版本 Studio 版本 4.0.0 或更高版本 Taste 版本 4.0.0 或更高版本如果您使用的是第三方模板，請查看模板的文檔，了解您的模板是否支持使用焦點。
您可以在文件部分和模板編輯器中向圖片添加焦點。如果您在一張圖片上添加焦點并在多個位置使用該圖片，那么這些圖片都使用相同的焦點。
您只能向模板圖片添加焦點。無法向產品、博客或產品系列圖片添加焦點。
桌面/ iPhone/ Android步驟：
在模板編輯器中，點擊要添加圖片的分區或塊。 點擊圖片上的編輯。 點擊添加焦點。 點擊并拖動藍色圓圈，或點擊圖片中最重要的部分以設置焦點。 點擊完成。
若要移動焦點，您可以再次打開圖片，然后點擊圖片的其他區域即可設置新焦點。
刪除焦點
桌面 / iPhone/ Android
步驟： 在模板編輯器中，點擊要添加圖片的分區或塊。 點擊圖片上的編輯。 點擊刪除焦點。 點擊完成。
備注
焦點可能不會始終顯示在視覺中心，具體取決于您的模板裁剪圖片以及調整其大小的方式。
圖片格式
Shopify 支持以下圖片格式：
JPEG 漸進式 JPEG 格式 PNG GIF HEIC WebP AVIF
備注
Shopify 會自動檢測您客戶的瀏覽器支持的圖片格式，然后自動以最佳可用格式顯示圖片。您可以通過訪問 https://cdn.shopify.com/ 來詳細了解 Shopify 的圖片轉換功能
何時使用 JPEG 圖片JPEG 圖片非常適合攝影作品和其他色彩復雜的靜止圖片。JPEG 格式具有包含數百萬種顏色的調色板。JPEG 還具有有損壓縮功能，這有助于加快頁面加載速度，而不會使圖片質量明顯降低。
將 JPEG 格式用于以下類型的圖片：
產品 橫幅或幻燈片 頁面和博客文章 何時使用 PNG 圖片PNG 圖片非常適合用于單色且沒有漸變的圖形和圖標。PNG 格式也能夠支持透明度。
將 PNG 格式用于以下類型的圖片：
logo 圖標 邊框和裝飾
自動圖片壓縮和格式選擇
為了加快加載速度，當圖片顯示在您的在線商店上時，Shopify 會自動壓縮這些圖片。壓縮圖片意味著減小文件大小，從而可以更快地加載頁面。
此外，Shopify 在交付您的圖片時會自動確定可使用的最佳文件格式。例如，當我們檢測到客戶 Web 瀏覽器支持 WebP 和 AV1 Image File Format (AVIF) 等新式圖片格式時，Shopify 便會以這些格式交付您的圖片。
為了通過減小文件大小來提高性能，GIF 會自動轉換為動畫 WebP 格式。
上傳到 Shopify 的圖片在百萬像素和文件大?。ㄒ园偃f字節為單位）方面都有限制。百萬像素用于表示圖片由幾百萬像素構成。百萬字節用于表示圖片占用了幾百萬字節的內存或磁盤空間。
上傳到 Shopify 的圖片不能超過以下任一限制：
2500 萬像素 20 MB若要查找圖片的百萬像素表示形式，您可以使用以下公式：(pixel width x pixel height)/1,000,000。例如，根據公式 (4900x6930)/1,000,000 = 33.9 MP，分辨率 4900x6930 的圖片為 3390 萬像素。
備注
上傳產品圖片的圖片和文件大小限制各不相同。
當您查看在線商店中的圖片時，圖片中的顏色可能與您上傳到 Shopify 的原始圖片中的顏色不同。如果圖片具有顏色配置文件（即存儲在擴展名為 .ICC 或 .ICM 的文件中的一組數據），則可能會出現此情況。顏色配置文件通常嵌入在圖片內，有助于對顏色在不同設備上的顯示方式進行標準化統一。當圖片顯示在您的在線商店上時，它們的顏色配置文件將被刪除。
刪除顏色配置文件的原因包括：
并非所有設備都能讀取 .ICC 或 .ICM 顏色配置文件，因此，使它們保持不變可能會導致設備間的圖片顏色不一致。 上傳的圖片不包含顏色配置文件時，Web 瀏覽器會采用 sRGB（最常用于在 Web 上顯示圖片的顏色配置文件）。這可以確保您的圖片在所有主要的 Web 瀏覽器和設備上看起來都是相同的。 顏色配置文件可能占用大量的磁盤空間，從而導致加載時間過長。
刪除圖片的顏色配置文件
在將圖片上傳到 Shopify 之前，您可以通過在沒有顏色配置文件的情況下保存圖片，從而將顏色配置文件從圖片中刪除。此過程因您的圖片編輯程序而異。
使用 Adobe Illustrator 或 Adobe Photoshop 刪除顏色配置文件使用 Adobe Illustrator 或 Adobe Photoshop 刪除顏色配置文件：
點擊編輯 > Assign Profile（分配配置文件）。
選擇 Don’t Color Manage This Document（不對此文檔進行顏色管理）。
點擊確定。
使用 Adobe InDesign 刪除顏色配置文件若要使用 Adobe InDesign 刪除顏色配置文件，請執行以下操作：
點擊編輯 > Assign Profile（分配配置文件）。
對于 RGB 配置文件和 CMYK 配置文件，請選擇 Discard (Use Current Working Space)（放棄(使用當前工作空間)）。
點擊確定。
有關詳細信息，可以查看關于顏色配置文件的 Adobe 文檔。
許多 Shopify 模板都包含大型圖片或幻燈片，它們可以擴展到瀏覽器的高度或適應您的屏幕尺寸。
如果您使用其中一個模板或擁有尺寸較大的幻燈片或背景圖片，那么了解哪種類型的圖片看上去效果最佳是非常重要的。
由于大圖無法適應所有設備，因此 Shopify 有時僅顯示部分圖片，具體取決于您使用的設備。如果您的圖片幻燈片包含大量大圖，那么您可能會發現圖片的某些部分不可見。
為了確保圖片能夠很好地適應您的模板，請注意以下事項：
用于幻燈片或背景的圖片中不應包含文本。如果文本是圖片本身的一部分，則可能會根據您的模板對它進行移動、裁剪或調整。使用模板編輯器添加文本和轉至幻燈片的鏈接。
對于在幻燈片中使用的或作為背景使用的圖片，請選擇簡單圖片，從而使任何疊加的文本易于閱讀。
高屏幕上的寬圖片當用于查看寬圖片的設備是高屏幕（例如手機或平板電腦）時，則可能會裁剪該圖片的左右兩側。在下面的示例中，如果人物是圖片最重要的部分，則您可以將焦點放置在圖片右側.
寬屏幕上的高圖片當用于查看高圖片的設備屏幕較寬（如筆記本電腦或臺式設備）時，則可能會裁剪該圖片的頂部和底部。在下面的示例中，如果鞋子是圖片最重要的部分，則您可以將焦點放置在圖片底部以防止鞋子被裁剪.
