• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Изменить место вывода блока рекомендованных товаров

Image CMS

dangler

Новичок
#1
Здравствуйте!

Доброго вечера!

У меня woocomerce с темой Storefront.

Я бы хотел изменить вид страницы отдельного товара, а конкретно добавить фон под карточкой товара. Если бы вся информация о товаре была в одном блоке, то можно было бы добавить css для этого блока.

Однако, сейчас отдельный товар выводится так:
<div class="product">
<div class="images"></div>
<div class="summary"></div>
<div class="woocommerce-tabs"></div>
<div class="related products"></div>
</div>

То есть, если задать фон в css основного блока product, то фон появится и под рекомендованными товарами тоже. А мне нужно, чтобы фон был только под фотографией товара с ценой и описанием, а рекомендованные товары уже были отдельно.
Для этого нужно вынести div related из div product, чтобы стало так:
<div class="product">
<div class="images"></div>
<div class="summary"></div>
<div class="woocommerce-tabs"></div>
</div>
<div class="related products"></div>

Подскажите, пожалуйста, как это можно сделать?
 

rikitiki

Специалист
Местный
#2
Для этого нужно вынести div related из div product, чтобы стало так:
<div class="product">
<div class="images"></div>
<div class="summary"></div>
<div class="woocommerce-tabs"></div>
</div>
<div class="related products"></div>
Непонятно, почему по такой схеме див развёрнут по высоте, когда таб есть
http://xarod.tk/product/testovyj-tovar-2/
и сжат, когда таба нет
http://xarod.tk/product/testovyj-tovar-1/
 

dangler

Новичок
#3
rikitiki , а как у вас получилось добавить этот еще один div <div class="zzz"> , можете рассказать?
В какой файл вы добавляли его вывод?
Я смотрел в файле \wp-content\plugins\woocommerce\templates\single-product.php - там нет ни одного дива, только вызовы функций. Куда же div вставлять?
 
Последнее редактирование:

dangler

Новичок
#4
А по вашему вопросу - почему блок не развернут по высоте - это потому что div'ы внутри него него со свойством float: left;
У меня так бывало в практике, надо просто добавить перед закрытием этого блока пустой div со свойством clear: both; , который закроет эти float и даст блоку нормально растянуться
 
Сверху Снизу