WooCommerce: добавление краткого описания товара на архивные страницы

WooCommerce: добавление краткого описания товара на архивные страницы

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

WooCommerce: добавление краткого описания товара на архивные страницыё

Что вам потребуется

Для работы вам потребуется:

Установка WordPress

Редактор кода

WooCommerce: Быстрый старт, первые результаты

Создайте ваш интернет-магазин на WooCommerce с полного нуля уже сегодня!

Узнать подробнее

Установленный и активированный WooCommerce

Добавленные товары – я взяла стандартные данные для товаров, которые предлагает WooCommerce; более подробно в этом руководстве

Активированная тема, совместимая с WooCommerce – я использую Storefront

Прежде чем приступить, настройте WooCommerce. Для добавления краткого описания товара вам необходимо выполнить следующие 3 шага:

Создать и активировать плагин для функции

Добавить функцию вывода краткого описания товара

Определить хук в WooCommerce, в который необходимо встроить функцию

Создание плагина

Создайте новый PHP файл в папке wp-content/plugins. Я назвала свой tutsplus-product-archive-short-descriptions.php. Откройте файл в редакторе кода. В верхнюю часть файла добавьте этот код:

<?php
/**
 * Plugin Name: Tutsplus Display Product Short Descriptions in WooCommerce Archive pages
 * Plugin URI: http://code.tutsplus.com/tutorials/woocommerce-adding-the-product-short-description-to-archive-pages--cms-25435
 * Description: Add product short descriptions to the loop in product archive pages (requires WooCommerce to be activated)
 * Version: 1.0
 * Author: Rachel McCollin
 * Author URI: http://rachelmccollin.co.uk
 *
 */

Эти строки настроят плагин и передадут в WordPress всю информацию для активации. Перейдите на экран plugins в панели администратора WordPress и найдите плагин:

WooCommerce: добавление краткого описания товара на архивные страницыё

WooCommerce: Быстрый старт, первые результаты

Создайте ваш интернет-магазин на WooCommerce с полного нуля уже сегодня!

Узнать подробнее

Активируйте его. Если плагин пустой, то вы не заметите разницы. Сейчас главная страница магазина выглядит так:

WooCommerce: добавление краткого описания товара на архивные страницыё

Написание функции вывода краткого описания

Краткое описание товаров в WooCommerce использует выдержки, как в обычных постах. Чтобы отобразить его, достаточно отобразить выдержку к посту. Добавьте код ниже в файл плагина:

function tutsplus_excerpt_in_product_archives() {
 
 the_excerpt();
 
}

Вот так просто! Теперь функцию необходимо прицепить к правильному экшену, чтобы краткое описание выводилось в правильном месте на архивных страницах.

Вставка функции в правильный экшен

Давайте взглянем на файл в WooCommerce, отвечающий за вывод контента цикла на архивные страницы. Это файл content-product.php, и лежит он в папке templates в плагине WooCommerce.

Файл содержит ряд хуков, все они используются в WooCommerce для вывода различного контента.

Мы хотим отобразить выдержку под заголовком товара, поэтому нам нужен хук woocommerce_after_shop_loop_item_title. В файле content-product.php этот хук использует 2 функции woocommerce_template_loop_rating() и woocommerce_template_loop_price() с приоритетами 5 и 10 соответственно. Нам нужно прицепить нашу функцию с более высоким приоритетом, чтобы она запускалась позже. Я возьму с запасом 40.

Под функцией добавьте:

add_action( 'woocommerce_after_shop_loop_item_title', 'tutsplus_excerpt_in_product_archives', 40 );

Сохраните файл плагина и обновите страницу магазина в браузере. Теперь под товарами отображается краткое описание:

WooCommerce: добавление краткого описания товара на архивные страницыё

Эти описания слишком длинные. На настоящем сайте я использовала бы текст покороче. Зато так четко видно, что они отображаются на архивных страницах.

Заключение

WooCommerce почти весь контент отображает с помощью хуков, что упрощает добавление нового контента. Нужно лишь написать функцию и прикрепить ее к хуку. В этом уроке вы узнали, как добавить краткое описание товара на архивные страницы товаров. Можно добавить один-два условных тега в функцию, чтобы описание отображалось только на определенных страницах.

Автор: Rachel McCollin

Источник: https://code.tutsplus.com/

Редакция: Команда webformyself.

WooCommerce: Быстрый старт, первые результаты

Создайте ваш интернет-магазин на WooCommerce с полного нуля уже сегодня!

Узнать подробнее
Самые свежие новости IT и веб-разработки на нашем Telegram-канале

WooCommerce: быстрый старт, первые результаты

Создайте свой первый интернет-магазин на WooCommerce с полного нуля!

Получить

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree