新增或更改加入購物車按鈕圖標
⚠️ 注意事項：
更換佈景主題需要重新編輯原始碼
不同佈景主題會有不同的加入購物車按鈕圖標
部分佈景主題會無加入購物車按鈕圖標
基於安全問題，我們不開放編輯結帳頁面上的加入購物車按鈕圖標
步驟 1 : 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > 選擇 product.liquid 檔案。
步驟 2 :
使用WAVE，Candy，X-Froce，Lucky主題：
複製以下代碼 > 在 <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span> 的前方貼上代碼。
{% include 'svg-definitions' with 'cart-icon' %}
使用其他佈景主題：
複製以下代碼 > 在 <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span> 的前方貼上代碼。
<i class="icon icon-cart"></i>步驟
3 : 儲存。
之前：
之後：
更改加入購物車按鈕圖標
步驟 1 : 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > 選擇 svg-definitions.liquid 檔案。
步驟 2 : 尋找 {% when 'cart-icon' %} > 刪除以下代碼。
步驟 3 : 複製以下代碼。
手袋圖標：
<svg class="svg-icon" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><title>icon-cart</title><path d="M34.68,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,34.68,73.28Zm0,14.14a3.54,3.54,0,1,1,3.53-3.54A3.55,3.55,0,0,1,34.68,87.42Z"/><path d="M73.57,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,73.57,73.28Zm0,14.14a3.54,3.54,0,1,1,3.54-3.54A3.54,3.54,0,0,1,73.57,87.42Z"/><path d="M96,16.12H19.51l-1.39-7.7s0,0,0,0A2.62,2.62,0,0,0,18,8c0-.09-.05-.19-.09-.28l-.16-.32c-.06-.1-.1-.2-.16-.29s-.13-.16-.19-.24l-.24-.29c-.07-.07-.15-.12-.22-.18a3.31,3.31,0,0,0-.3-.25c-.08-.06-.17-.09-.25-.14A2.37,2.37,0,0,0,16,5.8l-.23-.08a3.52,3.52,0,0,0-.43-.13,1.66,1.66,0,0,0-.22,0,3.91,3.91,0,0,0-.48,0H4a3.54,3.54,0,1,0,0,7.07h7.65L20.05,59A15.13,15.13,0,0,0,35,71.51H84.18a3.54,3.54,0,0,0,0-7.07H35a8.06,8.06,0,0,1-5.39-2.07L87,55a3.54,3.54,0,0,0,2.94-2.5l9.42-31.82A3.53,3.53,0,0,0,96,16.12ZM83.8,48.26,26.7,55.6,20.79,23.19H91.23Z"/></svg>
購物車圖標：
<svg class="svg-icon" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><title>icon-cart</title><path d="M34.68,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,34.68,73.28Zm0,14.14a3.54,3.54,0,1,1,3.53-3.54A3.55,3.55,0,0,1,34.68,87.42Z"/><path d="M73.57,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,73.57,73.28Zm0,14.14a3.54,3.54,0,1,1,3.54-3.54A3.54,3.54,0,0,1,73.57,87.42Z"/><path d="M96,16.12H19.51l-1.39-7.7s0,0,0,0A2.62,2.62,0,0,0,18,8c0-.09-.05-.19-.09-.28l-.16-.32c-.06-.1-.1-.2-.16-.29s-.13-.16-.19-.24l-.24-.29c-.07-.07-.15-.12-.22-.18a3.31,3.31,0,0,0-.3-.25c-.08-.06-.17-.09-.25-.14A2.37,2.37,0,0,0,16,5.8l-.23-.08a3.52,3.52,0,0,0-.43-.13,1.66,1.66,0,0,0-.22,0,3.91,3.91,0,0,0-.48,0H4a3.54,3.54,0,1,0,0,7.07h7.65L20.05,59A15.13,15.13,0,0,0,35,71.51H84.18a3.54,3.54,0,0,0,0-7.07H35a8.06,8.06,0,0,1-5.39-2.07L87,55a3.54,3.54,0,0,0,2.94-2.5l9.42-31.82A3.53,3.53,0,0,0,96,16.12ZM83.8,48.26,26.7,55.6,20.79,23.19H91.23Z"/></svg>
步驟 4 : 儲存
💡 注意事項 :
若您的佈景主題沒有加入購物車按鈕圖標，請先根據文章第一部去新增，之後才做以上步驟進行更改。
若不想要有任何圖標在加入購物車按鈕上，直接移除以下代碼 > 儲存即可。
步驟 1: 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > 選擇product.liquid 檔案。
步驟 2 : 移除以下代碼。
<a class="btn addToCart-btn top-addToCart-btn hide medium--hide small--hide"> {% include 'svg-definitions' with 'cart-icon' %}<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span> </a>
步驟 3 : 儲存即完成。
更換佈景主題需要重新編輯原始碼
不同佈景主題會有不同的加入購物車按鈕圖標
部分佈景主題會無加入購物車按鈕圖標
基於安全問題，我們不開放編輯結帳頁面上的加入購物車按鈕圖標
1. 新增加入購物車按鈕圖標
步驟 1 : 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > 選擇 product.liquid 檔案。
步驟 2 :
使用WAVE，Candy，X-Froce，Lucky主題：
複製以下代碼 > 在 <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span> 的前方貼上代碼。
{% include 'svg-definitions' with 'cart-icon' %}
使用其他佈景主題：
複製以下代碼 > 在 <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span> 的前方貼上代碼。
<i class="icon icon-cart"></i>步驟
3 : 儲存。
之前：
之後：
更改加入購物車按鈕圖標
步驟 1 : 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > 選擇 svg-definitions.liquid 檔案。
步驟 2 : 尋找 {% when 'cart-icon' %} > 刪除以下代碼。
步驟 3 : 複製以下代碼。
手袋圖標：
<svg class="svg-icon" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><title>icon-cart</title><path d="M34.68,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,34.68,73.28Zm0,14.14a3.54,3.54,0,1,1,3.53-3.54A3.55,3.55,0,0,1,34.68,87.42Z"/><path d="M73.57,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,73.57,73.28Zm0,14.14a3.54,3.54,0,1,1,3.54-3.54A3.54,3.54,0,0,1,73.57,87.42Z"/><path d="M96,16.12H19.51l-1.39-7.7s0,0,0,0A2.62,2.62,0,0,0,18,8c0-.09-.05-.19-.09-.28l-.16-.32c-.06-.1-.1-.2-.16-.29s-.13-.16-.19-.24l-.24-.29c-.07-.07-.15-.12-.22-.18a3.31,3.31,0,0,0-.3-.25c-.08-.06-.17-.09-.25-.14A2.37,2.37,0,0,0,16,5.8l-.23-.08a3.52,3.52,0,0,0-.43-.13,1.66,1.66,0,0,0-.22,0,3.91,3.91,0,0,0-.48,0H4a3.54,3.54,0,1,0,0,7.07h7.65L20.05,59A15.13,15.13,0,0,0,35,71.51H84.18a3.54,3.54,0,0,0,0-7.07H35a8.06,8.06,0,0,1-5.39-2.07L87,55a3.54,3.54,0,0,0,2.94-2.5l9.42-31.82A3.53,3.53,0,0,0,96,16.12ZM83.8,48.26,26.7,55.6,20.79,23.19H91.23Z"/></svg>
購物車圖標：
<svg class="svg-icon" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><title>icon-cart</title><path d="M34.68,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,34.68,73.28Zm0,14.14a3.54,3.54,0,1,1,3.53-3.54A3.55,3.55,0,0,1,34.68,87.42Z"/><path d="M73.57,73.28a10.61,10.61,0,1,0,10.61,10.6A10.61,10.61,0,0,0,73.57,73.28Zm0,14.14a3.54,3.54,0,1,1,3.54-3.54A3.54,3.54,0,0,1,73.57,87.42Z"/><path d="M96,16.12H19.51l-1.39-7.7s0,0,0,0A2.62,2.62,0,0,0,18,8c0-.09-.05-.19-.09-.28l-.16-.32c-.06-.1-.1-.2-.16-.29s-.13-.16-.19-.24l-.24-.29c-.07-.07-.15-.12-.22-.18a3.31,3.31,0,0,0-.3-.25c-.08-.06-.17-.09-.25-.14A2.37,2.37,0,0,0,16,5.8l-.23-.08a3.52,3.52,0,0,0-.43-.13,1.66,1.66,0,0,0-.22,0,3.91,3.91,0,0,0-.48,0H4a3.54,3.54,0,1,0,0,7.07h7.65L20.05,59A15.13,15.13,0,0,0,35,71.51H84.18a3.54,3.54,0,0,0,0-7.07H35a8.06,8.06,0,0,1-5.39-2.07L87,55a3.54,3.54,0,0,0,2.94-2.5l9.42-31.82A3.53,3.53,0,0,0,96,16.12ZM83.8,48.26,26.7,55.6,20.79,23.19H91.23Z"/></svg>
步驟 4 : 儲存
💡 注意事項 :
若您的佈景主題沒有加入購物車按鈕圖標，請先根據文章第一部去新增，之後才做以上步驟進行更改。
若不想要有任何圖標在加入購物車按鈕上，直接移除以下代碼 > 儲存即可。
3. 移除商品頁面浮動的加入購物車按鈕
步驟 1: 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > 選擇product.liquid 檔案。
步驟 2 : 移除以下代碼。
<a class="btn addToCart-btn top-addToCart-btn hide medium--hide small--hide"> {% include 'svg-definitions' with 'cart-icon' %}<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span> </a>
步驟 3 : 儲存即完成。
Updated on: 12/01/2024
感謝！