BloGGood.ru

Блог Костаневича Степана

До Нового Года осталось:

Блог на разные темы, seo-оптимизация, раскрутка сайта, создание сайта, вкусные эффекты для сайта и многое другое…

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

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

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

Всем привет!
Продолжаем ковырять плагин 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

Все, спасибо за внимание!

Понравился пост? Помоги другим узнать об этой статье, кликни на кнопку социальных сетей ↓↓↓

Получай обновления блога!!! Подпишись:

Популярные статьи:

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

;-) :| :x :twisted: :smokes: :smile: :shock: :sad: :rose: :roll: :razz: :pop-corne: :oops: :o :mrgreen: :lol: :idea: :grin: :gazeta: :evil: :cry: :cool: :coffe: :arrow: :???: :?: :!:

Чтобы добавить в комментарий код HTML, PHP, CSS, JavaScript, нужно сделать так: [code] ваш код [/code]

Subscribe without commenting

Метки: ,

Мои цели на 2017 год:

1). Закончить тему «Bootstrap»

2). Закончить тему «Все про PHP и MySQL»

3). Довести количество статей до 750

4). Создать портфолио и мини интернет-магазин шаблонов

5). Создать книгу

6). Довести количество статей до 800

7). Добиться посещаемости 3000 человек/сутки

8). Увеличить число подписчиков до 250

Статистика по блогу

Количество записей на блоге: 734
Количество страниц на блоге: 20
Количество рубрик на блоге: 27
Количество меток на блоге: 71
Количество комментариев на блоге: 4010