Меня попросили в магазине WooCommerce пометить проданные товары перечеркнутой линией:
Сделать это можно добавив в файлы functions.php и style.css следующий код:
Файл functions.php:
add_action( 'woocommerce_before_shop_loop_item_title', function() {
global $product;
if ( !$product->is_in_stock() ) {
echo '<hr id="soldout">';
}
});
Style.css:
hr#soldout {
height: 5px;
width: 270px;
background-color: #D13939;
border: 0;
margin-top: -100px;
margin-bottom: 94px;
margin-left: -57px;
-webkit-transform: rotate(134deg);
-moz-transform: rotate(134deg);
-ms-transform: rotate(134deg);
-o-transform: rotate(134deg);
}
Конечно значения цвета, ширины, длины, угла наклона линии и отступы Вам самим придется подобрать под свой сайт. Но принцип должен быть понятен.
Но мне больше нравится вариант с надписью "Нет в наличии":
Для этого вместо выше указанного кода добавляем в файл functions.php:
add_action( 'woocommerce_before_shop_loop_item_title', function() {
global $product;
if ( !$product->is_in_stock() ) {
echo '<span class="onsale soldout">Нет в наличии</span>';
}
});
И в файл Style.css:
span.onsale {
background: #D13939 !important;
}
Понравилось? =) Поделись с друзьями:
Спасибо, вариант простой и удобный!
Сможете помочь? Мне нужно изменить размер шрифта цены товара на главной(странице всех товаров). Вроде бы нашел коды, которые ставятся в файл style.css. Они меняют размер шрифта, но меняют в том случае, когда стоит обычная цена(перечеркнутая) и цена распродажи. Если я оставляю обычную цену, а цену распродажи не ставлю(не нравится мне с перечеркиванием), то эти коды не работают.
Надеюсь мой вопрос понятен. Может подскажете че сделать?
dimmka, нужно смотреть на сайте, так ничего не увидев ничего подсказать не могу.
А как сделать то же самое, но еще и в карточке товара?
а как прописать что товар «есть на складе!»?
что бы быkо не только «нет в наличии», но и что товар реально есть. Понятно что это по умолчанию подразумевается что все товары есть в наличии если указана цена и нет предупреждения о том что закончился, но все таки надо именно подчеркнуть, акцентировать внимание что товар есть в наличии.
если не сложно, подскажите…
Добрый день! а у меня отображается нет в наличии не сверху картинки а под ней
Подскажите как сделать тоже самое, но только что бы надпись выводилось только на странице одиночного товара. Какой хук нужно использовать?