Tabbed FAQ
Tabbed FAQ creates a structured FAQ system using a custom post type and category taxonomy, rendered via a shortcode. It is framework-agnostic (no Elementor or page builder required) and designed for large FAQ sets, SEO safety, and easy customization.
Features include: * Custom Post Type for FAQs * Custom taxonomy for FAQ categories * Horizontal, scrollable category tabs with arrow controls * Accordion-style questions and answers * FAQPage JSON-LD schema output * CSV importer for bulk creation and updates * Shortcode-based rendering
Data Structure
Custom Post Type: Post Type: tabbed_faq Supports: Title, Editor, Menu Order, Revisions
Each FAQ: * Title = Question * Content = Answer
Taxonomy: Taxonomy: tabbed_faq_category Used to generate the category tabs
Usage
Use the shortcode:
[tabbed_faq]
The shortcode can be placed in: * Pages * Posts * Shortcode blocks * PHP templates using do_shortcode()
Shortcode Attributes
show_all_tab (default: 1) Show an “All” tab at the beginning.
all_tab_label (default: All) Label for the “All” tab.
default_category (default: all) Category slug to load first.
posts_per_page (default: 300) Maximum FAQs per category.
orderby (default: menu_order) Sorting field.
order (default: ASC) Sort direction.
include_categories (default: empty) Comma-separated category slugs to include.
exclude_categories (default: empty) Comma-separated category slugs to exclude.
schema_mode (default: all) Controls schema output. Possible values: * all – include all FAQs on the page (recommended) * active – include only the default category
Examples:
[tabbed_faq]
[tabbed_faq default_category=”vehicle-care”]
[tabbed_faq include_categories=”technical,services”]
[tabbed_faq schema_mode=”active”]
FAQ Schema Behavior
By default (schema_mode=”all”):
- Outputs a single FAQPage JSON-LD block
- Includes all FAQs rendered on the page
- Merges schema from multiple shortcodes into one block
When using schema_mode=”active”:
- Only FAQs from the default category are included in schema
Schema output: * Is generated from actual FAQ content * Is printed once per page in the document head * Is safe for SEO and Google FAQ guidelines
CSV Importer
Accessible via: FAQs → Import FAQs
CSV requirements: * Header row required * UTF-8 encoded CSV
Supported columns:
category (required) Category name or slug
question (required) FAQ question
answer (required) FAQ answer (HTML allowed)
id (optional) Existing FAQ post ID to update
slug (optional) Post slug to match/update
Update modes: * Prefer ID, then Slug (default) * Slug only * Always create new
If no match is found, a new FAQ is created automatically.
Styling
Default styles are located at: assets/css/tabbed-faq.css
Key CSS selectors: .tabbed-faq .tabbed-faq__tabs .tabbed-faq__tab .tabbed-faq__accordion .tabbed-faq__item .tabbed-faq__toggle .tabbed-faq__answer
Styles may be overridden in the theme or by dequeuing the stylesheet.
JavaScript
JavaScript file: assets/js/tabbed-faq.js
Handles: * Tab switching * Horizontal tab scrolling * Accordion open/close behavior * ARIA attribute updates
No external dependencies.
Accessibility
- Tabs use proper tablist and tab roles
- Accordion buttons use aria-expanded and aria-controls
- Only one accordion item is open per category at a time
Performance
- Uses get_posts() for data retrieval
- No AJAX requests
- Schema generated once per page
- Suitable for large FAQ sets
Uninstall
Deactivating the plugin: * Removes frontend output * Does not delete FAQ posts or categories
Manual cleanup requires deleting tabbed_faq posts and taxonomy terms.
