UI & UX

Expandable FAQ

Implements accessible expandable FAQ interfaces with deep-linkable open states and FAQ structured data.

What it does

Implements accessible expandable FAQ interfaces with deep-linkable open states and FAQ structured data.

When to use it

Use for FAQ accordions, help disclosures, or fixing keyboard, heading and search-discoverability bugs.

Problems it prevents

Stops FAQ content that's invisible to search engines because it's hidden behind JavaScript with no fallback.

Typical workflow

  1. Structure content with real headings
  2. Implement accessible disclosure behaviour
  3. Support deep links to open answers
  4. Add FAQPage structured data

Example output

An accordion that's keyboard-operable, deep-linkable to a specific answer, and marked up with real FAQ structured data.

What's included

  1. 01
    The complete prompt

    The full manual as a ready-to-save SKILL.md file, matched exactly to what ships in the T7 library.

  2. 02
    Install walkthrough

    Personal (~/.claude/skills/) and project (.claude/skills/) folder instructions, whichever fits how you work.

  3. 03
    Use notes

    How Claude invokes it, what a good result looks like, and what to check before you trust the output.

Installation

Save the manual as SKILL.md in ~/.claude/skills/expandable-faq/ to use it on every project, or in .claude/skills/expandable-faq/ to scope it to one repository. Then invoke it directly:

/expandable-faq

Read the official Claude Code skills guide

Works well with