Главная » Wordpress » Произвольная вкладка для товара WooCommerce

Произвольная вкладка для товара WooCommerce

2016-10-10 / Вр:20:45 / просмотров: 5614

Всем привет!
Продолжаем ковырять плагин WooCommerce и настраивать интернет магазин под свои требования и пожелания.
Сегодня я расскажу, как создать произвольные вкладки для товара без плагина.
Названия вкладок будут отображаться на всех товарах.
Если мы использовали плагин «YIKES Собственные вкладки товара для WooCommerce», то вкладки добавлялись для каждого товара отдельно. Тут же можно сделать так, что все вкладки будут выставлены по умолчанию, только нужно будет вносить информацию, либо вытягивать из существующих полей, либо вставить раздел «Акции», «+ к товару скидка» и т.д.

Итак, заходим в файл «functions.php» вашей темы и вставляем вот такой код сразу после знака «<?»:

add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
function woo_new_product_tab( $tabs ) {

// Добавление вкладки

$tabs['test_tab'] = array(
'title' => __( 'Новая вкладка', 'woocommerce' ), // название ссылки для меню вкладки
'priority' => 50,
'callback' => 'woo_new_product_tab_content'
);

return $tabs;

}

function woo_new_product_tab_content() {

// Контент новой вкладки
echo '<h2>Новая вкладка</h2>'; // Заголовок вкладки
echo '<p>Это описание новой вкладки</p>'; // Контент вкладки

}

Что и где менять, смотрите комментарии в коде, я там все указал.
В результате:

Произвольная вкладка для товара WooCommerce

Если вам нужно добавить еще вкладку, тогда сразу в строку 11 (я указал /* сюда вставляем еще одну вкладку */):

add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
function woo_new_product_tab( $tabs ) {

// Добавление вкладки

$tabs['test_tab'] = array(
'title' => __( 'Новая вкладка', 'woocommerce' ), // название ссылки для меню вкладки
'priority' => 50,
'callback' => 'woo_new_product_tab_content'
);
/* сюда вставляем еще одну вкладку */
return $tabs;

}

… вставляем вот такой код:

$tabs['test_tab_2'] = array(
'title' => __( 'Новая вкладка-2', 'woocommerce' ), // название ссылки для меню вкладки
'priority' => 51,
'callback' => 'woo_new_product_tab_content_2'
);

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

Для 1-ой вкладки было «$tabs['test_tab']», для 2-ой вкладки «$tabs['test_tab_2']» (я добавил «_2»).
«priority» – здесь выставляем очередность вкладок.
«callback» – указываем название функции для вызова контента вкладки. Для 1-ой вкладки было «woo_new_product_tab_content», для 2-ой вкладки «woo_new_product_tab_content_2» (я добавил «_2»).

Теперь вызовим контент вкладки. Добавьте в конце нашего кода вот такой код:

function woo_new_product_tab_content_2() {

// Контент новой вкладки

echo '<h2>Новая вкладка-2</h2>'; // Заголовок вкладки
echo '<p>Это описание новой вкладки -2.</p>'; // Контент вкладки

}

Обратите внимание на строку №1.
Там указано имя функции «woo_new_product_tab_content_2», той, которую нужно прописать «callback».
Вот полностью готовый код для двух вкладок:

add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
function woo_new_product_tab( $tabs ) {

// Добавление вкладки

$tabs['test_tab'] = array(
'title' => __( 'Новая вкладка', 'woocommerce' ), // название ссылки для меню вкладки
'priority' => 50,
'callback' => 'woo_new_product_tab_content'
);

$tabs['test_tab_2'] = array(
'title' => __( 'Новая вкладка-2', 'woocommerce' ), // название ссылки для меню вкладки
'priority' => 51,
'callback' => 'woo_new_product_tab_content_2'
);

return $tabs;

}

function woo_new_product_tab_content() {

// Контент новой вкладки

echo '<h2>Новая вкладка</h2>'; // Заголовок вкладки
echo '<p>Это описание новой вкладки</p>'; // Контент вкладки

}

function woo_new_product_tab_content_2() {

// Контент новой вкладки

echo '<h2>Новая вкладка-2</h2>'; // Заголовок вкладки
echo '<p>Это описание новой вкладки -2.</p>'; // Контент вкладки

}

В результате:

Произвольная вкладка для товара WooCommerce