如何編輯網店字型
您可透過兩種方式設定網店字型
*
前往:銷售管道》品牌官網》佈景主題》佈景主題設定》一般設定
2.在「主要字體」 或 「標題字體」裡進行更改。
*
步驟 1 : 字型選擇
建議您使用Google Fonts網站內提供的字型:
先選擇您要的字型,然後點擊 select style 就會出現該字型的原始碼:
點擊 <link> 複製圖中的代碼
或點擊 @import 複製以下代碼
複製紅框裡的編碼,回到 EasyStore 後台》編輯原始碼》並貼至「layout」》「theme.liquid」》 第16行,點選儲存
舉例:`<link href="https://fonts.googleapis.com/css?family=Saira+Extra+Condensed" rel="stylesheet">`
或是
<style> @import xxxxxxxx </style>
步驟 2 :
新增【主要字體】字型選項
再回到 Google Font 頁面,複製下圖紅框 1 與 2 的部分,
(請注意:紅框 1 包含 ' ' )
回到 EasyStore》編輯原始碼》前往 config》「settings_schema.json 」》
找到 "id": "body_font_family" ,並在 "options": [ 之後貼上以下代碼,您可以參考以下截圖設置
{
"value": "紅框1 ,紅框2",
"label": "紅框1",
"group": "紅框2"
},
新增【標題字體】字型選項
跟 主要字體 一樣的步驟
前往「config」>「settings_schema.json 」> 找到 "id": "heading_font_family" ,> 在 "options": [ 之後 填上以下代碼
{
"value": "紅框1 ,紅框2",
"label": "紅框1",
"group": "紅框2"
},
步驟 3 :顯示所新增字型在前台
回到「佈景主題」> 「客製化佈景主題」> 「一般設定」> 選取您新設置的字型 > 點選「儲存」。

一、佈景主題內建字型更換
二、修改語法更換其他非內建的字型
*
**一、佈景主題內建字型更換**
前往:銷售管道》品牌官網》佈景主題》佈景主題設定》一般設定
2.在「主要字體」 或 「標題字體」裡進行更改。
*
**二、修改語法更換其他非內建的字型**
步驟 1 : 字型選擇
建議您使用Google Fonts網站內提供的字型:
Google Fonts 網站
選擇您想使用的字型,您可以參考下面的影片來得到原始碼:
先選擇您要的字型,然後點擊 select style 就會出現該字型的原始碼:

點擊 <link> 複製圖中的代碼

或點擊 @import 複製以下代碼

複製紅框裡的編碼,回到 EasyStore 後台》編輯原始碼》並貼至「layout」》「theme.liquid」》 第16行,點選儲存
舉例:`<link href="https://fonts.googleapis.com/css?family=Saira+Extra+Condensed" rel="stylesheet">`
或是
<style> @import xxxxxxxx </style>

步驟 2 :
新增【主要字體】字型選項
再回到 Google Font 頁面,複製下圖紅框 1 與 2 的部分,

(請注意:紅框 1 包含 ' ' )
回到 EasyStore》編輯原始碼》前往 config》「settings_schema.json 」》
找到 "id": "body_font_family" ,並在 "options": [ 之後貼上以下代碼,您可以參考以下截圖設置
{
"value": "紅框1 ,紅框2",
"label": "紅框1",
"group": "紅框2"
},

新增【標題字體】字型選項
跟 主要字體 一樣的步驟
前往「config」>「settings_schema.json 」> 找到 "id": "heading_font_family" ,> 在 "options": [ 之後 填上以下代碼
{
"value": "紅框1 ,紅框2",
"label": "紅框1",
"group": "紅框2"
},

步驟 3 :顯示所新增字型在前台
回到「佈景主題」> 「客製化佈景主題」> 「一般設定」> 選取您新設置的字型 > 點選「儲存」。

Updated on: 10/01/2024
感謝!