Аккордеон для категорий wordpress

Как добавить аккордеоны в ваши посты и страницы с аккордеона WordPress плагина

Divi: самая простая тема WordPress для использования

Divi: Лучшая тема WordPress всех времен!

Более Загрузка 901.000, Divi — самая популярная тема WordPress в мире. Он является полным, простым в использовании и поставляется с более чем бесплатными шаблонами 62. [Рекомендуется]

Аккордеоны — очень популярная функция в интернете. Они позволяют представить максимум содержимого в ограниченном пространстве. Как правило, они представляют собой выпадающие меню, которые отображаются по очереди после щелчка.

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

Но раньше, если вы никогда не устанавливали WordPress, откройте для себя Как установить WordPress блог шаги 7 et Как найти, установить и активировать WordPress тему на своем блоге

Тогда вернемся к тому, почему мы здесь.

Как установить плагин Accordion’s WordPress

Как создать аккордеон

После установки и активации плагина в меню панели инструментов появится новое меню. Нажмите на Новые аккордеоны Создать новый аккордеон.

На этой новой странице, идентичной странице создания статьи, вы сможете сохранить заголовок и настроить аккордеон в » Варианты Аккордеоны .

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

На самом верху у вас есть короткий код в соответствии с текущим аккордеоном, скопируйте его, потому что мы будем использовать его позже в статье или на странице. Мы начнем с создания контента, нажав на вкладку » Content .

Узнайте, как воспроизводить макеты, открыв для себя Как продублировать статью или страницу на WordPress

На этой вкладке вы сможете добавить заголовок и контент. Чтобы добавить новый предмет к аккордеону, необходимо нажать на кнопку « Добавить Добавить новый форма с названием и содержанием.

Легко создайте свой сайт с Elementor

Elementor позволяет легко создать любой дизайн сайта с профессиональным дизайном. Прекратите платить дорого за то, что вы можете сделать сами. [Free]

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

Цвета по умолчанию должны быть изменены, потому что цвет фона и текста очень похожи. Аккордеонный шрифт «И» Цвет фона по умолчанию .

После завершения настроек не забудьте сохранить свой аккордеон. На месте Аккордеоны >> Аккордеоны «(то есть первая страница плагина), где вы можете управлять различными аккордеонами.

Как добавить аккордеон в статью

На самом деле в статью можно добавить как можно больше аккордеонов. Вы должны каждый раз восстанавливать аккордеонный шорткод и добавлять их в статью или страницу.

Проверьте свою страницу, чтобы увидеть, как выглядит ваш новый аккордеон.

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

Откройте для себя также несколько премиальных плагинов WordPress

Вы можете использовать другие плагины WordPress, чтобы придать современный вид и оптимизировать управление вашим блогом или веб-сайтом.

Мы предлагаем вам несколько премиальных плагинов WordPress, которые помогут вам сделать это.

1. Система WP Pro Forum

Система WP Pro Forum — это плагин WordPress, который позволяет добавить красивый и удобный форум на ваш сайт. Он имеет множество мощных функций, которые позволяют создавать профессионально выглядящий форум.

Форум создан для работы в открытом интерфейсе веб-сайт, но администраторы могут управлять всеми форумами, темами, ответами, категориями и ярлыками из приборная панель.

Кроме того, система WP Pro Forum имеет определенные преимущества, такие как функциональный перевод благодаря включенным файлам mo / po, интеграция многих моделей в соответствии с внешним видом вашего веб-сайта или даже включенные настраиваемые фильтры.

2. Окончательный Pro членство

Ultimate Membership Pro — отличный плагин для подписки и ограничения контента. Он может управлять пользователями в соответствии с их пакетом (бесплатным или платным), создавая эксклюзивные уровни доступа.

Таким образом, можно будет защитить все содержимое вашего веб-сайта или только его часть. Это будет, например, курс, урок, страница, продукт, категория, изображение и т. Д.

Его основные функции, среди прочего: защита контента, множественные уровни доступа, поддержка множественных платежные шлюзы -PayPal, Authorize.net, Stripe, 2CheckOut, Bank Transfer-, частичная защита контента и многое другое .

3. Портфолио Cube

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

Благодаря шаблону инструмента создания в реальном времени вы можете контролировать все аспекты плагина: цвета, шрифты, размеры, интервалы, границы и т. Д.

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

Рекомендуемые ресурсы

Узнайте о других рекомендуемых ресурсах, которые помогут вам создать и управлять своим сайтом.

Заключение

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

Однако вы также сможете ознакомиться с нашими Ressources, если вам нужно больше элементов для реализации ваших проектов создания интернет-сайтов, обратитесь к нашему руководству по Создание блога на WordPress.

Если у вас есть предложения или замечания, оставьте их в нашем разделе Комментарии.

Источник

WordPress.org

Русский

WPB Accordion Menu or Category

Описание

Showing WordPress accordion menu or any WordPress category accordion with submenu/subcategory support. It has icon picker support both for menu and category. So you can setup icons in accordion easily. Enable disable auto-closing previously open accordion etc. Highly optimized for WooCommerce or any other eCommerce categories. Nice animation effects. Responsive and modern flat design.

Pro Version Video Documentation:

Plugin Features

• Category accordion.
• Custom taxonomy support.
• WooCommerce or any other eCommerce plugin compatible.
• Menu accordion.
• Multiple menu accordion support.
• Shortcode system can be used anywhere ( widget, page or post ).
• Two custom Elementor widgets for showing the menu and categories accordion in the Elementor page.
• Very lightweight.
• Work with all WordPress themes.
• Easy to use.
• Developer friendly & easy to customize.

Pro Version Features

• Widgets for showing any custom taxonomy (categories) or any custom menu.
• Feature to choose any menu or theme location from the menu widget.
• Five different predefined skins for accordion.
• Color customization option in settings.
• WooCommerce product categories and tags support.
• Auto open first level parent category or menu, settings available for enabling or disable.
• Feature for keep open selected menu items accordion.
• Feature for keep open current menu or category accordion.
• Custom icon picker both for menu & categories.
• FontAwesome and Themify icons included.
• Easy to use, lightweight and many more.

Different skins of accordion:

• Accordion Material Design
• Accordion Transparent
• Accordion Minimal
• Accordion Flat Design
• Accordion Dark

Tested with Following Themes

• Divi
• Storefront
• Betheme
• Enfold
• Flatsome
• Shopkeeper
• Avada
• Kallyas
• Salient
• The7
• Hestia
• Ocean WP
• Astra
• Hello Elementor

Скриншоты

• Category Accordion.
• Menu Accordion with Icons.
• Elementor widget for category accordion.
• Elementor widgets.
• Custom widget ( Pro version only ).

Установка

Install it as a regular WordPress plugin

Active the plugin.

Use any shortcode to show your menu or categories accordion.

Category shortcode example

Options:

taxonomy: Default category or any registered taxonomy.

orderby: Sort categories alphabetically, by unique Category ID, or by the count of posts in that Category. Valid values: ID, name, slug, count, term_group

order: Sort order for categories (either ascending or descending). The default is ascending. Valid values: ASC, DESC

show_count: Toggles the display of the current count of posts in each category. The default is false (do not show post counts). Valid values: no, yes

hide_empty: Toggles the display of categories with no posts. The default is yes (hide empty categories). Valid values: yes, no

icon: Accordion navigation icon ( optional ).

accordion: Close previously opened accordion item. The default is no. Valid values: yes, no.

Menu shortcode example

Options:

menu: The menu that is desired; accepts (matching in order) id, slug, name

theme_location: menu can be asign by theme location ( optional ).

icon: Accordion navigation icon ( optional ).

accordion: Close previously opened accordion item. The default is no. Valid values: yes, no.

Часто задаваемые вопросы

Is it compatible with the Elementor?

Yes, it is. We have two custom Elementor widgets for showing the menu and categories accordion in the Elementor page.

How can I change the background colors?

You need to change a little bit of CSS code for that. or You can get the pro version, which comes with settings for color and background change.

Источник

12 Лучших табов, виджетов аккордеона и плагинов для WordPress

Russian (Pусский) translation by Marat Amerov (you can also view the original English article)

Аккордеоны и табы — отличные способы передачи текстовой информации в элегантном и сжатом виде, при этом экономится ценное пространство на вашем WordPress-сайте и уменьшается информационная перегрузка.

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

Табы выполняют аналогичную аккордеонам функцию, но по-другому. Они стилизованы под традиционные табы, которые вставляются в файлы или картотеки. Подобно табам карт, плагины и виджеты для табов помечены и дают подсказку с информацией, которую они скрывают. Кликая на таб, пользователь может открыть дополнительную информацию о субъекте таба и использовать табы для навигации по сайту или странице.

Если вы ищете табы или виджеты и плагины аккордеона, вы можете найти то, что ищете на CodeCanyon. Чтобы сэкономить вам некоторое время, вот выбор из 12 лучших табов, виджетов и плагинов аккордеона доступных в Code Canyon.

1. Accordion Tables, FAQs, Columns, and More

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

• Возможность предварительного просмотра изменений вживую, когда вы их делаете
• автоматические обновления
• интеграция с Font Awesome Icons
• поставка с несколькими настраиваемыми пресетами
• и многое другое

Accordion Tables, FAQs, Columns, and More — отличный выбор для отображения вашего контента в стильных макетах аккордеона.

2. Accordion Slider — Responsive WordPress Plugin

Плагин Accordion Slider объединяет две большие функции в одном удобном плагине. Во-первых он функционирует как аккордеон, а во-вторых, он функционирует как слайдер.

• Добавьте столько панелей, сколько хотите, не беспокоясь о пространстве экрана
• touch-enabled хорошо работает с мобильными экранами
• загрузка изображений и контента из постов, галерей и Flickr
• Аккордеоны автоматически кэшируются, чтобы улучшить время загрузки
• могут быть размещены в любом месте, в постах/ страницах, шаблоне PHP-кода или виджетах
• и многое другое

Accordion Slider — Responsive WordPress Plugin — отличный вариант для одного плагина, который понравится тем, кто ищет отличный способ отобразить изображения или текст.

3. WP Responsive FAQ with Category

FAQ WP Responsive FAQ с плагином Category специально разработан для пользователей, которые имеют или хотят добавить область часто задаваемых вопросов на свой сайт, и не хотят, чтобы их посетители просматривали бесконечный поток текста, чтобы получить ответы на вопросы и ответы. относящихся к ним.

• FAQs могут быть организованы по категориям
• 15 настраиваемых различных вариантов дизайна на выбор
• совместимость с билдером страниц Visual Composer и WooCommerce
• два типа FAQ: значок стрелки или плюс
• и многое другое

Нет никаких сомнений в том, что WP Responsive FAQ with Category является решением для FAQ.

4. WooCommerce Category Accordion

WooCommerce Category Accordion разработан специально для пользователей WooCommerce. Его можно использовать в качестве виджета или шорткода для перечисления категорий продуктов и подкатегорий.

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

WooCommerce Category Accordion идеально подходит для пользователей, которые хотят организовывать свои продукты или услуги по категориям и подкатегориям, чтобы клиенты могли легко перемещаться по сайту.

5. Responsive Searchable 3 Level Accordion For WordPress

Responsive Searchable 3 Level Accordion For WordPress — это супер простой плагин, который можно использовать в любом месте вашего WordPress сайта . Это понравится пользователям, которые хотят упорядочить контент в стиле аккордеона в постах, боковой панели, футере и т. д.

• может использоваться как виджет или шорткод
• доступны три уровня вложенности
• пять вариантов стиля
• позволяет пользователям вводить искомую фразу
• и многое другое

Responsive Searchable 3 Level Accordion For WordPress — это плагин с отсутствием лишнего, и его отличные функции, такие как трехуровневая поддержка и поиск по контенту, действительно выделяют его.

6. StackTabs for WordPress

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

• упорядочивание и перемещение вкладок с помощью drag & drop билдера
• гибкая кастомизация
• интеграция со шрифтом Awesome Icons
• Доступны неограниченные цветовые комбинации
• и многое другое

Если вы не можете выбрать между табами и плагином аккордеона, почему бы и нет? StackTabs for WordPress дает вам именно это.

7. WordPress Tabs and Accordions DZS

WordPress Tabs and Accordions DZS — это еще один плагин, который дает пользователям доступ к функциям табов и аккордеона.

• полные скины, для соответствия каждому бренду
• WYSIWYG редактор
• неограниченное количество цветов для настройки
• оптимизация под iPhone, iPad и Android
• и многое другое

Так что если StackTabs не привлекает, WordPress Tabs and Accordions DZS — еще один отличный вариант два в одном.

8. Hello Tabs WordPress Widget

Hello Tabs позволяют создавать табы из любых виджетов или контента на вашем сайте. Используя простую функцию перетаскивания, плагин предлагает 12 предопределенных стилей и 24 анимационных эффекта.

• multi-tabs для создания нескольких элементов табов
• функция перетаскивания
• кросс-браузерная совместимость
• 23 анимационных эффекта
• и многое другое

Скажите «Hello» комплексным функциям табов с помощью Hello Tabs WordPress Widget.

9. WooCommerce Tabs Pro: Extra Tabs for Product Page

Если у вас есть сайт WooCommerce, плагин WooCommerce Tab Pro позволит вам создавать и управлять 11 различными типами табов для отображения ваших продуктов.

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

Когда у вас есть сайт электронной коммерции, внесение улучшений в ваш макет может действительно повысить продажи. С WooCommerce Tabs Pro: Extra Tabs for Product Page, скоро будут звонки.

10. Elegant Tabs for Visual Composer

Elegant Tabs for Visual Composer — это аддон для плагина WordPress Visual Composer. Он позволяет добавлять любой шорткод на несколько табов и предлагает множество настроек, таких как разные цвета, иконки и фоны для разных разделов или табов.

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

11. Social Network Tabs For WordPress

Social Network Tabs for WordPress — это другой подход к табам из тех, которые были представлены до сих пор. Этот плагин специально разработан, чтобы продемонстрировать все профили и фиды социальных сетей на слайдовых или статических табах, которые расположены вокруг краев окна вашего веб-сайта.

• 16 социальных сетей с 69 вариантами фидов
• гибкое позиционирование
• посты включают в себя ссылки Twitter, Facebook, Google + и LinkedIn
• легкая стилизация табов с помощью колорпикера
• и многое другое

Нужно больше фолловеров? Social Network Tabs For WordPress поможет вам стать суперзвездой в социальных сетях.

12. PullOut Widgets for WordPress

Подобно Social Network Tabs for WordPress, PullOut Widgets — это другой подход к табам. Он специально предназначен для превращения любого виджета на вашем сайте в выносные табы.

• 289 иконок для выносных табов
• 32 эффекта анимации скольжения
• неограниченное размещение виджета в верхней, правой, нижней или левой стороне
• неограниченные цвета виджета
• и многое другое

Самые успешные веб-сайты являются интерактивными, а PullOut Widgets for WordPress дает вашим посетителям множество возможностей для взаимодействия с вашим контентом.

Заключение

12 Best Tab & Accordion WordPress Widgets Envato Market & Plugins — это всего лишь несколько продуктов, доступных на Envato Market. Если вы не нашли то, что ищете, у нас есть много других отличных вариантов, которые бы соответствовали вашим потребностям. Поэтому попробуйте выбрать виджеты и плагины табов и аккордеонов.

И если вы хотите улучшить свои навыки WordPress, ознакомьтесь с нашими полезными и бесплатными учебниками WordPress.

Источник