В этой теме нет ответов

[metry]

Для внесения изменений зайдите в раздел Сайт-->Редактор шаблонов-->Товары и найдите:

	 </div>
	 </form>
</div>
{% ENDFOR %}
</div>
</div>
{% ENDIF %}
</div>
<!-- END Вывод товаров -->

замените на:

					 <!-- Выводим 3 характеристики -->
					 {% IFNOT goods.goods_attr_list_empty %}
					 <div class="attr-list">
						 {% FOR goods_attr_list %}
						 {% IF goods.goods_attr_list.index > 3 %}{break}{% ENDIF %}
						 <div class="attr">
						 <span class="name">{goods.goods_attr_list.NAME}:</span>
						 <span class="value">{goods.goods_attr_list.VALUE}</span>
						 </div>				
						 {% ENDFOR %}		
					 </div>
					 {% ENDIF %}
	 </div>
	 </form>
</div>
{% ENDFOR %}
</div>
</div>
{% ENDIF %}
</div>
<!-- END Вывод товаров -->

далее зайдите в раздел Сайт-->Редактор шаблонов-->main.css и в самый конец кода вставьте:

.products__grid .product__item:hover .product__shop .attr-list {position: absolute;background: #F6F6F6;left: 0;top: 100%;width: calc(100% - 2rem);z-index: 11;box-shadow: 0 2px 8px 0 rgb(4 60 130 / 30%);margin-top: 0;padding: 7px 20px 10px;height: auto;max-height: 100%;left: 0;right: 0;margin: -1rem auto auto auto;border-bottom-left-radius: 5px;border-bottom-right-radius: 10px;}
.products__grid .product__item .product__shop .attr-list {width: 100%;overflow: hidden;height: 0;max-height: 0;-webkit-transition: max-height .8s;transition: max-height .8s;}
.products__grid .product__item .product__shop .attr-list .attr {font-size: 12px;line-height: 16px;margin-bottom: 7px;padding-bottom: 7px;border-bottom: 1px solid #e5e5e5;}
.products__grid .product__item .product__shop .attr-list .attr:last-child {border: 0;margin: 0;padding: 0;}
.products__grid .product__item .product__shop .attr-list .attr .name {font-weight: 600;margin-right: 10px;}
.product__item:hover form {border-bottom-right-radius: inherit;border-bottom-left-radius: inherit;}
.products__grid .product__item:hover .product__shop:after{content: '';width: calc(100% - 2rem);height: 8px;background: #f6f6f6;position: absolute;bottom: 1rem;left: 0;z-index: 11;right: 0;margin: auto;}
@media (max-width: 992px) {
.products__grid .product__item .product__shop .attr-list {display: none;}
}