【官網設計】建議圖片尺寸
在這篇文章中： 一、介紹 二、首頁圖片 三、其它圖片 一、介紹 您也許不知道，您網店中的圖片例如滾輪或商品圖片，其大小會自動根據訪客使用的目尺寸而做出調整。但是我們瞭解在您製作或上傳圖片時，若有可參考的圖片尺寸將會對您有幫助。我們將在這篇文章中與您分享建議使用的圖片尺寸。 二、首頁圖片 以下主要是用於全屏佈景主題首頁中的圖片，建議使用的圖片尺寸如下： 電腦版輪播 slider: 1400 x 700px 手機版輪播 slider: 700 x 800px Image with Text 帶文字的圖片：1200px x 800px Center content 中心內容 (電腦版) : 1400 x 700px Center content 中心內容 (手機版) : 600 x 800px Featured collection 特色商品目錄: 850 x 850px Testimo瀏覽量高【擴充功能】Instagram Feed 安裝與設置
有關的文章： 官網設計 利用 Instagram 粉絲專頁裡的照片提升網店特色，或是打造品牌故事，將會提升於顧客心中的形象，同時也替本身經營的 Instagram 帳號帶來更多的訪客 步驟一：安裝 Instagram Feed 你可以前往「擴充功能」→ 安裝 「 Instagram Feed 」 步驟二：設定 Instagram Feed 登入你的Instagram帳號 以顯眼的方式呈現於首頁。 前往「官網設定」>「客製化佈景主題」> 開啟「Slider」選單進行設定。 「Auto-rotate slides」 ：自動更換圖片。 「Show dot indicators」 ：顯示Slider下的小點 (使用者以點選方式滑至下一頁) 「 Rotation interval」：圖片更換時間間隔。 「Transition e瀏覽量中等Infinite Scrolling 一頁式購物體驗
客戶可以在您的商店首頁以一頁式的形式瀏覽所有商品。 功能介紹 在商品分類現可一頁式瀏覽該分類所有商品，只需向下滑就會自動加載商品。 此功能讓客戶體驗一頁式瀏覽商品和資料，客戶可以更簡單地把感興趣商品加入購物車並進行付款動作。 安裝此擴充將提升： 客戶瀏覽時間效率提高 下單效率提高 用戶體驗感提升 安裝 Infinite Scrolling 步驟 1 ：EasyStore 後台》安裝擴充》更多》搜尋 Infinite Scrolling》安裝 步驟 2 ：選擇您想要的加載方式 Auto load when scroll down: 往下拉時商品會自動加載 Load when click more瀏覽量中等【官網設計】新增 Instagram 內嵌程式碼
有關的文章： 官網設計 此方法需要使用電腦登入 Instagram 才可以進行操作 步驟一：以電腦登入 Instagram 帳號 首先登入電腦版 Instagram → 點擊貼文上的“點狀”按鈕 點擊「內嵌」→ 複製內嵌程式碼 步驟二：貼到 EasyStore 程式碼文件 回到瀏覽量中等【官網設計】如何在商品頁面顯示「商品庫存數量」
有關的文章： 官網設計 Aroma 或其後發佈之佈景主題 此方法適用於 Aroma 或其後發佈之佈景主題主題 步驟一 ： 編輯原始碼 前往編輯原始碼 → 找到 main-product.liquid 文件 → 找到 {% app_snippet 'product/button' %} → 然後在前面加上 main-product.liquid 文件 → 找到 selectCallback → 在下方新增以下代碼瀏覽量中等如何編輯網店字型
您可透過兩種方式設定網店字型 一、佈景主題內建字型更換 二、修改語法更換其他非內建的字型 一、佈景主題內建字型更換 前往：銷售管道》品牌官網》佈景主題》佈景主題設定》一般設定 2.在「主要字體」 或 「標題字體」裡進行更改。 二、修改語法更換其他非內建的字型 步驟 1 ： 字型選擇 建議您使用Google Fonts網站內提供的字型： Google Fonts 網站 選擇您想使用的字型，您可以參考下面的影片來得到原始碼： 先選擇您要的字型，然後點擊 select style 就會出現該字型的原始碼：瀏覽量中等【官網設計】如何設定隱形商品
由於上架的商品都會預設出現在系統的「所有商品」頁面當中，因此無法選擇性不顯示特定商品，也無法做到隱形商品或賣場，此篇文章將讓你知道如何達到你的需求。 步驟一：隱藏系統預設的「所有商品」頁 前往後台 → 銷售管道 → 品牌官網 → 導航設定 → 所有商品 → 點擊「編輯」 取消勾選「導航列更新日期」  隱藏主目錄的登入和帳號按鈕 隱藏主目錄購物車按鈕 隱藏主目錄購物車按鈕(Wave, Lucky 或 X-force 佈景主題而已) 隱藏價格在商品搜尋頁面 1.在網站隱藏“購物車按鈕”和商品價格在首頁 1.1 隱藏“購物車按鈕”首先需要在 後台>品牌官網 > 佈景主題>編輯原始碼 > folder snippets/product-grid-item.liquid > 大概在 34 行，刪除以下灰色的部分 > 儲存 瀏覽量較少後台圖片自動優化
為了協助商家優化前台網頁瀏覽速度和優化客戶瀏覽官網圖片的用戶體驗，在後台商家所上傳的所有圖片，我們都會將圖片尺寸與格式進行壓縮并轉換為在我們平台上使用最優化版的圖片尺寸與圖片質量。 後台圖片自動優化好處有： 商家所有上傳至我們後台的圖片均已優化為較小的圖片尺寸。這意味著所有商店平均將在圖片加載時間上享受40％的頁面瀏覽加快速度改善。若某些商店在之前上傳非常大的圖片格式，商家將會查看到巨大的網頁瀏覽速度改進。以下是具有較大圖片格式的商店的Google PageSpeed Index的前後對比： 優化之後網頁速度測試： 優化之後網頁速度測試： 
這篇文章裡將教導商家如何透過編輯原始碼去自行設定新增 slider 的頁面。 **Step 1 **首先呢，您可以前往》後台》品牌官網》佈景主題》編輯原始碼 在 settings_schema.json 尋找 Slider content 拉下尋找 slide 6 /最後一個slide 複製以下編碼 & 更改所有數字 6 to 7 若想要更多Slide 可以重複以上步驟 然後儲存。 Step 2 在 settings_data.json 尋找slide_6 highlight 所有 slide_6 編碼如圖下 複製 & 更改數字為 6 to 7 或更多 然後儲存。瀏覽量較少商品標籤 (Product Label)
簡介 商品標籤擴充功能為商品添加自定義標籤。您可以選擇自定的文字標題或現有的圖像作為標籤。使用商品標籤可吸引客戶並向客戶傳遞一個簡短和快速的信息。 之前： 之後： 安裝Product Label 前往EasyStore後台 > 擴充功能 > 搜尋 Product Label > 立即安裝擴充。 設定操作流程 步驟1：點擊新增標籤。 ![](https://storag瀏覽量較少【官網設計】如何新增「回到上方」 按鈕（Aroma 與其後發佈之主題）
有關的文章： 官網設計 此文章將講解如何在 Aroma 與其後發佈之主題裡新增 「回到上方」按鈕 步驟一：編輯原始碼 EasyStore 後台 → 銷售管道 → 品牌官網 → 佈景主題 → 編輯原始碼 找到 theme.liquid 文件 複製以下代碼瀏覽量較少【官網設計】如何調整商品頁面裡的商品名稱大小（Aroma 與其後發佈之主題）
有關的文章： 官網設計 此文章僅適用於 Aroma 與其後發佈之主題 此文章將講解如何在 Aroma 與其後發佈之主題裡調整商品頁面裡的商品名稱大小 步驟一：編輯原始碼 EasyStore 後台 → 銷售管道 → 品牌官網 → 佈景主題 → 編輯原始碼 找到 main-product.liquid 文件 找到瀏覽量較少新增或更改加入購物車按鈕圖標
⚠️ 注意事項： 更換佈景主題需要重新編輯原始碼 不同佈景主題會有不同的加入購物車按鈕圖標 部分佈景主題會無加入購物車按鈕圖標 基於安全問題，我們不開放編輯結帳頁面上的加入購物車按鈕圖標 1. 新增加入購物車按鈕圖標 步驟 1 : 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > 選擇 product.liquid 檔案。 步驟 2 : 使用WAVE，Candy，X-Froce，Lucky主題： 複製以下代碼 > 在 {{ 'products.product.add_to_cart' | t }} 的前方貼上代碼。 {% include 'svg-definitions' with 'cart-icon' %} ![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1r775mb.瀏覽量較少【官網設計】如何調整 Messenger 按鈕位置
|| 支援全部付費方案 若你有使用 Messenger 按鈕銷售管道 功能，你可能會遇到需要調整 Messenger 按鈕位置的情況，這篇文章將教導大家如何調整按鈕位置。 新版主題（Aroma 或其後發佈之佈景主題） 步驟一：編輯原始碼 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → 找到 base.css 文件 複製以下代碼 .fb_dialog_content > iframe:first-child { bottom: 65px !important; } 粘貼到 base.css 文件的最下方 步驟二：點擊儲存，完成！ 小提醒： 你可根據你的需求調整代碼裡 105px 的數字來調瀏覽量較少【官網設計】如何設定隱形商品 + 推薦分潤
由於上架的商品都會預設出現在系統的「所有商品」頁面當中，因此無法選擇性不顯示特定商品，也無法做到隱形商品或賣場，此篇文章將讓你知道如何達到你的需求。 步驟一：隱藏系統預設的「所有商品」頁 前往後台 → 銷售管道 → 品牌官網 → 導航設定 → 所有商品 → 點擊「編輯」 取消勾選「導航列更新日期」 ![](https://storage.crisp.chat/users/helpdesk/website/eda4e4289bec9000/a85f8981-7瀏覽量較少【擴充功能】Product Star Rating 顧客商品評價
消費者在購買一個商品前一般會先去查看商品的評論和評價，商品的評論和評價可以提高顧客對你產品的信心。 步驟一：安裝 Product Star Rating 前往 EasyStore 後台 → 安裝擴充 → 更多 → 搜尋 Product Star Rating → 安裝 Product Star Rating 步驟二：設定 Product Star Rating 啟用顧客評論 ![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_kl8r5y.瀏覽量較少【短連結結帳】不同銷售管道的結帳頁面（品牌官網 VS 短連結）
有關的文章： 官網設計 商家在啓用了各種銷售管道后，結帳頁面會依照網店設定將客人導向品牌官網進行結帳或在短鏈接結帳頁面。商家們可以瞭解網店在什麽設定下會導向哪種結帳頁面。 1. 品牌官網結帳頁面 V.S. 短鏈結結帳頁面 通過網店設定狀態的不同，客人在結帳時將會出現兩種結帳頁面的導向 短連結結賬與一般有開啟品牌官網結賬頁面的分別如下： 短連結沒有回到購物車按鈕 短連結沒有登入按鈕 短連結沒有服務條款，隱私條款，退款政策 ![](https://storage.crisp.chat/users/helpdesk/website/46cdff4瀏覽量較少官網設計】在商品頁面新增 「聯繫我們」按鈕（Contact Form / Contact Form Plus）
此文章將說明如何在商品頁面上，新增「聯繫我們」 的按鈕 （Contact Form/Contact Form Plus） Candy 或之前發佈之佈景主題（舊版主題） 步驟一：編輯原始碼 前往 EasyStore後台 → 銷售管道 → 品牌官網 → 佈景主題 → 編輯原始碼 → product.liquid → 於大約第 127 行 → 搜尋 AddToCartText 在指定的地方，貼上以下 Contact Form 代碼。 💡 小提醒 : 你可以根據的喜愛，更改 "Contact Us" 按鈕名稱至其他字 若你不想要點擊按鈕後導向新的頁面，可將 target="_blank"瀏覽量較少【官網設計】關於佈景主題設定的顏色對應位置（Aroma 或其後發佈之佈景主題）
若你使用新版主題（Aroma 或其後發佈之佈景主題），你可參考這篇關於佈景主題設定裡顏色設定所對應的位置。此篇文章是以佈景主題 Muse 作為範例。 路徑：EasyStore 後台 → 品牌官網 → 佈景主題設定 → 設定 → 顏色 一般內文顏色 基本會對應在官網的一般文字，不包括主選單和頁尾 這裡會調成紅色作為例子讓你更了解什麼部分會被影響 商品區塊/頁面的標題、商品名稱、售價瀏覽量較少【擴充功能】 Smartarget Stories
Smartarget Stories 可以為你的官網創建多個限時動態，並包括帶有音樂的圖像或視頻，就如你在 Instagram、TikTok 和其他社交媒體平台上所看到的限時動態。 步驟一：安裝 Smartarget Stories 擴充功能 前往 EasyStore 後台 → 安裝擴充 → 更多 → 搜尋 Smartarget Stories → 安裝 步驟二：設置 Smartarget Stories 當你安裝 Smartarget Stories 之後，你將會導向 Smartarget 的設定頁面 ![](https:/瀏覽量較少【官網設計】編輯子導航列選單字體顏色（ Candy 與之前發佈之佈景主題）
有關的文章： 官網設計 此文章指導商家如何在 Candy 與之前發佈之佈景主題更改子導航列的選單字體顏色 步驟 1 : 銷售管道 → 品牌官網 → 佈景主題 → 編輯原始碼 → assets → timber.scss 步驟 2 : 位於大約2350 - 2400排 → 尋找 .site-nav__link → 更換 “colour：#000” 至您想要的顏色 💡 小貼士 : 您也可以更換以下設定： font-weight - 字體粗細 normal, bold, bolder, lighter colour -瀏覽量較少顯示推薦商品
您腦中是否浮現過這樣的想法- 如何向訪問我的在品牌官網的客戶推薦其他的商品？ 現在通過Easystore商品推薦功能，讓推薦商品變得如此簡單，並提供了個性化的購物體驗。讓我們來了解商品推薦功能如何使您的品牌官網受益吧。 如何啟用 要啟用商品推薦，請到您的EasyStore控制面板 > 商品管理 > 更多>商品設定 > 填寫您的想要的名稱 > 選擇優化目標 > 保存。 轉化優化 - 顯示客戶最有可能購買的商品 關聯優化 - 顯示與正在查看的產品最相關的商品 關閉 - 關閉推薦商品功能 ![](https://storage.crisp.chat/users/h瀏覽量較少如何上傳品牌商標
有關的文章： 官網設計 如何上傳品牌商標 Aroma 或更新佈景主題： 前往佈景主題》頂端主選單》上傳 Logo 至 【網站 Logo】 Candy 或之前佈景主題： 前往佈景主題》網站 Logo 》把 Logo 上傳到 【Logo】欄位即可 前往佈景主題設定》頁尾》把 logo 上傳到頁尾 logo即可瀏覽量較少【官網設計】如何在商品頁面顯示「商品編號SKU」？
需確保商品有輸入商品編號 SKU。 Aroma 或更新發佈之佈景主題（新版主題） 步驟一：編輯原始碼 前往 EasyStore 後台 → 銷售管道 → 品牌官網 → 編輯原始碼 → main-product.liquid 文件 搜尋 {% app_snippet 'product/button' %} → 於上方加入 <div id="product-sku-display" class="h6"></div> 在 main-瀏覽量較少使用 EasyStore 作為商品目錄/內容庫網站 （顯示價格但不開放購買按鈕）（Candy 或之前發佈之佈景主題）
您可以使用EasyStore作為商品目錄/內容庫網站，顯示價格但是不開放加入購物車按鍵。您可以根據我以下的步驟完成： （適用於 Candy 或之前發佈之佈景主題） 在這篇文章中： 在網站隱藏“購物車按鈕”和顯示商品價格在首頁 隱藏主目錄購物車按鈕 隱藏主目錄購物車按鈕(Wave, Lucky 或 X-force 佈景主題而已) 隱藏商品頁面的加入購物車按鈕 隱藏商品頁面的商品數量選擇按鈕 隱藏立即購買按鈕在商品頁面 1. 在網站隱藏“購物車按鈕”和顯示商品價格在首頁 1.1 隱藏“購物車按鈕”首先需要在 後台>銷售管道>品牌官網 > 佈景主題>編輯原始碼 > folder snippets/product-grid-item.liquid > 大概在 34 行，刪除以下灰色的部分 > 儲存  → ![](https://storag瀏覽量較少【官網設計】 Smartarget Exit Popup
Smartarget Exit Popup 是由第三方 Smartarget 提供的服務。這功能可以在顧客離開您的網站之前向他們展示特別彈跳視窗，顧客移動滑鼠遊標以關閉網站就會顯示一則訊息。透過退出彈出窗口，您可以設計彈出訊息和號召性用語來吸引用戶並阻止他離開。 步驟一：安裝 Smartarget Exit Popup 擴充 前往 EasyStore 後台 → 安裝擴充 → 更多擴充 → 搜尋 Smartarget Exit Popup → 安裝 步驟二：設置 Smartarget Exit Popup 首先，你可決定彈跳窗是否要有開始和結束時間，若沒有，保持未勾選 2瀏覽量較少不自動顯示第二張商品圖
在頁面上，當鼠標指向商品圖片時，會自動顯示第二張商品圖，商家可以透過以下步驟移除自動顯示第二張商品圖功能。 📣注意： 更換主題需要重新編輯原始碼。 步驟 1 : 您可以到：銷售管道 > 品牌官網 > 佈景主題 > 編輯原始碼 > snippets > product-grid-item.liquid。 步驟 2 : 在大約第70 - 80排，尋找 secondary_image，移除以下原始碼。 步驟 3 : 儲存設定并完成。 😉瀏覽量較少【官網設計】使用 EasyStore 作為商品目錄/內容庫網站（Aroma 或其後發佈之佈景主題）
有關的文章： 官網設計 你可以透過 EasyStore 製作商品目錄/內容庫網站，顯示價格但是不開放「購買」或「加入購物車」按鈕 步驟一：隱藏網站主選單的「購物車」按鈕 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → 找到 header.liquid 文件 → 搜尋 header__icon--cart → 刪除以下代碼 點擊儲存 官網主選單的「購物車」按鈕被隱藏了 ![](https://storage.crisp.chat/users/helpdesk/website/7eeab70be8a8cc00/ab816f44-deb瀏覽量較少【官網設計】部分商品不顯示價格與購物車按鈕
你可以設定部分商品不顯示價格與購買按鈕的商品於前台。 Candy 或之前發佈之佈景主題 步驟一：移除商品列表的顯示 前往 EasyStore 後台 → 銷售管道 → 品牌官網 → 佈景主題設定 → 編輯原始碼 → product-grid-item.liquid → 在 <p class="grid-link__meta" 上方 → 新增 {% if product.price > 0 %} → 之後在 下方新增 {% endif %} 點擊儲存 步驟二：移除商品頁面的顯示 前往 EasyStore 後台 → 銷售管道 → 品牌官網 → 佈景主題設定 → 編輯原始碼 → product.liquid → 尋找product-single__price瀏覽量較少客製化您的官網商品搜索結果
當商家使用任何佈景主題，所有前台商品搜索頁面的系統默認設定中，顧客需要輸入商品名稱去搜索商品，顧客無法以商品分類，商品品牌，供應商與商品標籤去搜索該商品。例如，當顧客在您前台收搜商品分類的時候，便會呈現無結果如圖： 這篇文章將指導商家如何客製化自定義您顧客可以在您官網前台搜索您商品的方式，以及商品的搜索結果。商家現在可以讓顧客以商品分類，商品品牌，供應商與商品標籤去搜索您的商品。 商家可以在：後台》商品管理》所有商品》編輯商品》找到商品的商品分類，商品品牌，供應商與商品標籤 來看看以下教學吧！ 客製化您的官網商品收搜結果瀏覽量較少手機網頁分類顯示兩個商品（只限Candy主題）
有關的文章： 官網設計 步驟一：您需要到Easystore後台=>銷售管道=>品牌官網=>編輯原始碼 步驟二：在setting_data.json 尋找 collection_products_list_per_row將數目更改成4. 步驟三：儲存即可。瀏覽量較少【官網設計】購物車可編輯項目
本文將指導你如何移除加入購物車以及當客戶將產品加到購物車時自動顯示在右側的滑出購物車。本指南僅適用於 Candy、Wave 、Fall、X-Force、Maker 、Lucky主題。 在這篇文章中 ： A. 啟用加入購物車顯示購物車預覽 B. 移除加入購物車後顯示通知 C. 刪除產品頁面上的浮動添加到購物車按鈕 D. 更改購物車字體大小 E. 在購物車上重命名 “運費，稅金和折扣將在結帳時計算” A. 啟用加入購物車後顯示購物車預覽 到 Easystore 後台 → 銷售管道 → 品牌官網 → 編輯原始碼 → 搜尋 // toggleCart( ); （大約 114 行） → 移除 // ![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1uzoe瀏覽量較少【導航列】如何設定純文字導航列
由於新增導航列都會需要選擇一種類別進行設定，可能你會需要新增純文字導航列為母分類，然後再設定子分類。此文章將教你如何設定不可點擊的純文字的導航列。 Aroma 或其後發佈之佈景主題 此教學適用於 Aroma、Freshbit 、Mels 、Wood 、Essence 、Gizmos 、Kiddy 、Urbn 、Kate、 Pastries 等等新版主題 步驟一：編輯原始碼 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → 找到 header.liquid 文件 → 搜尋 href="{{ link.url }}" → 換成以下代碼 {% if link.url != "/#" %} href="{{ link.url }}" {% endif %}  所有導航相關URL連結後面，以顯示50個商品在一個商品分類頁面上 以上所有編輯原始碼部分，當您在更換新的佈景主題時，需要重新編輯原始碼 Top Bar : 前往銷售管道 > 品牌官網 > 編輯原始碼 > snippets > site-nav.liquid 尋找以下的編碼并添加 ?limit=50 在每個編碼後尾，如圖下，完成并儲存。 {瀏覽量較少【官網設計】在頁尾新增聯繫方式
| 僅支援付費方案 Candy 或之前發佈之佈景主題 此教學適用於 Candy 、Wave 、X-force 、Fall 、Maker 等等舊版佈景主題 步驟 一：編輯原始碼 你可以到 EasyStore 後台 → 銷售管道 → 品牌官網 → 編輯原始碼 → Layout → theme.liquid 搜尋 <p class="site-footer__links">{{ copyright }}</p> 大約是在176至180行內 然後 上行 添加你的聯繫方式 <p> 聯繫號碼: <br> 客服信箱: </p> 備註：是指空行 步驟二：點擊儲存，完成瀏覽量較少【擴充功能】如何在結帳頁面啟用 Message Box
| 適用於全部方案 Message Box 適用於收集顧客為的特別訊息。啟用這個擴充功能後結帳頁面會出現一個額外的消息框，可以讓顧客留言。例如：客制化產品、產品細節、Line ID 等等 步驟一：安裝 Message Box 前往 EasyStore 後台 → 安裝擴充 → 更多 → 搜尋 Message Box → 安裝 Message Box 步驟二：設定 Message Box 選擇 Sentence 或 Paragraph Sentence ：句子，只可以輸入一句文字 Paragraph : 段落，可以輸入長篇文字和段落瀏覽量較少在商標列表里添加更多商標
有關的文章： 官網設計 商標列表功能僅包括在Candy, Lucky, X-Force, Wave & Maker佈景主題 欲在商標列表（Logo List）里添加更多商標, 您需在以下3個檔案里進行相關編輯：銷售管道 > 品牌官網 > 佈景主題 > 編輯原始碼 > config settings_data.json settings_schema.json logo-list.liquid 1. settings_data.json 步驟 1: 前往 EasyStore 後台 > 銷售管道 > 品牌官網 > 佈景主題 > 編輯原始碼 > config瀏覽量較少【官網設計】如何調整 Live Chat 按鈕位置新版主題（Aroma 或其後發佈之佈景主題）舊版主題（Candy 或之前發佈之佈景主題）
有關的文章： 官網設計 若你有使用訊息功能裡的 Live Chat 功能，你可能會遇到需要調整 Live Chat 按鈕位置的情況，這篇文章將教導大家如何調整按鈕位置。 步驟一：編輯原始碼 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → 找到 base.css 文件 複製以下代碼 .easystore-chat-button { bottom: 105px !important; } .easystore-widget-window { bottom: -15px !important; }瀏覽量較少更改列中顯示商品的數量
1.介紹 不同的顯示數量會給您的商店帶來不同的感覺。如果您希望您的商店不那麼雜亂，或者您想展示更多種類的產品，您現在可以決定在您的商店中每列能展示多少商品。 好處： 自定義每列商品數量，以創建適合您商店方向的外觀。 擁有一個更有組織和整潔的商店 2.首頁上每列商品顯示數量 步驟 1：到 EasyStore控制面板 > 銷售管道 > 品牌官網 > 編輯原始碼 > 找到product-grid-item.liquid 步驟 2：在頂部插入 {% comment %}，在底部插入 {% endcomment %}，如下圖所示： 步驟 3：儲存 步驟瀏覽量較少如何移除複製與貼上的右鍵功能，避免網店內容遭盜用？
有關的文章： 官網設計 移除您網店前台內容被複製貼上之右鍵功能，您於網店前台之商品及背景圖片、文字內容皆無法被反白選擇及進行複製，避免您用心製作的圖片或是文字內容未經允許被使用，保障您重要的智慧財產權。 此篇文章，將能協助您： 一、移除右鍵複製貼上功能 二、取消 " 移除右鍵複製貼上功能 " 一、移除右鍵複製貼上功能 您可以前往「佈景主題」>「編輯原始碼」> 點選「layout」中的「theme.liquid」> 複製以下程式碼於 “ “ 前： $(document).ready(function () { $("body").css({ "-webkit-touch-callout": "none", "-webkit-user-select": "non瀏覽量較少【官網設計】如何移除官網搜尋欄（新版主題）
有關的文章： 官網設計 如果你使用的新版主題（Aroma 或其後發佈之佈景主題）有搜尋欄，你可以參考這篇文章如何移除官網的搜尋欄。 不是全部新版主題都會有這個搜尋欄，如：Essence、Muse、Scents、Aroma 、Mels 、Freshbit、Marshmallow、Pastries、Brew 等等。 步驟一：編輯原始碼 EasyStore 後台 → 銷售管道 → 品牌官網 → 編輯原始碼 → header.liquid 文件 → 刪除以下代碼 步驟二：點擊儲存，完成瀏覽量較少移除商品圖片放大效果
有關的文章： 官網設計 在商品頁面上，當鼠標指向商品圖片時，商品圖片會自動放大，商家可以透過以下步驟移除此商品圖片放大效果。 📣注意：更換主題需要重新編輯原始碼。 步驟 1 : 您可以到：銷售管道 > 品牌官網 > 佈景主題 > 編輯原始碼 > templates > product.liquid。 步驟 2 : 在大約第24排，尋找 onmousemove="zoomIn(event)" onmouseout="zoomOut()" ，移除以下原始碼。 ![](https://storage.crisp.chat/users/helpdesk/website/28dbfa07adb8f600/1b16bd41-81d瀏覽量較少【品牌官網】導航列設定
導航列設定可以讓你在官網前台新增連結、分頁、商品分類等等的點擊按鈕，並且導向到你設定的頁面，這可以使客戶更清楚的了解到關於網店的相關資訊和內容。 有什麼好處？ 簡易傳遞信息給客戶 客戶可以直接從主頁得到他們想要的資訊 加強商家的聲譽 增加銷售營業額 步驟一：新增導航列 前往 EasyStore 後台 → 銷售管道 → 品牌官網 → 導航列設定 → 新增導航列 ![](https://storage.crisp.chat/users/helpd瀏覽量較少【官網設計】調整商品描述欄的位置（新版佈景主題）
| 支援全部付費方案 新版主題（Aroma 或其後發佈之佈景主題）的商品描述都會呈現在商品頁面右側（Aroma、Marshmallow、Freshbit 除外），若你想要調整商品描述的位置到商品圖片正下方，你可參考此篇文章的方法。 步驟一：編輯原始碼 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → 找到 main-product.liquid 文件 搜尋 {% app_snippet 'product/description_top' %} 複製以下代碼 把剛剛複製的代碼移到 ` {% app_sn瀏覽量較少刪除商品下方的社交媒體分享按鈕
有關的文章： 官網設計 一、社交媒體分享 社交媒體分享按鈕其實可以幫助商家去增加並促進與客戶之間的關係。並且還可以藉此把商品發布到更多的渠道讓大眾看到您的品牌從而產生興趣瀏覽您的官網。 請參考以下列子： 還未關閉之前 關閉之後： 如果您的平台不需要這額外的分享按鈕，您可以通過編輯原始碼去隱藏它們。瀏覽量較少【官網設計】以範圍顯示商品價格
有關的文章： 官網設計 若商品有設定不同的規格價格，會顯示從 xxxx 金額起，此文章將教導你如何設定價格以範圍顯示。 Candy 或之前發佈之佈景主題 此步驟適用於 Candy、Wave、X-force、Fall、Maker 等等舊版佈景主題 步驟一：編輯原始碼 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → product-grid-item.liquid 文件 → 搜尋 product.price_varies → 換成以下代碼瀏覽量較少【品牌官網】新增與編輯分頁
系統的分頁功能，可以規劃設計各式各樣的版型去自由運用，比如可以用全頁圖片做「新品上市介紹」；或是用文字加圖片做「VIP升級規則」等。 步驟一：新增分頁 前往銷售管道 → 品牌官網 → 官網分頁 → 新增分頁 步驟二：設定分頁內容 選擇分頁範本，若想要空白頁面就選擇範本 1 ![](https://storage.crisp.chat/users/helpdesk/website/4a13a87009d87400/76de962b-20e5-41f8瀏覽量較少更改「瀏覽規格」按鈕文字
您可以更改商品列表中「瀏覽規格」按鈕文字至其他的字，例如：查看規格、選擇規格等等。 您需要根據以下步驟操作： 步驟 1 : 前往銷售管道 > 品牌官網 > 佈景主題 > 編輯原始碼 > 尋找 product-grid-item.liquid 檔案。 步驟 2 : 在大約第70行 > 尋找 {{ 'products.product.view_option' | t }} 。 同時，在大約第100行 > 尋找 {{ 'products.product.view_option' | t }} 。 ![](https:瀏覽量較少【功能設定】如何編輯郵件範本
步驟一：前往郵件範本編輯頁面 前往 EasyStore 後台 → 設定 → 郵件範本 步驟二：選擇郵件範本進行編輯 點擊“筆狀”按鈕即可編輯郵件範本內容 **主要排版 ** （1）編輯郵件範本的排版設計 （2）選擇是否隱藏郵件裡 EasyStore 浮水印（只有商務版可以選擇隱藏） ![](https://storage.瀏覽量較少【官網設計】如何調整 Live Chat 按鈕位置
若你有使用訊息功能裡的 Live Chat 功能，你可能會遇到需要調整 Live Chat 按鈕位置的情況，這篇文章將教導大家如何調整按鈕位置。 新版主題（Aroma 或其後發佈之佈景主題） 步驟一：編輯原始碼 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → 找到 base.css 文件 複製以下代碼 .easystore-chat-button { bottom: 105px !important; } .easystore-widget-window { bottom: -15px !important; } 粘貼到 base.css 文件的最下方 ![](https://storage.crisp.chat/users/瀏覽量較少更改商品 '售完' 字樣
每當商品庫存為0時，官網前台便會顯示商品 “售完”。商家可以自行更改商品 “售完” 字樣至 “即將到貨”，“售完補貨中” 等其他字樣。當您設定有 “到貨” 含義的字樣，其實可以更能在您商品到貨/上架前吸引顧客在您官網上注意到該商品。 Candy 與之前發佈之佈景主題 更改商品 '售完' 字樣, 需要編輯以下 3 個檔案 : product-grid-item.liquid product.liquid search-result.liquid ⚠️ 注意 : 在您更改以下編碼時，之後若更換新的佈景主題時，您需要重新編輯原始碼。 步驟 1: 前往EasyStore後台 > 銷售管道 > 品牌官網 > 編輯原始碼 > snippets > product-grid-item.liquid 步驟 2 : 尋找 {{ 'products.product.sold_out' | t }} ，更改至您想要替代的字樣 ![](https://storage.crisp.瀏覽量較少更換查看購物車 & 繼續購物按鈕顏色
有關的文章： 官網設計 商家們可以客製化 “查看購物車” & “繼續購物” 按鈕顏色，以下是按鈕前台顯示： 在開始之前，您需要選擇想要更改的顏色，並獲得該顏色的顏色代碼，請點擊這裡獲取。之後，您可以前往：EasyStore後台 > 銷售管道 > 品牌官網 > 佈景主題 > 編輯原始碼 > 選擇 assets/timber.scss 檔案。 ⚠️ 注意 : 更換佈景主題之後，需要重新編輯原始碼。 更換查看購物車按鈕顏色 您可以前往：EasyStore後台 > 銷售管道 > 品牌官網 > 佈景主題 > 編輯原始碼 > 選擇 timber.scss 檔案 > 在大約第 195瀏覽量較少更改商品規格邊框顏色
有關的文章： 官網設計 商家可以客製化商品頁面上的商品規格邊框顏色，繼續查看教學了解如何更改商品規格的邊框顏色吧！ 商品規格前台顯示： 更改商品規格邊框顏色 前往EasyStore後台 > 銷售管道 > 品牌官網 > 佈景主題設定。 選擇 "Navigation"。 更換並選擇您想要顯示的邊框顏色 > 確認 > 儲存。 ![](h瀏覽量較少
✕