# Collapsible Transcript Shortcode for Audio and Video

> Adds a [transcript] shortcode that wraps the text version of a podcast or video in an accessible show/hide section, so every recording can have a transcript without cluttering the page.

- Type: PHP
- Runs: Frontend only
- Category: [Accessibility](https://wpide.com/library/category/accessibility/)
- Tags: transcripts, shortcode, media
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/a11y-transcript-shortcode/

## Code

```php
add_shortcode( 'transcript', function ( $atts, $content = '' ) {
    $atts = shortcode_atts( array( 'title' => 'Transcript', 'open' => 'no' ), $atts, 'transcript' );

    if ( '' === trim( (string) $content ) ) {
        return '';
    }

    return sprintf(
        '<details class="wpide-transcript"%1$s style="margin:1em 0;padding:.75em 1em;border:1px solid #c3c4c7;border-radius:6px;"><summary style="cursor:pointer;font-weight:600;">%2$s</summary><div class="wpide-transcript-text" style="margin-top:.75em;">%3$s</div></details>',
        'yes' === $atts['open'] ? ' open' : '',
        esc_html( $atts['title'] ),
        wpautop( do_shortcode( wp_kses_post( $content ) ) )
    );
} );
```

## Notes

Use [transcript title="Read the interview transcript"]...[/transcript]; the section uses the native details element, so it works with keyboards and screen readers.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Collapsible Transcript Shortcode for Audio and Video" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/