dri*_*rip 11
你可以使用这样的东西:
替换<body>在theme.liquid与以下之一:
<body class="{{ template }} {{ page.handle }}{% if template == 'collection' %}{{ collection.handle }}{% endif %}{% if template == 'product' %}{{ product.title | handleize }}{% endif %}{% if template == 'blog' %}{{ blog.handle }}{% endif %}{% if template == 'article' %}{{ article.title | handleize }}{% endif %}">
将类添加到页面的body元素.
要打破它,这就是我正在做的事情:
{{ template }}
这将返回模板的名称(例如主页的索引,博客页面的博客,商店页面的集合等)
{{ page.handle }}
返回每个唯一页面的句柄(关于我们,联系我们...只有页面而不是集合,博客,产品)
{% if template == 'collection' %}{{ collection.handle }}{% endif %}{% if template == 'product' %}{{ product.title | handleize }}{% endif %}
在这里,我正在检查页面是否是集合,{% if template == 'collection' %}以及页面是否是产品{% if template == 'product' %},并{{ collection.handle }}使用handleize过滤器将集合的句柄和标题添加到产品页面{{ product.title | handleize }}.我检查页面,因为产品没有以正常方式返回句柄而我正在使用标题,如果我不检查集合,它也会将它添加到产品页面.
{% if template == 'blog' %}{{ blog.handle }}{% endif %}{% if template == 'article' %}{{ article.title | handleize }}{% endif %}
这一个逻辑与集合/产品逻辑相同.
一旦设置了上述内容,就可以为每个页面定位body类并按照这种方式设置样式.