简单来说就是:
1. 进入主题源码编辑(Edit Code),在layout路径下,创建layout,比如文件名为:landing.liquid, 复制你的LP代码到这个文件里保存。以下是示例landing page内容:
注意:{% comment %} … {% endcomment %}这部分的内容不能删掉。
landing.liquid
{% comment %}
{{ content_for_header }}
{{ content_for_layout }}
{% endcomment %}
<html>
<head>
<meta charset="UTF-8">
<title>Sample Landing Page</title>
</head>
<body>
<a href="https://example.com">click here</a>
</body>
</html>2. 在主题sections路径下,新建section空文件,如:lp-custom1.liquid,文件内容为空。
3. 在主题templates路径下,创建新的template,比如文件名为page.landing.json,文件内容如下
page.landing.json
{
"layout": "landing",
"sections": {
"main": {
"type": "lp-custom1"
}
},
"order": [
"main"
]
}注意:
- “layout”: “landing” 这一行,对应的是第1步中的文件名landing
- “type”: “lp-custom1″这一行,对应的是第2步中的lp-custom1
保存后,回到shopify后台,新建page,Template选择你刚才新建的template。page内容为空就可以了。
这个方式,有2点要注意:
- 只能插入html源码,引用的外部文件比如js, css, image必须使用完整链接。或把 CSS/JS 文件上传到 Settings → Files,然后用完整链接引用它们。
- 渲染出的html代码中,部分app仍然会在header中添加部分内容,比如microsoft-clarity,无伤大雅。