為商店新增 favicon

favicon(或「我的最愛圖示」)是顯示在網頁名稱旁邊的小型圖片或標誌。您可以在瀏覽器分頁,以及列出網站的瀏覽器頁面 (例如書籤頁面) 上看到 favicon。您可以在網路商店新增 favicon,以強化品牌形象,並讓網站看起來更精緻。

建立 favicon

您可以使用免費的 favicon 產生器網站建立自訂的 favicon,或自行製作。若要尋找 favicon 產生器,請在網際網路上搜尋 free favicon generator

favicon 的理想圖片尺寸為 16x16 像素或 32x32 像素。若您的 favicon 圖片尺寸過大,上傳至 Shopify 時會縮小為 32x32 像素。

在網路商店新增 favicon

若您使用 Basic 方案或以上,即可在網路商店新增 favicon。若使用 Starter 方案,則無法在網路商店新增 favicon。

步驟:

電腦版
  1. 在 Shopify 管理介面,前往 網路商店 > Themes

  2. 找到要新增 favicon 的佈景主題,然後按一下 編輯佈景主題

  3. 按一下齒輪圖示以開啟 佈景主題設定

  4. 視佈景主題版本而定,按一下 標誌Favicon

  5. Favicon 圖片 區段,按一下 選取圖片,然後執行下列其中一項操作:

    • 若要選取您已上傳至 Shopify 管理介面的圖片,您可以搜尋或找到該圖片,然後用核取方塊選取。
    • 若要從本機電腦選取圖片,按一下 新增圖片,從本機電腦開啟圖片,然後用核取方塊選取。
  6. 按一下 完成

  7. 選用:依下列步驟為 favicon 圖片新增替代文字:

    1. Favicon 圖片 區段,按一下 編輯
    2. 預覽與編輯 對話方塊的 替代文字 欄位輸入圖片的簡短說明。
    3. 按一下 儲存
  8. 按一下 儲存

行動裝置
  1. Shopify app 中,點選 選單 圖示。

  2. 銷售管道 區段,點選 網路商店

  3. 點選 管理所有佈景主題

  4. 找到要新增 favicon 的佈景主題,然後點選 編輯佈景主題

  5. 點選 ... > 佈景主題設定

  6. 視佈景主題版本而定,點選 標誌Favicon

  7. Favicon 圖片 區段中,點選 選取圖片,然後執行下列其中一項操作:

    • 若要選取您已上傳至 Shopify 管理介面的圖片,您可以搜尋或找到該圖片,然後用核取方塊選取。
    • 若要從本機裝置選取圖片,點選 新增圖片,從本機裝置開啟圖片,然後用核取方塊選取。
  8. 點選 完成

  9. 依下列步驟為 favicon 圖片新增替代文字:

    1. Favicon 圖片 區段,點選 編輯
    2. 預覽與編輯 對話方塊的 替代文字 欄位輸入圖片的簡短說明。
    3. 點選 儲存
  10. 點選 儲存

疑難排解 favicon

如果您遇到 favicon 的問題,請參考以下疑難排解步驟。

排解 favicon 未顯示於 Google 搜尋結果的問題

如果 favicon 未顯示於 Google 搜尋結果,請確認您已 submitted your sitemap 給 Google,讓 Google 能夠抓取您商店的資訊。

根據 Google 的文件,即使符合所有 指南,也無法保證會在搜尋結果中顯示 favicon。

排解 favicon 未顯示於顧客帳號或結帳頁面的問題

除非您使用 Shopify Plus 方案,顧客帳號與結帳頁面不會顯示 favicon。另外,透過佈景主題編輯器檢視佈景主題時也不會顯示 favicon,因為佈景主題編輯器屬於 Shopify 管理介面的一部分,無法反映您已上線的線上店面。

如果您使用 Shopify Plus 方案,並想在顧客帳號與結帳頁面設定 favicon,則必須使用 Branding API 或 Checkout Blocks。favicon 不會自動顯示,也無法在管理介面的佈景主題編輯器或結帳編輯器中設定。若要進一步瞭解如何使用 Branding API,請參閱以下開發人員文件: