У меня есть сверстанный фронтенд интернет-магазина, который нужно натянуть на Drupal. Использую плагин Ubercart.
Сейчас товары выводятся таблицей:
<tbody>
<tr class="row-1 row-first row-last">
<td class="col-1 col-first">
<div class="views-field views-field-title"> <span class="field-content"><a href="/node/1">Товар 1</a></span> </div>
<div class="views-field views-field-uc-product-image"> <span class="views-label views-label-uc-product-image">Изображение: </span> <div class="field-content"><a href="/node/1"><img typeof="foaf:Image" src="http://lbgmpshl4kencia.h1n.ru/sites/default/files/styles/uc_product/publ... width="133" height="125" alt=""></a></div> </div>
<div class="views-field views-field-display-price"> <span class="views-label views-label-display-price">Цена: </span> <span class="field-content"><span class="uc-price">0.00 ₽</span></span> </div>
<div class="views-field views-field-changed"> <span class="views-label views-label-changed">Обновлено: </span> <span class="field-content">09/21/2019</span> </div> </td>
<td class="col-2">
<div class="views-field views-field-title"> <span class="field-content"><a href="/content/good2">Товар 2</a></span> </div>
<div class="views-field views-field-uc-product-image"> <span class="views-label views-label-uc-product-image">Изображение: </span> <div class="field-content"><a href="/content/ogurec"><img typeof="foaf:Image" src="http://lbgmpshl4kencia.h1n.ru/sites/default/files/styles/uc_product/publ... width="250" height="188" alt=""></a></div> </div>
<div class="views-field views-field-display-price"> <span class="views-label views-label-display-price">Цена: </span> <span class="field-content"><span class="uc-price">15.00 ₽</span></span> </div>
<div class="views-field views-field-changed"> <span class="views-label views-label-changed">Обновлено: </span> <span class="field-content">09/23/2019</span> </div> </td>
<td class="col-3">
<div class="views-field views-field-title"> <span class="field-content"><a href="/content/good3">Товар 3</a></span> </div>
<div class="views-field views-field-uc-product-image"> <span class="views-label views-label-uc-product-image">Изображение: </span> <div class="field-content"><a href="/content/rubaha"><img typeof="foaf:Image" src="http://lbgmpshl4kencia.h1n.ru/sites/default/files/styles/uc_product/publ... width="250" height="188" alt=""></a></div> </div>
<div class="views-field views-field-display-price"> <span class="views-label views-label-display-price">Цена: </span> <span class="field-content"><span class="uc-price">0.00 ₽</span></span> </div>
<div class="views-field views-field-changed"> <span class="views-label views-label-changed">Обновлено: </span> <span class="field-content">09/23/2019</span> </div> </td>
<td class="col-4 col-last">
</td>
</tr>
</tbody>
</table>
А мне нужно вывести товар с использованием сетки bootstrap - то есть, совсем по-другому:
<div class="good-list-product-card">
<div class="good-list-product-installment installment-visible">РАССРОЧКА 0-0-12</div>
<div style="background-image: url(img/chair.png);" class="good-list-product-preview"></div>
<p class="good-list-product-type">Категория товара</p>
<p class="good-list-product-name">Название товара</p>
<p class="good-list-product-price"><span class="good-list-product-value">25 000</span> ₽</p>
<p class="good-list-old-price"><span class="good-list-old-value">25 000</span> ₽</p>
<div class="cross-line good-list-cross-line"></div>
<img src="img/cart-icon.svg" alt="" class="good-list-buy-icon">
</div>
</div> <!-- col -->
Как можно реализовать такую замену шаблона?
Комментарии
Редактируете вьюс, которым у вас выводятся товары.
Во вьюсе меняете:
Формат: Неформатированный список (Сейчас сетка)
Класс строки good-list-product-card
CSS класс (всей вьюхи): col-12 col-md-6 col-lg-4 p-1
Чтоб такое сделать
<div class="good-list-product-installment installment-visible">РАССРОЧКА 0-0-12</div>
в настройки поля идете и там Настройки стиля - задаете формат контейнера и класс
такое:
<div style="background-image: url(img/chair.png);" class="good-list-product-preview"></div>
Ставим модуль https://www.drupal.org/project/image_url_formatter и форматируем урлом поле картинки
В настройках поля Перезаписать результаты
Обращаю внимание на ссылку во вьюхе "Информация" - по ней действительно можно переписать части шаблона вывода. Но делать это надо в последнюю очередь. А если из шаблонов удалять контейнеры запросто может AJAX отвалиться.
И еще: на теме fusion не стоит работать если вы не понимаете зачем она. Если Бустрапом ползуетесь скорей всего вам надо другая базовая тема. Как правильно подключать Бустрап - ответить не могу. Не люблю его.
Спасибо, решение помогло