Creating a Basic WordPress FAQ Plugin

Creating a Frequently Asked Questions (FAQs) section on your website is a great way to provide your customers with the answers they need. While it’s becoming increasingly popular, FAQs are often integrated into premium themes, leaving those using free themes out of luck. In this tutorial, we’ll show you how to create a simple FAQ plugin that will work with any WordPress theme. We’ll cover only the basic steps so that you can customize the FAQ section and make it your own.

Step 1: Create The Plugin

To begin, create a new folder in your “wp-content/plugins” folder called “rc-faq”. Then create a new file within this folder called “rc-faq.php” and place the following code:

“`

/*

Plugin Name: RC Faq

Plugin URL: http://remicorson.com/rc-faq

Description: A simple FAQ plugin

Version: 1.0

Author: Remi Corson

Author URI: http://remicorson.com

Contributors: corsonr

*/

“`

Step 2: Register The FAQ Custom Post Type

Next, we need to register a custom post type. If you’re not familiar with this part, you can refer to the Codex. Use the following code:

“`

/*

* Register CPT rc_faq

*

*/

function rc_faq_setup_post_types() {

$faq_labels = apply_filters( ‘rc_faq_labels’, array(

‘name’ => ‘FAQs’,

‘singular_name’ => ‘FAQ’,

‘add_new’ => __(‘Add New’, ‘rc_faq’),

‘add_new_item’ => __(‘Add New FAQ’, ‘rc_faq’),

‘edit_item’ => __(‘Edit FAQ’, ‘rc_faq’),

‘new_item’ => __(‘New FAQ’, ‘rc_faq’),

‘all_items’ => __(‘All FAQs’, ‘rc_faq’),

‘view_item’ => __(‘View FAQ’, ‘rc_faq’),

‘search_items’ => __(‘Search FAQs’, ‘rc_faq’),

‘not_found’ => __(‘No FAQs found’, ‘rc_faq’),

‘not_found_in_trash’ => __(‘No FAQs found in Trash’, ‘rc_faq’),

‘parent_item_colon’ => ”,

‘menu_name’ => __(‘FAQs’, ‘rc_faq’),

‘exclude_from_search’ => true

) );

$faq_args = array(

‘labels’ => $faq_labels,

‘public’ => true,

‘publicly_queryable’ => true,

‘show_ui’ => true,

‘show_in_menu’ => true,

‘query_var’ => true,

‘capability_type’ => ‘post’,

‘has_archive’ => false,

‘hierarchical’ => false,

‘supports’ => apply_filters(‘rc_faq_supports’, array( ‘title’, ‘editor’ ) ),

);

register_post_type( ‘rc_faq’, apply_filters( ‘rc_faq_post_type_args’, $faq_args ) );

}

add_action(‘init’, ‘rc_faq_setup_post_types’);

“`

Note the use of the `apply_filters()` function, which allows you to modify support and arguments without modifying the plugin itself.

Step 3: Create A Shortcode To Display FAQs

This is where we create a simple shortcode with only one parameter that will show the FAQs to your visitors. The idea is to list only the FAQ titles and display answers only when the title is clicked. The shortcode will have a unique “limit” parameter that defines the number of items to show. You can add your own attributes such as order, order by, etc. The shortcode contains a JavaScript snippet included directly within the shortcode itself so that the JavaScript only loads when you are on the page having the shortcode. Finally, we hide the FAQ content by default and display it only when its title is clicked. Use the following code:

“`

/*

* Add [rc_faq limit=”-1″] shortcode

*

*/

function rc_faq_shortcode( $atts, $content = null ) {

extract(shortcode_atts(array(

“limit” => ”

), $atts ) );

// Define limit

if ( $limit ) {

$posts_per_page = $limit;

} else {

$posts_per_page = ‘-1’;

}

ob_start();

// Create the Query

$post_type = ‘rc_faq’;

$orderby = ‘menu_order’;

$order = ‘ASC’;

$query = new WP_Query( array (

‘post_type’ => $post_type,

‘posts_per_page’ => $posts_per_page,

‘orderby’ => $orderby,

‘order’ => $order,

‘no_found_rows’ => 1

) );

//Get post type count

$post_count = $query->post_count;

$i = 1;

// Displays FAQ info

if ( $post_count > 0) :

// Loop

while ($query->have_posts()) : $query->the_post(); ?>

” style=”display: none;”>

$i++;

endwhile;

endif;

// Reset query to prevent conflicts

wp_reset_query(); ?>

return ob_get_clean();

}

add_shortcode( “rc_faq”, “rc_faq_shortcode” );

“`

And that’s it! Here’s the final result in the administration:

![FAQ Plugin Administration](https://i.imgur.com/5e2OQzL.png)

And on the visitors’ side:

![FAQ Plugin Visitors](https://i.imgur.com/9Z9vXZT.png)

It’s simple, but it works, and you can customize it as you want! We hope you enjoyed this tutorial. We’d love to get your feedback in the comments section!

Stay in Touch

spot_img

Related Articles