TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

Минимизируйте беспорядок на сайте и улучшите взаимодействие с вкладками для WordPress

307

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

Итак, какова альтернатива сверхдлинной странице или слишком большому количеству страниц? Ну конечно же вкладки! И не беспокойтесь – вам не нужно быть гением программирования, чтобы получать вкладки на вашем сайте. Существует множество плагинов, которые включают эту функцию. Я собрал несколько лучших, чтобы помочь вам быстро и легко добавить контент с вкладками на ваш сайт WordPress.

Вкладки пользовательского интерфейса сообщений


Минимизируйте беспорядок на сайте и улучшите взаимодействие с вкладками для WordPress

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

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

После установки плагина все, что вам нужно сделать, это нажать соответствующую кнопку TinyMCE в редакторе сообщений, чтобы вставить соответствующий шорткод. Согласно официальному списку каталогов WordPress для вкладок пользовательского интерфейса сообщений, вы также можете вставлять вкладки, используя следующие короткие коды напрямую:

Содержимое вкладки [/ tab] Содержимое вкладки [/ tab] Содержимое вкладки [/ tab] [end_tabset]

Не стесняйтесь вставлять HTML в эти вкладки. С этим следует справиться без проблем, и вы увидите, что ваш контент отображается так же, как и где-либо еще на вашем сайте, только как вы могли догадаться, он содержится на вкладке.

Легко реагирующие вкладки


Минимизируйте беспорядок на сайте и улучшите взаимодействие с вкладками для WordPress

Еще один плагин, который вам обязательно стоит попробовать, если вы хотите добавить вкладки на свой сайт, – Easy Responsive Tabs. Он не только совместим с bootstrap 3.0, но также добавляет кнопки TinyMCE в визуальный редактор, что упрощает вставку адаптивных вкладок одним нажатием кнопки.

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

Адаптивные вкладки табби


Минимизируйте беспорядок на сайте и улучшите взаимодействие с вкладками для WordPress

Если отзывчивость – одна из ваших основных задач, вам подойдет Tabby Responsive Tabs. Проще говоря, этот плагин позволяет вставлять адаптивные вкладки в сообщения и страницы с помощью шорткодов. Он поддерживает более одного набора вкладок на простой странице или публикации и использует jQuery для создания вкладок и эффекта аккордеона на небольших экранах. Вы также можете получить доступ к вкладкам с клавиатуры.

Чтобы вставить вкладки, все, что вам нужно сделать, это вставить два коротких кода: [tabby] и [tabbyending]. В частности, вы должны использовать [tabby title = «tabname»] для установки имени вкладки. Затем вы записываете контент, который должен быть включен в эту вкладку, включая любой HTML-код, который вы хотите. Если хотите, можете вставить больше вкладок. Затем, чтобы завершить этот набор вкладок, используйте короткий код [tabbyending], чтобы закрыть группу вкладок.

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

Виджеты во вкладках

Иногда ваши потребности в отдельных вкладках немного сложнее. Для этих случаев есть плагин Widgets in Tabs. Он позволяет вам размещать любые виджеты на вкладках, чтобы сэкономить место и создать более организованный опыт на вашем веб-сайте. Он имеет множество применений.

Например, вы можете выбрать использование вкладок для отображения виджетов «Недавние сообщения» и «Недавние комментарии». Вы можете добавить категории, чтобы сделать отображение вкладок еще более округлым. Или вы можете создать группу вкладок, посвященную встроенным виджетам социальных сетей, таким как Facebook Like Box, канал Twitter, Google+, доска объявлений Pinterest и т.д.

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

Заголовки вкладок также можно прокручивать, что является хорошей альтернативой традиционному многослойному подходу. Также есть варианты анимации для переходов между виджетами, и вы можете установить, сколько секунд будет ждать переход от одной вкладки к другой.

Как и все другие перечисленные здесь плагины вкладок, его легко вставить благодаря короткому коду [остроумию].

WP UI – вкладки, аккордеоны, слайдеры


Минимизируйте беспорядок на сайте и улучшите взаимодействие с вкладками для WordPress

Последний плагин, о котором я собираюсь здесь рассказать, – это WP UI – Tabs, Accordions, Slider. Этот плагин не только упрощает встраивание вкладок в сообщения и страницы, но также позволяет легко интегрировать другие стили форматирования, такие как аккордеоны, ползунки и диалоги. Плагин работает на jQuery, и вы можете использовать более одной темы пользовательского интерфейса jQuery на каждой странице, если хотите.

Он поставляется с простой в использовании страницей параметров, которая упрощает настройку и использование. Он также добавляет специальные меню и диалоговые окна для упрощения навигации. Как и все вышеперечисленные плагины, этот в первую очередь полагается на шорткоды для быстрой реализации. Шорткод [вкладки wp] можно легко улучшить с помощью аргумента стиля, который можно изменить примерно 24 различными способами, например «wpui-blue», чтобы вкладки выглядели более согласованно с вашей темой.

Однако настоящей изюминкой этого плагина для меня является возможность отображать сообщения и каналы во вкладках или аккордеонах. Шорткод [wptabposts] позволяет отображать сообщения на нескольких вкладках. Или, если вы хотите отобразить канал на странице или в сообщении, просто используйте шорткод [wpuifeeds]. Согласно списку каталогов WordPress для пользовательского интерфейса WP, вы можете использовать [wpspoiler post = «3028»] для отображения только одного сообщения в этом специализированном формате.

Простые шорткоды


Минимизируйте беспорядок на сайте и улучшите взаимодействие с вкладками для WordPress

Конечно, если вам нужны просто базовые вкладки, обязательно подумайте о плагине Symple Shortcodes WordPress, созданном вручную здесь, в WPExplorer. Плагин включает в себя несколько прекрасных минимальных вкладок, которые вы можете использовать на любой странице своего сайта, а также множество других отличных функций для организации контента. Добавьте столбцы, переключатели, аккордеоны и множество других акцентов (кнопки, значки социальных сетей и т.д. ).


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

Вы используете вкладки на своем сайте? А что насчет любого из этих плагинов, в частности? Если да, то работали ли они на вас? Вы нашли другой способ добавить вкладки на свой сайт? Я бы хотел услышать ваш опыт использования этого изящного организационного трюка в комментариях!

Источник записи: https://www.wpexplorer.com

Этот веб-сайт использует файлы cookie для улучшения вашего опыта. Мы предполагаем, что вы согласны с этим, но вы можете отказаться, если хотите. Принимаю Подробнее