# Announce Links That Open in a New Tab

> Adds hidden "(opens in a new tab)" text and a small icon to links in post content that open a new window, so screen reader and keyboard users are not surprised.

- Type: PHP
- Runs: Frontend only
- Category: [Accessibility](https://wpide.com/library/category/accessibility/)
- Tags: links, new-tab, screen-reader
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/a11y-new-window-link-warning/

## Code

```php
add_filter( 'the_content', function ( $content ) {
    if ( false === stripos( $content, '_blank' ) || ! class_exists( 'WP_HTML_Tag_Processor' ) ) {
        return $content;
    }

    // Mark links first, then add the hidden text right before each closing </a>.
    $tags = new WP_HTML_Tag_Processor( $content );

    while ( $tags->next_tag( 'a' ) ) {
        if ( '_blank' === $tags->get_attribute( 'target' ) ) {
            $tags->add_class( 'wpide-new-tab' );
        }
    }

    $content = $tags->get_updated_html();

    return preg_replace_callback( '#(<a\b[^>]*class="[^"]*\bwpide-new-tab\b[^"]*"[^>]*>)(.*?)(</a>)#is', function ( $m ) {
        if ( false !== stripos( $m[2], 'opens in a new' ) ) {
            return $m[0];
        }

        return $m[1] . $m[2] . '<span class="screen-reader-text"> (opens in a new tab)</span>' . $m[3];
    }, $content );
}, 20 );

add_action( 'wp_head', function () {
    echo '<style>.wpide-new-tab::after{content:"\2197";display:inline-block;margin-left:.2em;font-size:.8em;text-decoration:none;}</style>' . "\n";
} );
```

## Notes

The hidden text uses the screen-reader-text class most themes provide; the icon can be removed by deleting the ::after rule.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Announce Links That Open in a New Tab" 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/
