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.
Creating FAQ Posts
Before displaying the FAQs, some posts should be created to be used in the FAQ shortcode.
To create a FAQ post:
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:
| Setting | Description |
|---|---|
| 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. |
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.
| Setting | Description |
|---|---|
| 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.
| Setting | Description |
|---|---|
| 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.
