Обзор плагинов для создания WordPress Tabs

Всем привет, сегодня хочу поговорить о создании вкладок (они же табы) в Вордпрессе. WordPress Tabs - это javascript переключалка контента, которая для поисковых ботов видна как сплошной текст, а вот реальные пользователи могут при необходимости переключится между отдельными табами / вкладками таким образом скрывать или показывать отдельные части контента.

Чем же хороши WordPress Tabs ? -

• они улучшают поведенческие факторы,
• с их помощью страница перестает быть похожая на здороветельную портянку,
• можно развести в отдельные блоки "описание", "характеристики", "галерею" одного и того же товара или услуги.

На большинстве CMS для создания вкладок (Tabs) необходимо быть хорошим javascript програмистом со знанием jquery + необходимо придумать механизм добавления таба в средину контента. На WP это делается очень просто, благодаря множеству плагинов, а также встроенному механизму шорткодов. Что это такое и как создать шорткод wordpress можно почитать перейдя по ссылке, но мы не будем сегодня останавливаться на этом моменте, у нас обзор плагинов, этим и займемся.

Плагины для WordPress Tabs

На wordpress.org можно найти кучу плагинов для создания вкладок, они мало чем отличаются друг от друга, разве что дизайном и простотой использования в редакторе WP. Я постараюсь честно описать работу с ними и снять пару скинов для каждого.

Easy Responsive Tabs

* по состоянию на 11.09.2015

Довольно привлекательный и функциональный плагин, вот приблизительно такой вид имеет вывод вкладки на сайте:вот так выглядит код вставки wordpress tabs в редакторе поста (картинка кликабельная):

К плюсам этого плагина можно отнести:

• можно настраивать цвет текста и цвет фона wordpress tabs в разных состояниях;
• легко вставлять в редактор благодаря интеграции с редактором WP, клик на вот этот значек вставляет нужные шорткоды: и их не нужно записывать руками;
• если вкладок очень много лишние уйдут в "гамбургер";
• адаптивность под ширину окна;
• множество настроек табов: можно выстроить табы слева, справа по центру, а также сверху и снизу текста.

Если вкратце описывать мои впечатления от использования этого плагина, - то они только позитивные. Единственный момент большинство плагинов wordpress tabs используют общий код, что то в этом роде "Tabs", "Tab" - этот же использует свой шорткод "restabs" "restab" без правок перескочить с другого плагина на этот увы не получится.

Моим клиентам в этом плагине нравится то, что можно очень просто создать wordpress вкладки без запоминаний текста шорткода, для меня, в этом плагине большой плюс - это адаптивность.

WordPress Post Tabs

* по состоянию на 11.09.2015

Довольно не плохой плагин для создания wordpress tabs, эго главное отличие в том, что дизайн всех табов на вашем сайте будет уникальным, просто он задается один раз в настройках:

На странице табы выглядят вот так:

или так:

Цветовую схему можно прописать отдельно в файле стилей. С одной стороны это хорошо, ведь для смены дизайна потребуется минимум знаний CSS и Хтмл.

Положительные моменты этого плагина:

1. Весь дизайн собран в одном месте.
2. Есть настройки работы и эффектов для вкладок и содержимого таба.
3. Легко интегрируется с редактором вордпресса.
4. Можно открывать табы в новом окне.
5. Если у вас до этого был другой шорткод вы можете сменить текст шорткода этого плагина на тот что у вас был раньше, и это очень удобно при переходе с одного wordpress tabs на другой.

К недостаткам этого плагина я бы отнес отсутствие адаптивности. Все табы просто уезжают вниз, на красивом адаптивном сайте они просто испортят весь вид, придется пилить под себя.

Tabs Shortcode

На фоне двух предыдущих плагинов для создания wordpress tabs, этот выглядит совсем уныло. Во первых дизайн нужно по-любому менять через стили CSS:

Также плагин не интегрирован с редактором WP, а по этому этот вагон шорткодов нужно забивать руками:Занятие так себе :), зато его шорткод вызова уникальный и его в любой момент можно удалить и установить следующий плагин. О адаптивности даже смысла говорить нет, разве что вы сами напишите нужный код :-).

Squelch Tabs and Accordions Shortcodes

Довольно новый плагин для создания wordpress tabs, в его описании говорится куча всего хорошего, есть много скриншотов и все такое, но по факту я не смог найти настроек этого плагина, а по этому у меня получилась вот такая байда:

Единственный приятный момент - это унифицированный код вызова шорткода таба, - в любой момент можно перейти на другой плагин с аналогичным вызовом :-).

Это wordpress tabs, как и предыдущий, как по мне годится для разработчиков сайтов, они могут его нормально допилить на стилях. Для заказчика это сплошной геморой, ведь вводить руками код вызова не очень приятно.

Вкладки и табы wordpress для виджетов / сайдбаров

Все описанные выше плагины wordpress tabs позволяют выводить вкладки и табы в постах и страницах, ну и других местах где работают шорткоды. От сюда следует вывод, что они будут нормально работать и в сайдбаре через виджеты. Достаточно просто вставить текстовый блок в ваш виджет и запихнуть туда руками шорткод вызова. В большинстве тем этот кусок кода заработает сразу, но может быть ситуация когда в вашей темы отключены шорткоды, как это исправить можно прочесть вот здесь: не работают шорткоды wordpress.

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

Какой WordPress Tabs я рекомендую использовать

На вкус и цвет - товарищей нет, но на мой взгляд первый и второй плагин для создания вкладок wordpress tabs самые предпочтительные. Easy Responsive Tabs - хорошо адаптируется под ширину окна браузера, а дефолтовые стили всегда можно забить в CSS. Второй плагин, WordPress Post Tabs, также заслуживает внимания, благодаря ему можно создать простой и ненавязчивый интерфейс табов / вкладок ВП.

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

Смотрите другие обзоры плагинов:

1. Advanced Custom Fields
2. Contact Form 7
3. плагин Lightbox WordPress
4. SEO плагины для WordPress