Question

每个人，我都是液体标记语言的新手。我正在创建一个电子商务shopify网站，并在页面的上半部分放置一整页图像（在导航链接下）它看起来很棒，但唯一的问题是当你点击另一个页面时图像也固定在该页面上。

我只想在我网站的主页面上看到这张图片，有人能帮我解决这个问题吗？

以下是指向实际网站的链接：http://starpro-greens.myshopify.com/

以下是此图片的代码：

HTML（放置在“布局”选项卡下的theme.liquid中）：

 <div class="grid__item large--two-thirds large--display-table-cell         medium-down--hide">
          {% include 'site-nav' %}
        </div>
      </div>
    </div>
  </header>

      <div class="imagetop">
        .



  <div class="grid__item large--four-fifths bg ">

          {{ content_for_layout }}
        </div>
      </div>

CSS（放置在Assets选项卡下的theme.scss.liquid中）：

.imagetop{
    background-image: url({{ 'top.png' | asset_url }});
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 250px;
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #000;

Answer 1

您可以将显示图像的代码包装在if语句中，如下所示：

{% if template contains 'index' %}
    Your code to display the image goes here...
{% endif %}

有关详细信息，请参阅备用模板上的this similar question和Shopify docs。

如何在Shopify（液体标记）的导航链接下的主页面上添加整页图像？

1 个答案: