Урок 235 Как сделать панель вкладок в WordPress

Привет! Много кто из читателей спрашивали и продолжают спрашивать, как сделать панель с вкладками в WordPress (примерно такую, как у меня на сайте справа: "Рубрики", "Популярно", "Архив"). Если лезть в код, это довольно проблематично, я пробовал разбираться, но у меня ничего не получилось, так как в PHP я довольно слаб.

Сегодня же я решил поделиться способом, как просто сделать панель вкладок через плагин SidebarTabs. Ели вдруг этот плагин Вам не поможет, то  можете попробовать его аналоги: Tabbed Widgets, Tabber Tabs Widget,  Fun with Sidebar Tabs и другие.

Как сделать панель вкладок в WordPress

  1. Для начала нужно скачать плагин SidebarTabs.
  2. Теперь нужно будет каждую вкладку создать по отдельности. Для этого заходим в Админка WordPress -> Параметры -> sidebarTabs.
  3. Нажимаем на кнопку "Create New sidebarTab".
  4. В следующем окне, где написано 'Widget", выбираем нужный виджет вкладки. В данном случае я сделаю панель вкладок из "Рубрики" и "Архивы", сначала выбираем "Рубрики":
  5. По желанию Вы можете добавить иконки к вкладкам, также задаете название вкладке (Tab name), изменить стили. После редактирования всего этого, нажимаем на кнопку Save.
  6. Повторяем 3-ий и 4 -ый шаг, только уже для "Архивы".
  7. Там же в настройках данного плагина запоминаем номера "Order ":
  8. Заходим админка WordPres -> Внешний вид -> Виджеты. Перетаскиваем виджет плагина sidebarTabs и где написано "Orders sidebarTabs: " прописываем те самые номера "Order" через запятую, которые нам нужно вывести в панели вкладок.
  9. Если покопаться в внешнем виде, можете даже сделать что-то подобие моей панели вкладок 🙂 :
  10. У данного плагина очень много настроек: можно задать заголовок панели вкладок, вывести вкладки по горизонтали/вертикали, редактировать внешний вид, задать иконки и т.п. Думаю, Вы разберетесь.

Повторюсь, если вдруг данный плагин не заработает, можете еще попробовать Tabbed Widgets, Tabber Tabs Widget,  Fun with Sidebar Tabs.

Спасибо за внимание, до скорой встречи! 🙂

P.s.  Вы хотите купить недвижимость? Знайте, существует огромная база недвижимости на портале www.bpn.ru!

С уважением, Пётр Александров.
Подпишитесь на бесплатные уроки

Понравился урок? Вы не хотите пропускать новые бесплатные уроки по созданию, раскрутке и монетизации блога? Тогда подпишитесь на RSS или на электронный ящик в форме выше и получайте новые уроки мгновенно! Также можете следить за мной в Twitter.

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

Такой e-mail уже зарегистрирован. Воспользуйтесь формой входа или введите другой.

Вы ввели некорректные логин или пароль

Извините, для комментирования необходимо войти.

Нажав кнопку "Отправить", я согласен с соглашением на обработку моих персональных данных.

29 комментариев

по хронологии
по рейтингу сначала новые по хронологии
Евгений http://gaydpc.ru

Все прекрасно работает, большое спасибо. Сейчас только вот разбираюсь с цветами, а то серый цвет вообще не подходит.

Disemper http://f1-it.ru

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

Николай http://newswp.ru/

ООО спасибо давно мечтал это сделать!!! Спасибо большое Вам...

Автор
Пётр Александров

Рад, что Вам пригодилось.

Николай http://newswp.ru/

Правда еще у меня есть вопрос, как Вы сделали что бы с верху было выдвижное меню секретные материалы и это с права мои цели и уже достиг... Подскажите пожалуйста!!!!

Автор
Пётр Александров

Это делал верстальщик темы, я не знаю как 🙂

Николай http://newswp.ru/

Ясно спасибо за ответ!!!!

Андрей http://bistroinfo.com

