FAQ Shortcode

Updated on February 19, 2018

The frequently asked questions or FAQ shortcode makes it easy to list questions and answers that are commonly asked.

In this article we’ll explain how to create and display FAQ posts, and configure their settings.

To see the FAQ shortcode in action, check out the demo page.

FAQ shortcode - demo


Creating FAQ Posts

Before displaying the FAQs, some posts should be created to be used in the FAQ shortcode.

To create a FAQ post:

1From the WordPress left menu, go to Faqs > Add New.

FAQ shortcode - add new post

2Enter a title, fill out the necessary information and click on Publish.

Categorizing the Items

Categorization provides an easy way to organize the items and gives you lots of flexibility when you need to show only specific items. Configuring categories for the FAQ items follows the WordPress convention.


Displaying the FAQs

To add the FAQ shortcode to a page:

1Add or edit an existing page.
2In the Visual Composer section, click on the + button.

FAQ shortcode - visual composer section

3In the Add Element pop-up screen, search for FAQ and click on it to be added to the page.

FAQ shortcode - add element

4When the shortcode is added, a new pop-up screen called FAQ Settings will open that allows you to configure the shortcode settings.

FAQ shortcode - faq settings

5Configure the settings as required.
SettingDescription

Style Displays the FAQs in a fancy or simple style.
[All] Link Title Changes the all link title.
Sortable? Displays the sortable filter navigation.
Count Sets a custom amount of FAQ items to be displayed.
Pane Content Background Color Sets the background color for the FAQ content.
6Click on Save Changes and publish or update the page to check the result. It will show all the available FAQ items.

Showing Specific Items

There are two settings in the FAQ settings pop-up that allow you to show the items based on specific categories or IDs: Select Specific Categories and Select Specific Posts.

SettingDescription

Select Specific Categories Shows items only from the specified categories.
Select Specific Posts Shows only the specified items.

Altering the Items Sorting

There are two settings in the FAQ settings pop-up that allow you to alter the items’ sorting: Order and Orderby

By default, the order and orderby settings are set to Ascending and Date therefore it sorts the older items ahead of the newer items.

SettingDescription

Order Sets the ascending or descending order of the Orderby parameter.
Orderby Sorts the items based on the selected parameter (date, menu order, title, …).

Configuring the Visibility for Devices

To make the FAQ shortcode visible/hidden on different devices, there is a setting in the FAQ settings pop-up called Visibility for Devices. Using this setting is easy and straightforward but if you need a step-by-step tutorial, read the Configuring the visibility for Devices article.

Adding an Extra Class Name

The Extra Class Name field in the settings pop-up allows you to add an extra class name to the shortcode. It’s useful when you need to target the shortcode in a style sheet or JavaScript file.

You can read the Adding custom CSS class to a shortcode article for further explanation.

Did this answer your question?