WP Manifestindependent plugin directory
manifest / editor / custom-toggle-panels-pro

Custom Toggle Panels Pro

WordPress plugin for toggle/accordion panels with RankMath Pro FAQ schema integration

by Danny Breckenridge · github.com/dbreck/custom-toggle-panels-pro · website

★ 0stars
0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/dbreck/custom-toggle-panels-pro/archive/refs/heads/main.zip
Readme github.com/dbreck/custom-toggle-panels-pro ↗

A WordPress plugin that creates beautiful, animated toggle/accordion panels with automatic SEO-optimized FAQ schema generation via RankMath Pro integration.

Features

  • Toggle Panel Sets: Create reusable collections of Q&A content via custom post type
  • Flexible Shortcode: Embed panels anywhere with [custom_toggle id="123"] or [custom_toggle set="slug"]
  • Smooth Animations: GSAP-powered expand/collapse with theme compatibility
  • Customizable Styling: Color picker for theme customization per panel set
  • Accordion Mode: Optional mode where opening one panel closes others
  • RankMath Pro Integration: Automatic FAQPage schema generation for rich snippets in search results
  • Auto-Maintenance: Keep schemas synced with content changes automatically
  • Bulk Operations: Generate schemas for all toggle sets at once

Requirements

  • WordPress 5.0 or higher
  • PHP 7.0 or higher
  • RankMath Pro (for schema generation features)

Installation

  1. Download the plugin or clone this repository
  2. Upload to /wp-content/plugins/custom-toggle-panels-pro/ directory
  3. Activate the plugin through the 'Plugins' menu in WordPress
  4. Install and activate RankMath Pro for schema features

Quick Start

Creating Toggle Panels

  1. Go to Toggle Panel Sets → Add New
  2. Add your Q&A pairs in the Toggle Panel Items meta box
  3. Customize appearance in Toggle Panel Settings (color, accordion mode)
  4. Publish and copy the shortcode
  5. Paste shortcode into any page or post

Generating FAQ Schema

  1. From the Toggle Set editor, find the FAQ Schema Template meta box
  2. Click Generate Schema Template
  3. Go to Rank Math → Schema Templates to configure display conditions
  4. Your FAQs are now SEO-optimized for rich snippets!

Documentation

Usage Examples

Basic Toggle Panel

[custom_toggle id="123"]

Toggle Panel by Slug

[custom_toggle set="product-faq"]

Key Features Explained

Automatic Schema Sync

When Auto-Maintain Schemas is enabled:

  • Schemas automatically update when you edit toggle content
  • Changes detected via content hashing (efficient)
  • Display conditions preserved during updates

Text Processing

The plugin intelligently processes your content:

  • Strips "Q:" prefixes from questions
  • Strips "A:" prefixes from answers
  • Preserves HTML formatting in answers
  • Sanitizes for schema compliance

GSAP Animation System

  • Smooth height animations with automatic calculation
  • Conflict detection prevents double-loading
  • Theme compatibility ensured
  • Only loads when shortcode is present (performance optimized)

Architecture Highlights

  • Custom Post Type: toggle_panel_set stores Q&A collections
  • Meta-based Storage: Serialized arrays for flexible data structures
  • Singleton Pattern: Efficient RankMath integration classes
  • Bidirectional Linking: Toggle sets ↔ Schema templates
  • AJAX Operations: Real-time schema management without page reloads

Development

No build system required - traditional PHP plugin with direct file editing.

See CLAUDE.md for detailed development guidance including:

  • Core architecture and data flow
  • Key technical patterns
  • Code conventions and security practices
  • How components interact

Security

  • Nonce verification on all AJAX endpoints
  • Capability checks (manage_options)
  • Content sanitization (wp_kses_post, sanitize_text_field)
  • Direct file access prevention

Browser Compatibility

  • Modern browsers (Chrome, Firefox, Safari, Edge)
  • GSAP 3.12.2 for animations
  • jQuery (WordPress core)

Testing

See TESTING-GUIDE.md for comprehensive manual testing procedures covering:

  • Basic functionality
  • RankMath integration
  • Edge cases and error handling
  • Performance testing

Support & Resources

Schema Documentation

Testing Tools

Changelog

Version 1.0.0 (2025-11-07)

  • Initial release
  • Custom toggle panels with shortcode support
  • GSAP animations with theme compatibility
  • RankMath Pro FAQ schema integration
  • Auto-maintenance and bulk operations
  • Comprehensive admin interface
  • Text processing pipeline (Q:/A: prefix removal)
  • HTML preservation in answers

License

[Add your license here]

Author

Danny Breckenridge

Built for better SEO and enhanced user experience