Еле нашел доступное описание по панели вкладок, спасибо большое!!!

Вячеслав http://effectmoney.ru/

Спасибо. Как всегда вовремя. Давно ищу такой плагин, но находил обычно плагины с глюками или не то, что хотел.... Этот как раз то что я искал.

Михаил http://gakugo.ru

Версия плагина слабенькая. Пытался сделать такой же, да не получается. =(

Никита Рябин http://pro97.ru/

А я вот как-то не хочу делать такую панель, нравится больше когда всё в столбце, и результата приносит больше!

Mr. Android http://androidtab.ru

Почитал об этом плагине на сайте вордпресса. Написано что он не обновлялся уже 2 года. Поновее ничего такого нет? 🙂

Алексей http://prostoguitar.ru

Ура! 🙂 Спасибо Петь, давно ждал этот урок! Пытался замутить такое кодом, но нечего не вышло. А тут все так просто! Огонь!)))

Андрей http://goo.gl/z6ghj

Плагины для WORDPRESS вообще являются спасительной соломинкой для решения абсолютно всех возникающих проблем при создании и эксплуатации своей площадки.

Константин

А как сделать, чтобы в этом плагине была иерархия рубрик и подрубрики выпадали как у Вас

Плагин не работает. Остальные глючат (

Татьяна

Я совершеннешний Чайник , можно ли создать простейший блог без всех этих непонятных терминов и чтобы его могли читать все желающие ? . Пока я скачиваю интересные посты , но кроме меня их никто не может читать. Пример - 10 готических соборов. Сделала в черновике , а когда выставляла , не печатались подписи к фото . Но в конце , всем скопом , напечатались. А сейчас ещё интересней - в черне сделала пост , нажимая предпросмотр , а в заключение , когда хотела выставить пост ,кнопка Добавить не работает. После окончания работы , когда убрала все программы , и плод моего труда пропал. Т. е. раньше хоть всё переносилось , а теперь и этого нет. Браузер интернет эксплоер , соц. система майл ру. Зарабатывать не собираюсь , но хочу понять , в чём дело , а спросить не у кого.

Автор
Пётр Александров

Попробуйте использовать другой браузер, например Google Chrome

Роман

Добрый вечер, Петр. Сделал все как у вас написано, вывел Рубрики и Популярные записи. Но на сайте отображаются только кнопки и информацию не отображают. В чем может быть проблема

Александр http://3apabotai-pro100.ru/

День добрый, интересует вот такой вопрос, какой плагин поможет отобразить мою фотографию в верхушке правого блока? И очень хочется узнать, как создать подписку на свой сайт?

Автор
Пётр Александров

Там не нужен плагин, с помощью кода надо )

Алексей http://ws-life.ru

Спасибо большое! Долго искал что то подобное.... Даже сам пытался на чужих сайтах в PHP и скриптах покопаться.... Сейчас CSS настроить мне разплюнуть!

Павел http://www.sokolovpavel.ru

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

Евгений http://smetskiy.com

Не работает в новой версии вордпрес

IvYur http://kuponam.ru

Перед тем как скачивать плагин посмотрите для какой он версии вордпресса. Что касается вашего случая - то посмотрите есть ли обновление для вашего плагина до нужной вам версии движка.

Евгений http://smetskiy.com

Петр, помоги сделать такие вкладки, данный плагин не работает в новой версии, может что-то подобное есть !!! Буду очень благодарен..

Автор
Пётр Александров https://wpnew.ru

К сожалению, я не знаю, с другими плагинами не работал.

Novikov http://novikov.dp.ua/

Петр, благодарю за статью, хоть еще и не прочитал до конца и еще не попробовал ))
Только собрался написать вам на имейл вопрос об этом, как решил сперва полистать ваш блог и нашел как раз то ,что искал!!!

День добрый! Если сможете, подскажите пожалуйста. Необходимо во вкладки поставить, разместить карусели-слайдеры. Но оказалось , что срабатывает только одна вкладка, в остальных карусели не работают . Как быть

Наверх