<section>
        <div class="container">
          <div class="row">
            <div class="col-md-6">
              <ul class="image-list-classic">
                <li><img src="/wa-data/public/site/themes/consulting/img/faq1.jpg" alt=""></li>
                <li><img src="/wa-data/public/site/themes/consulting/img/faq2.jpg" alt=""></li>
              </ul>
            </div>
            <div class="col-md-6">
              <h3>Заголовок третьего уровня</h3>
              <p>Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века.</p>
              <div id="accordion" role="tablist" aria-multiselectable="true">
                <div class="toggle">
                  <div class="toggle-heading" role="tab">
                    <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                      <i class="fa fa-plus"></i> Краткий текст вопроса
                    </a>
                  </div>
                  <div id="collapseOne" class="panel-collapse collapse" role="tabpanel">
                    <div class="toggle-body">
                      <p>Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века.</p>
                    </div>
                  </div>
                </div>
                <div class="toggle">
                  <div class="toggle-heading" role="tab">
                    <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="true" aria-controls="collapseOne">
                      <i class="fa fa-minus"></i> Краткий текст вопроса
                    </a>
                  </div>
                  <div id="collapseTwo" class="panel-collapse collapse in" role="tabpanel">
                    <div class="toggle-body">
                      <p>Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века.</p>
                    </div>
                  </div>
                </div>
                <div class="toggle">
                  <div class="toggle-heading" role="tab">
                    <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="true" aria-controls="collapseOne">
                      <i class="fa fa-plus"></i> Краткий текст вопроса
                    </a>
                  </div>
                  <div id="collapseThree" class="panel-collapse collapse" role="tabpanel">
                    <div class="toggle-body">
                      <p>Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века.</p>
                    </div>
                  </div>
                </div>
                <div class="toggle">
                  <div class="toggle-heading" role="tab">
                    <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-expanded="true" aria-controls="collapseOne">
                      <i class="fa fa-plus"></i> Краткий текст вопроса
                    </a>
                  </div>
                  <div id="collapseFour" class="panel-collapse collapse" role="tabpanel">
                    <div class="toggle-body">
                      <p>Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века.</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
              

Первоначальная настройка

Перейдите в приложение Сайт — Блоки — создайте новый блок . В поле ID введите например: «home.faq», добавьте описание (необязательно) и вставьте полученный код в поле для ввода. Отредактируйте блок по своему усмотрению и сохраните его.

После создания блока появится пункт «Встроить на страницу или в шаблон:». Скопируйте код и вставьте его на страницу.

Важно! При вставке кода на страницу редактор должен быть в режиме HTML. Не забудьте что для кастомных страниц, должен быть указан дополнительный параметр страницы custom=1

---

Детали

Вывести изображения можно двумя способами: используя стандартный код (2 изображения) или заменить одним.

В данном примере у нас 2 изображения. Размер первого 360x386 второе 400x280

Чтобы использовать одно изображение, замените пердыдущий код на более простой.