Отзывы, которые клиент пополняет сам
Отзывы приходят постоянно, и лучше, чтобы клиент добавлял их сам. Каждый отзыв — строка списка: цитата, фото гостя и подпись.
Что получится
<section class="reviews">
<h2 fld-text="Reviews title">What guests say</h2>
<div class="reviews__list" fld-loop="Reviews">
<figure class="review">
<blockquote fld-area="Quote">The quietest table in town and the best flat white.</blockquote>
<figcaption>
<img class="review__photo" src="images/guest-1.jpg" alt="" fld-image="Guest photo">
<span fld-text="Guest name">Maria, regular</span>
</figcaption>
</figure>
<figure class="review">
<blockquote fld-area="Quote">They remember my order after one visit.</blockquote>
<figcaption>
<img class="review__photo" src="images/guest-2.jpg" alt="" fld-image="Guest photo">
<span fld-text="Guest name">Leo, works next door</span>
</figcaption>
</figure>
</div>
</section>“The quietest table in town and the best flat white.” — Maria
“They remember my order after one visit.” — Leo
“Cardamom bun every Friday.” — Ines
Третий отзыв клиент добавил в админке.
Пошагово
Список — на блок с отзывами
fld-loop на обёртке, внутри которой идут отзывы.
<div class="reviews__list" fld-loop="Reviews">
Цитата
Отзыв бывает в несколько строк — fld-area, переносы клиента сохранятся.
<blockquote fld-area="Quote">The quietest table in town and the best flat white.</blockquote>
Фото и подпись
fld-image на
<img>и fld-text на имени гостя.<img class="review__photo" src="images/guest-1.jpg" alt="" fld-image="Guest photo"> <span fld-text="Guest name">Maria, regular</span>
Каждый отзыв размечен
Все отзывы с теми же атрибутами — тогда «Загрузить данные» перенесёт их все.
<figure class="review"> <blockquote fld-area="Quote">They remember my order after one visit.</blockquote>
Что важно
- Порядок отзывов клиент меняет перетаскиванием строк, а лишний удаляет — блок не сломается.
- Описание фото (
alt) берётся из медиатеки WordPress, а не из вёрстки.
Частые ошибки
Журнал сборки — вкладка «Логи» вашего проекта на themeforge.pro; те же замечания показывает бесплатная проверка разметки.
<figure class="review">
<blockquote fld-area="Quote">The best flat white.</blockquote>
<figcaption fld-text="Quote">Maria, regular</figcaption>
</figure>Одно имя у двух разных полей — цитаты и подписи: сборка сообщает о коллизии, и в админке остаётся одно поле на две роли.
<figure class="review">
<blockquote fld-area="Quote">The best flat white.</blockquote>
<figcaption fld-text="Guest name">Maria, regular</figcaption>
</figure>У каждого поля своё имя.