Как избежать дублирования divs.row при использовании заполнителей Sitecore и компонента-разделителя столбцов SXA? - PullRequest
Новая
       33

Как избежать дублирования divs.row при использовании заполнителей Sitecore и компонента-разделителя столбцов SXA?

2 голосов
/ 12 июня 2019

При использовании заполнителя Sitecore в сочетании с разделителем столбцов SXA , затем добавляются / отображаются несколько <div class="row">.Это вызывает непреднамеренные поля и отступы в нашем макете.

Вопросы:

  • Есть ли способ избежать этого?
  • Разве это не намерение использовать компонент Sitecore *1013* Column-splitter в заполнителе ?
  • Какие атрибуты я могу установить на Заполнитель , который позволит мне не отображать <div class="row">, который он сам генерирует?

Кроме того, я попытался изменить параметры настройки сетки в Sitecore, но нашел только один вариант:удалите генерацию <div class="row" глобально для всей сетки и всех заполнителей и компонентов SXA.Это не то, что я хочу.

Вот код, который я использую для создания заполнителя: 

@Html.Sitecore().Placeholder("SomePlaceholder")

Когда я добавляю внутри него SXA Разделитель столбцов внутри Sitecore, Я получаю дополнительную <div class="row"> (как видно на скриншоте консоли браузера ниже), которая вызывает проблему.

Screenshot from browser console, showing duplicate divs with class row

Я ожидаю, что там будетбыть только одним <div class="row"> с унаследованным полем и отступом, установленными сеткой.(В моем случае сетка Bootstrap 4, назначенная в настройке сетки Sitecore для нашей темы SXA)

Ответы [ 2 ]

4 голосов
/ 13 июня 2019

Вы можете исправить конфигурацию, указав определенные заполнители, которые вы хотите исключить из генерации строки. 

<?xml version="1.0" encoding="utf-8"?>
<configuration xmlns:patch="http://www.sitecore.net/xmlconfig/">
  <sitecore>
    <experienceAccelerator>
      <grid>
        <placeholderWrapper>
            <excludedPlaceholders>
                <placeholder patch:after="body-bottom">utility-links</placeholder>
                <placeholder patch:after="utility-links">login-link</placeholder>
            </excludedPlaceholders>
        </placeholderWrapper>
      </grid>
    </experienceAccelerator>
  </sitecore>
</configuration>

Например, в представлении мы используем: 

@Html.Sitecore().Placeholder("utility-links")

и 

@Html.Sitecore().Placeholder("login-link")

Что мы не хотели в новом ряду.

1 голос
/ 17 июня 2019

Есть несколько подходов к устранению поверхностного ряда.

  1. Поскольку Джен предложила добавить игнорируемый заполнитель, чтобы пропустить добавление этой оболочки на заполнители Row Splitter.
  2. Настройте представление cshtml Row Splitter для своего сайта, чтобы избежать отображения дополнительной оболочки в представлении, как указано здесь .

Но первое, что нужно проверить, это ваша версия SXA. Я считаю, что эта проблема присутствовала только в SXA 1.8 (с этого момента мы ввели Bootstrap 4) и впоследствии была исправлена ​​в SXA 1.8.1. Если обновление до 1.8.1 является вариантом, я бы определенно предложил это.

...