Skip to content
Knowledge Base

Add/Edit/Delete Accordions in WordPress

Learn how to add, edit, and delete accordions in WordPress for FAQ pages and collapsible content.

Add/Edit/Delete Accordions in WordPress

An Accordion is collapsible a list that works great for Frequently Asked Question pages and more. While it is easy to add and remove Accordions with Widgetkit, setting up Accordions on the page requires a little more work. Follow these instructions closely. Don't forget, you can call Techno Goober for help at (302) 645-7177 or email us for help.

Quick Access:

Open Widgetkit

To begin, log into WordPress, your content management system.

Step 1: Click the Widgetkit link in the left sidebar within the content management system. Hint: It's at the very bottom.

widgetkit

Edit Existing Accordion

Step 1: Navigate to Widgetkit and select Accordion. It should be open by default.

Step 2: Click on the name of the accordion that you want to edit.

accordion name

Step 3: Edit the contents of the accordion by changing the title or content of each accordion item. Read more about editing text, headings, and links.

accordion test

Step 4: You can remove items by clicking the minus symbol next to the item.

accordion remove item

Step 5: You can add new accordions by clicking Add New Item at the bottom. If you are finished, click Save Changes.

accordion add or save

Step 6: Go to the front-end of the website to check out your work. To do this, you can right-click on the name of your website in the top left corner and select Open in a new tab.

open in new tab

Help! I Don't See My Changes!

Add New Accordion

Step 1: Navigate to Widgetkit and select Accordion. It should be open by default.

Step 2: Click Add New.

accordion name

Step 3: Enter a title for your Gallery. Make it memorable or descriptive. It needs to be easy to understand what it is in the future.

accordion add name

Step 4: Enter a title and description for at least one Accordion Item. Read more about editing text, headings, and links.

accordion test

Step 5: Adjust Settings. You can set the Accordion to be completely collapsed by selecting Auto Collapse and Start Index -1.

set auto collapse and start index at -1

Step 6: You can quickly re-order your Accordion Items by dragging and dropping too.

accordion reorder

Step 7: Add additional Accordion Items if you want by click Add New Item. When you are finished, click Save Changes.

accordion add or save

Display new Accordion on Page

Step 1: Navigate to Widgetkit, then select Accordion. It should be open by default.

Step 2: Next to the name of the Accordion is the Shortcode. Highlight and copy the Shortcode. For example, widgetkit id=3856. Don't forget the brackets, you'll need those for the code to display properly.

widgetkit shortcode

Step 3: Navigate to the page you would like to add the Accordion to from the Page Manager. Click the title of the page to open it.

Step 4: Within the Editor, paste or type the shortcode that was associated with the Accordion. For example, widgetkit id=3856 *including brackets

accordion shortcode

Step 5: Save Changes to the edited page by clicking Update.

update page

Step 6: Confirm the Accordion is displaying correctly. Go to the front-end of the website to check out your work. To do this, you can right-click on the name of your website in the top left corner and select Open in a new tab.

open in new tab

Step 7: Confirm the Accordion is displaying correctly.

accordion on page

Help! I Don't See My Changes!

Delete Accordion

Step 1: Navigate to Widgetkit and select Accordion. It should be open by default.

Step 2: Click the Delete button next to the Title of the Accordion you want to delete.

widgetkit delete

Let’s build something

Ready to grow? Give us a call.

A friendly team building websites, marketing, and tech support that actually move the needle — for businesses across the country. We don’t bite — promise.