Shopify如何自定義多個頁面模板(方便隨時調用)?


做過Shopify的賣家知道,Shopify里面的主題就像一個框架,你可在這個框架內填寫內容,但是,你會發現這也是他的一個弊端,比如:
你的主題頁面是80%寬度的,不管你填寫什么內容,在Shopify上面怎么改,調整,他都不會達到100%全寬頁面,你不能輕易改變這個框架。如果你既想保留80%頁面寬,又想擁有100%的頁面,又怎么操作呢?我們可以通過更改主題的代碼來達到這樣的目的;更改好之后,可以通過如下圖所示的下拉框來選擇你所需要的模板;


開始操作:

第一步:找到要控制要修改頁面的主題文件:page.liquid

第二步:在Templates下面的新增templates點擊新增模板,因為要修改,所以選擇page,命名為容易區分的模板名稱(因為這個模板創建好之后,會出現在產品頁的模板選擇下拉菜單里面),然后點擊創建模板;

?

?
2019062603232116.png



第三步:這里是以Shopify免費主題Debut為例子的教程,講解更改代碼的思路;

由于控制頁面寬度的是page-width選擇器,所以我們把他替換掉,換成自定義的page-fullwidth,


問:怎么知道他是控制頁面寬度的選擇器呢?

可以轉到頁面,審查元素,可以看到如下圖所示:頁面的最大寬度是1200px,調整他的最大寬度到全寬;更改他的像素值,頁面寬度就會變化;

第四步:開始修改里面的代碼,將代碼修改成如下所示:修改完成后,你的頁面就全寬
<style>
.page-width {
padding-left: 0px;
padding-right: 0px;
}
.page-width {
max-width: 1920px;
margin: 0 auto;
}
</style>
<div class="page-fullwidth" style="margin-top:65px">
<!--是換掉<div class="page-width" style="margin-top:65px">這一行-->

?

總結:Shopify的主題模板的修改流程大致如上面的介紹,你可以根據介紹,修改增加產品模板,修改結算頁面,購物車頁面,顧客登錄頁等等。(記得備份主題數據)
?
已邀請:

uc

贊同來自:

代碼真的看不懂, 能加個聯系方式交流一下嗎 ?謝謝

要回復問題請先登錄注冊

 
知無不言 粵ICP備18098034號-1
江西多乐彩的标志