Как добавить разные сайдбары в Woocommerce

Как добавить разные сайдбары в Woocommerce

Иногда при редактировании темы WordPress стоит задача добавить разные сайдбары на страницы Woocommerce. На страницу категорий и магазина один сайдбар, на страницу продукта — другой. Это можно легко осуществить, если данный плагин подключен к теме через функцию <?php woocommerce_content(); ?> без правки файлов Woocommerce.

Добавляем новый сайдбар на страницу продукта.

Предположим, что в вашей теме уже есть одна боковая колонка и вам понадобилось добавить еще один сайдбар. Создадим файл и дадим ему имя — sidebar-right.php. Запишем в него этот код и сохраним. Задайте свои классы и id.

<?php  if ( is_active_sidebar( 'theme-right-sidebar' ) ) { ?>
	<aside id="sidebar-right" class="">
		<?php dynamic_sidebar( 'theme-right-sidebar' ); ?>
	</aside>
<?php } ?>

В файл functions.php добавим новую зону для виджетов в существующую функцию:

register_sidebar(
	array(
		'name'		 => esc_html__( 'Right Sidebar', 'envo-multipurpose' ),
		'id'		 => 'theme-right-sidebar',
		'before_widget'	 => '<div id="%1$s" class="widget %2$s">',
		'after_widget'	 => '</div>',
		'before_title'	 => '<div class="widget-title"><h3>',
		'after_title'	 => '</h3></div>',
	)
	);

Теперь найдите файл в вашей теме отвечающий за вывод контента магазина — woocommerce.php. В этом файле обычно уже подключен сайдбар темы, удалите этот код:

<?php get_sidebar( '' ); ?>

И добавьте функцию которая подключит разные сайдбары. В данном случае правый сайдбар на страницу одного продукта, левый на все остальные страницы магазина.

<?php if (!is_singular(array('product')) ): ?>
    <?php get_sidebar( 'right' ); ?>    
<?php else : ?>
    <?php get_sidebar( 'left' ); ?>
<?php endif; ?>

Способ для темы с кастомным шаблоном Woocommerce.

Если в теме шаблон магазина кастомизирован и вы видите в ее папке много файлов относящихся к Woocommerce, то откройте файл single-product.php и найдите там код отвечающий за вывод боковой панели в магазине — do action(‘woocommerce_sidebar’). Это может выглядеть вот так:

<div id="secondary" class="widget-area secondary-right sidebar">
            <?php
            /**
             * woocommerce_sidebar hook
             *
             * @hooked woocommerce_get_sidebar
             */
            do_action('woocommerce_sidebar');
            ?>
</div>

Теперь поменяйте id и class на атрибуты нового сайдбара.

Как удалить сайдбар со страниц Woocommerce.

Воспользуйтесь этим хуком  если требуется удалить сайдбар со страницы одиночного продукта:

/**
 Remove Sidebar @ Single Product Page
 */ 
add_action( 'wp', 'theme_remove_sidebar_product_pages' );
 
function theme_remove_sidebar_product_pages() {
if ( is_product() ) {
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );
}
}

Удаляем боковую колонку со страниц продукта в популярной теме Storefront.

/**
 *Remove Sidebar @ Single Product Page for Storefront Theme
 */
 
add_action( 'get_header', 'remove_storefront_sidebar' );
 
function remove_storefront_sidebar() {
    if ( is_product() ) {
        remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
    }
}

Этот хук также удалит сайдбар в теме Storefront, но сделает область содержимого страницы продукта шириной 100% без дополнительного CSS.

/**
 * Remove sidebar on product pages in Storefront.
 */
function theme_remove_sidebar( $is_active_sidebar, $index ) {
    if( $index !== "sidebar-1" ) {
        return $is_active_sidebar;
    } 
    if( ! is_product() ) {
        return $is_active_sidebar;
    } 
    return false;
}
 
add_filter( 'is_active_sidebar', 'theme_remove_sidebar', 10, 2 );

СтраUz
Читайте также
Привет! Я Натали Мамбетова.

Занимаюсь разработкой сайтов, блогов, интернет-магазинов, лендингов на WordPress. Оказываю платные помощь и консультации. Являюсь сертифицированным партнером TemplateMonster по CMS системе WordPress, имею сертификат этой компании подтверждающий мои навыки в работе с данной системой.

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

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

© СтраUz 2018. Все права защищены. Копирование разрешено только с указанием гиперссылки на источник.
Сделано с ❤
Заказать сайт