WordPress лаборатория
Навигация
  • Главная
  • Как создать
    • Персональный Блог
    • Полноценный Сайт
    • Интернет-магазин
  • Блог
    • Инструкции
    • Электронная коммерция
    • Плагины
    • Заметки
  • Подборки
    • Шаблоны для интернет-магазинов
    • Elementor шаблоны
    • Шаблоны для лендинга
    • Шаблоны для блога
    • Бесплатные шаблоны
    • Как покупать темы
  • Инструменты
    • Шаблон плагина
🔥 Нужна помощь?
Мы можем помочь с любой задачей, так или иначе связанной с WordPress!
Создайте заявку
Бесплатная оценка стоимости без обязательств.

Создать заявку
Присоединяйся
WordPress лаборатория
WordPress лаборатория
  • Главная
  • Как создать
    • Персональный Блог
    • Полноценный Сайт
    • Интернет-магазин
  • Блог
    • Инструкции
    • Электронная коммерция
    • Плагины
    • Заметки
  • Подборки
    • Шаблоны для интернет-магазинов
    • Elementor шаблоны
    • Шаблоны для лендинга
    • Шаблоны для блога
    • Бесплатные шаблоны
    • Как покупать темы
  • Инструменты
    • Шаблон плагина
Профессиональная помощь экспертов
Мы можем помочь с любой задачей, так или иначе связанной с WordPress!
Создайте заявку
Бесплатная оценка стоимости без обязательств.

Создать заявку
🧒 Мой Аккаунт

Главная → Блог → WooCommerce Фильтры и События

Фильтр woocommerce_breadcrumb_defaults – Стилизация хлебных крошек в WooCommerce

  • 19 декабря, 2020
Total
0
Репостов
0
0
0
0
0

Изначально фильтр woocommerce_breadcrumb_defaults применяется в событии woocommerce_breadcrumb и позволяет стилизовать внешний вид хлебных крошек в WooCommerce

Пример работы с фильтром

Добавляем следующий код в functions.php дочерней темы:

/**
 * Стилизуем хлебные крошки в WooCommerce
 */

// Описиываем функцию для фильтра
function wpbl_breadcrumbs_style() {
    return array(
        'delimiter' => ' → ', // Меняем разделитель
        'wrap_before' => '<nav class="woocommerce-breadcrumb wpbl_custom_style" itemprop="breadcrumb">', // Добавляем CSS класс wpbl_custom_style
        'wrap_after' => '</nav>',
        'before' => '<span>',
        'after' => '</span>',
        'home' => _x( 'Наш Магазин', 'breadcrumb', 'woocommerce' ) // Меняем слово "Главная" на "Наш Магазин"
    );
}

// Добавляем сам фильтр
add_filter( 'woocommerce_breadcrumb_defaults', 'wpbl_breadcrumbs_style' );

Как видно мы добавили CSS класс wpbl_custom_style, а дочерние элементы обернули в <span>, давайте опишем новый класс:

.wpbl_custom_style span {
    padding: 0px 3px
}
.wpbl_custom_style > span > a {
    border-bottom: 1px dashed #999;
    color: #333 !important;
}
.wpbl_custom_style span:last-child {
    padding: 5px 7px;
    border-radius: 3px;
    margin-left: 7px;
    background-color: #dff0d8;
    border-color: #d0e9c6;
    color: #3c763d;
}

И как результат получим:

Фильтр woocommerce_breadcrumb_defaults - Стилизация хлебных крошек в WooCommerce
Фильтр woocommerce_breadcrumb_defaults – Стилизация хлебных крошек в WooCommerc

Обратите внимание

Для замены ссылки на главную страницу в хлебных крошках используется фильтр woocommerce_breadcrumb_home_url

Всё достаточно просто, a если у вас есть вопросы – спрашивайте в комментариях.

Спасибо.

Поделиться 0
Твитнуть 0
Читайте так же
Читать

Событие woocommerce_before_single_product

Читать

Фильтр woocommerce_breadcrumb_home_url – Меняем ссылку на главную страницу в хлебных крошках

Читать

Событие woocommerce_breadcrumb – отображение хлебных крошек

Читать

Событие woocommerce_before_main_content и как его изменить

Читать

Изменения в заголовке страниц WooCommerce с использованием фильтра для функции woocommerce_page_title()

2 комментария
  1. Уведомление: Событие woocommerce_breadcrumb 🎓 Хлебные крошки
  2. Уведомление: Фильтр woocommerce_breadcrumb_home_url 🎓 Ссылка на главную страницу

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

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

Руководства по WordPress
Что еще почитать?
  • Шаблоны лендинга для WordPress

    Шаблоны лендинга на WordPress: Рейтинг тем для создания целевых страниц

    Читать
  • Вариативные товары в WooCommerce Руководство по созданию

    Вариативные товары в WooCommerce – Руководство по созданию 2022

    Читать
  • WordPress.com или WordPress.org – что лучше?

    WordPress.com или WordPress.org – что лучше? (Сравнительная таблица)

    Читать
  • Ajax в WordPress - пособие по фоновой обработке данных

    Ajax в WordPress – пособие по фоновой обработке данных

    Читать
  • Плагин Elementor - Полное руководство 2020. Самый мощный и бесплатный конструктор сайтов

    Плагин Elementor – Полное руководство 2022. Самый мощный и бесплатный конструктор сайтов

    Читать
Инструменты разработчика
  • Шаблон WordPress плагина (генератор)
🔥 Нужна помощь?
Мы можем помочь с любой задачей, так или иначе связанной с WordPress!
Создайте заявку
Бесплатная оценка стоимости без обязательств.

Создать заявку
WordPress лаборатория - Еще один сайт на WP 💛
  • Обратная cвязь

Введите ключевое слово и нажмите Ввод