Как добавить изображение полной страницы на главную страницу под навигационными ссылками в Shopify (жидкая разметка)?

Все, я новичок в жидком языке разметки. Я создаю веб-сайт для электронной коммерции и размещаю изображение полной страницы в верхней половине страницы (прямо под ссылками навигации). Это выглядит великолепно, но единственная проблема заключается в том, что когда вы нажимаете на другую страницу, изображение также фиксируется на этой странице.

Я хотел бы, чтобы это изображение было только на главной странице моего веб-сайта. Сможет ли кто-нибудь помочь мне с этой проблемой?

Вот ссылка на фактический сайт: http://starpro-greens.myshopify.com/

И вот мой код для этого изображения:

HTML (помещается в theme.liquid на вкладке Layouts):

 <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 (помещается в theme.scss.liquid на вкладке Assets):

.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;

person Every1sasuperhero    schedule 13.10.2015    source источник


Ответы (1)


Вы можете заключить код, отображающий изображение, в оператор if следующим образом:

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

См. этот аналогичный вопрос и Покупайте документы в альтернативных шаблонах для получения дополнительной информации.

person Steph Sharp    schedule 14.10.2015