WooCommerce: вывод изображения бренда в карточке товара на странице «Магазин».

👋 Привет!
Опишу решение небольшого кейса, с которым пришлось сегодня столкнуться.

Входные данные:

На сайте используется плагин Perfect Brands for WooCommerce. Тема Bono.
По макету карточки товара, в верхнем левом углу необходимо выводить кликабельную картинку бренда.

При клике на изображение бренда осуществлять переход на страницу магазина, где товары фильтруются и выводятся по данному атрибуту.

Решение

Опытным путем принято решение использовать хук woocommerce_shop_loop_item_title.
В вашем случае он может быть другой, все зависит от темы.

Код

add_action('woocommerce_shop_loop_item_title', 'my_brand_img');
function my_brand_img() {
global $product;
# Сначала получаем все прикрепленные к товару бренды
$brands = get_the_terms($product->get_id(), 'pwb-brand');
# Зная id бренда, получаем id его изображения
$brand_img_id =  get_term_meta(  $brands[0]->term_id, 'pwb_brand_image', true ); 
# Получаем <img> тег картинки 
$brand_img =  wp_get_attachment_image( $brand_img_id, 'medium', false );

// Выводим картинку
echo '<div class="left_angle_top"><a href="'.home_url(). '/brand/' .$brands[0]->slug.'">' . $brand_img . '</a></div>';
}

Уточнения

  1. Переменная $brands содержит массив прикрепленных к товару брендов. В вашем случае может потребоваться обработка их всех. В приведенном выше примере обрабатывается первый элемент массива.
  2. «Прибить» картинку бренда к верхнему левому углу карточки можно с помощью css стилей. Например, прописать их для класса left_angle_top. Все зависит от темы сайта.

В итоге, получилось следующее:

Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии