How to Add a WordPress Accordion Plugin and Why You Should

Have you been thinking of different and unique ways to display content on your website? While there are a lot of different ways to do this, having a WordPress accordion plugin will give you a fun and fresh way to present certain types of media.

What is a WordPress Accordion Plugin?

An accordion plugin gives you the ability to present content inside collapsible tabs. It is perfect for fitting more content than usual on a post or page. It’s also very useful when it comes to creating an FAQ section of a website.

As a matter of fact, some of these are specifically designed to be accordion FAQ WordPress plugins. However, over time, they grew into more than just answering questions. Now, you see the accordion style used for all types of content on a WordPress site.

Why Add Accordions to Your Site?

The main reason was stated above. Accordions give you the ability to showcase content in a different and unique way. However, they also allow you to display a lot more content than usual on WordPress posts and pages.

If you want to shrink the size of your web page, but add a lot of content anyway, then a WordPress accordion plugin can help. This is done by adding content in horizontal or vertical columns that act as clickable tabs which open and close for your website user.

They are still the most popular way to show an FAQ page on a website. That being said, there is no limit to the type of media you can add to them to display on your site.

You can even put content on a post or page in a WordPress accordion slider format. Adding an accordion to any solid WordPress theme is always ideal.

Let’s take a look at how to add a WordPress accordion plugin to your website and then take a look at a few other good accordion plugins you can choose from.

Add the Accordion Plugin

In order to add a WordPress accordion plugin to your website, you have to choose a good one. There are several available, but for this demonstration, we are going to use a very popular tool that is simply called “Accordion.”

Wordpress accordion plugin

The Accordion plugin gives you a fast and easy way to create any type of accordion imaginable including:

  • FAQ
  • Tabs
  • Tab Content
  • Knowledge Base
  • Question & Answer Section

Furthermore, the plugin is compatible with WooCommerce, very easy to customize, and is totally mobile friendly and responsive. It comes complete with the ability to change colors, font size, and icons.

You simply build each accordion how you want and then use the shortcode generated to display it on posts, pages, and widget areas of your website.

Install and Activate WordPress Accordion Plugin

First, install and activate the Accordion plugin on your site. You can do this by going to the plugin repository page in the admin area of your WordPress dashboard.

INstall and activate accordion

Once the plugin has been installed and activated, click on Accordions > Settings and have a quick look at the setting’s page.

WordPress accordion plugin settings

It is pretty straightforward. Basically, you can pick your Font Awesome version, and then export or import json files if needed. That is the extent of it.

Building an Accordion

To build your first accordion, click on Accordions > New Accordions. This is where you will set up and build any accordions moving forward.

Accordions new accordions

Once on the “New Accordion” page, you will see a few things.

First, give your accordion a title so you can easily reference it moving forward. Below that you will see 5 different tabs. You will use these tabs to build and create from the WordPress accordion plugin. These tabs include:

  • Shortcode
  • Options
  • Style
  • Content
  • Custom Script

Go through these options and use them to build the accordion you want.

Note: If you scroll down to the bottom of this page, you will see that as you develop the accordion, you can see a preview of it in real-time. You can also click on the tabs and see how it will look on different devices.

This is located under “Preview.”

Accordion preview box

Accordion Plugin Options

Shortcode

Click on the Shortcode tab and you will see all the available shortcodes.

Accordion shortcodes

Options

Now, click on the “Options” tab and start filling out all of the accordion settings the way you would like them.

Accordion plugin options

Style

Next, click on the “Style” tab and fill out the settings of how you would like them to display on your site.

Wordpress accordion style tab

Content

Click on the “Content” tab. This is where you are actually going to add all the content you want displaying in this particular accordion. Just click on the “Add” button and a mini WordPress editor will pop out. This lets you add any type of content you want.

Fill in accordion content

Repeat this process for as many different tabs as you would like.

Custom Scripts

Finally, click on the “Custom Scripts’ tab. In this section, you can add custom CSS and json if you choose.

Enter custom scripts

Once the item is built and showing how you want, click on the “Publish” button and the accordion will be published. Simply take the shortcode that is generated for that particular accordion and place it on a post, page, or widget area where you want it to display.

That’s it! Repeat the process above and build as many different types of accordions as you want for your website.

Other WordPress Accordion Plugin Options

I chose to use the Accordion plugin for this demonstration because it offers a ton of functionality and is very easy to use. However, there are several good WordPress accordion plugins available if you would like to try out something different. Here are three other solid ones to check out.

Accordion FAQ

Wordpress accordion faq plugin

The Accordion FAQ plugin is a sold, mobile-ready and responsive WordPress accordion plugin that you can use to build and add unlimited collapsable elements for your website. Some of the main features include:

  • Responsive Design
  • Limitless accordion anywhere in the theme
  • Drag and drop builder API integrated.
  • Drag and drop accordion items for easy sorting
  • Use via short-codes
  • Awesome input field for content
  • Unlimited color options

Tabs – Responsive Tabs With Accordions

Tabs accordion plugin

Tabs is a WordPress content tabs plugin with a lot of great features. It is a fully responsive tabs builder plugin with a Visual Composer extension. So if you are using Visual Composer on your website, this is a great plugin to install as well. Some of the main features include:

  • Fully Live Design
  • Custom Interface
  • Multiple Style and Layouts
  • Mobile Editing
  • SEO Friendly
  • Ecommerce Compatible
  • Custom CSS Available

Easy Accordion

Easy accordion wordpress plugin

Easy Accordion is a responsive, drag and drop WordPress accordion plugin that comes ready to roll with a lot of customization options. You can quickly and easily implement different accordion styles into your website without having to write any code. Some of the main features include:

  • Responsive & mobile-ready.
  • Lightweight, fast and robust.
  • Clean and intuitive admin panel.
  • Multiple accordions. (Create unlimited accordions into the same page)
  • WP Classic Editor(WYSIWYG) for content.
  • Multiple accordions collapsible or toggle. (Open together)
  • Drag & drop accordion sorting.
  • Add & remove accordion item from the backend.

Final Thoughts

There are several amazing WordPress accordion plugins to choose from out there. The one you choose will be based on personal preference and ease of use. Try any one of these and see which one you like best. You can add stylish content to your site in a different way and present your audience with a fun and unique way to read your post and page content.

Have you tried any of the WordPress accordion plugins listed above? If so, which one was your favorite and why?

Author: Jeremy Holcombe

Growing up in Hawaii, Jeremy started his freelance writing career doing resumes, business plans, article writing, and everything in between. He now specializes in online marketing and content writing and is part of the Content Marketing Team at GreenGeeks.

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.