如何設定|一頁式頁面:獨立 CSS

 

【目錄】:

 

 


 

說明:

 

  •  CSS 程式碼: 提供商家可以調整特定頁面、區塊、按鈕的顏色、文字大小等樣式風格,因此會需要商家本身有編寫程式的能力,或是有聘請 / 外包工程師的商家使用。
  • 商家自訂 CSS 程式碼之後,若是因平台系統正常更新、系統優化後,而出現跑版、無法正常顯示等任何問題,平台一概不負責。
  • 若商家希望【一頁式頁面】可以有自己獨立的「CSS」,不要與【官網首頁】共用,即可依照此文章流程,啟用「獨立 CSS」功能,就能夠另外自訂一頁式頁面的「CSS 程式碼」囉!

 


 

 

一、如何設定 ?

 

 

※ 主要分為兩個步驟:啟用 CSS、編寫 CSS。那如果商家先前已有「啟用獨立 CSS」,只是需要進入到「自訂 CSS」頁面去做編寫的話,可以直接依照《步驟二:編寫你的「自訂 CSS」》步驟操作即可。

 

 

步驟一:啟用「獨立 CSS」功能

 

 

步驟1

 

進入「ShopStore 店家管理後台」→於左方選單,點擊前往「商店設計」→「頁面設計」。

 

步驟1:進入「ShopStore 店家管理後台」→於左方選單,點擊前往「商店設計」→「頁面設計」。

 

 

步驟2

 

點擊上方「一頁式」頁籤,以切換到「一頁式」頁面。

 

步驟2:點擊上方「一頁式」頁籤,以切換到「一頁式」頁面。

 

 

步驟3

 

在想啟用獨立 CSS 功能的一頁式頁面右方,點擊「編輯設定」。

 

步驟3:在想啟用獨立 CSS 功能的一頁式頁面右方,點擊「編輯設定」。

 

 

步驟4

 

下滑頁面至「啟用獨立 CSS」區塊。

 

步驟4:下滑頁面至「啟用獨立 CSS」區塊。

 

 

步驟5

 

在此【啟用獨立 CSS】區塊上,點擊右方按鈕,切換狀態為「啟用」。

 

步驟5:在此【啟用獨立 CSS】區塊上,點擊右方按鈕,切換狀態為「啟用」。

 

 

步驟6

 

點擊右下方藍色按鈕「儲存」。

 

步驟6:點擊右下方藍色按鈕「儲存」。

 

 

步驟7

 

當右上方顯示「頁面儲存成功」的綠色提示,代表「獨立 CSS」啟用成功!

 

步驟7:當右上方顯示「頁面儲存成功」的綠色提示,代表「獨立 CSS」啟用成功!


 

步驟二:編寫你的「自訂 CSS」

 

 

步驟1

 

進入「ShopStore 店家管理後台」→「商店設計」→「頁面設計」→「一頁式」頁籤→點擊「編輯 CSS」按鈕。

 

步驟1:進入「ShopStore 店家管理後台」→「商店設計」→「頁面設計」→「一頁式」頁籤→點擊「編輯 CSS」按鈕。

 

 

步驟2

 

即可在「自訂 CSS」區塊上,編寫你的 CSS 程式碼。

 

步驟2:即可在「自訂 CSS」區塊上,編寫你的 CSS 程式碼。

 

 

步驟3

 

確認編寫的程式碼皆正確後,點擊右下方藍色按鈕「儲存」。

 

步驟3:確認編寫的程式碼皆正確後,點擊右下方藍色按鈕「儲存」。

 

 

步驟4

 

當右上方顯示「儲存成功」的綠色提示,代表有成功儲存囉!

 

步驟4:當右上方顯示「儲存成功」的綠色提示,代表有成功儲存囉!

 

 

 

 


 

 

二、如何關閉 ?

 

 

※ 注意:關閉後,一頁式頁面的「自訂 CSS」,就會共用官網設定的「自訂 CSS」內容。

 

 

步驟1

 

進入「ShopStore 店家管理後台」→於左方選單,點擊前往「商店設計」→「頁面設計」。

 

步驟1:進入「ShopStore 店家管理後台」→於左方選單,點擊前往「商店設計」→「頁面設計」。

 

 

步驟2

 

點擊上方「一頁式」頁籤,以切換到「一頁式」頁面。

 

步驟2:點擊上方「一頁式」頁籤,以切換到「一頁式」頁面。

 

 

步驟3

 

在想關閉獨立 CSS 功能的一頁式頁面右方,點擊「編輯設定」。

 

步驟3:在想關閉獨立 CSS 功能的一頁式頁面右方,點擊「編輯設定」。

 

 

步驟4

 

在【啟用獨立 CSS】區塊上,點擊右方按鈕,切換狀態為「關閉」。

 

步驟4:在【啟用獨立 CSS】區塊上,點擊右方按鈕,切換狀態為「關閉」。

 

 

步驟5

 

點擊右下方藍色按鈕「儲存」。

 

步驟5:點擊右下方藍色按鈕「儲存」。

 

 

步驟6

 

當右上方顯示「頁面儲存成功」的綠色提示,代表有成功關閉囉!

 

步驟6:當右上方顯示「頁面儲存成功」的綠色提示,代表有成功關閉囉!

 

 

需要協助嗎?立即連繫線上客服