Question

是否可以使用逻辑语句更改Shopify液体页面中的css属性？类似的东西：

{% case template %}
{% when 'index' %}
#headlogo{display:none}
{% endcase %}

Answer 1

您可以在 theme.liquid ：

中添加类似的内容

<head>
  ...

  {% case template %}
  {% when 'index' %}
    <style> 
      #headlogo { display:none }
    </style>
  {% endcase %} 
</head>

或者您可以有条件地加载样式表，see here for an example：

{% if template contains 'index' or template contains 'collection' %}
  {{ 'style.theme-dark.css' | asset_url | stylesheet_tag }}
{% else %}
  {{ 'style.theme-light.css' | asset_url | stylesheet_tag }}
{% endif %}

Answer 2

我会在<body>添加一个类：

<body class="{% if customer %}customer-logged-in{% endif %} template-{{ template | replace: '.', ' ' | truncatewords: 1, '' | handle }}">

然后你可以这样做：

.template-index #headlogo {
    display: none;
}

Answer 3

你可以使用＆＃34; if template＆＃34;仅在布局，模板和代码段上发表声明。

这里更好的决定

theme.liquid或一些Template，Snippet：

<div id="headlogo"{% if template == 'index' %} class="hide_logo"{% endif %}>

CSS

.hide_logo{
   display: none;
}

Shopify - 逻辑语句和CSS

3 个答案: