# Two-Click Loading for Spotify, SoundCloud and Other Embeds

> Replaces iframes from third-party services in your posts with a notice and a "Load" button, with an option to always allow that service on the visitor's device.

- Type: PHP
- Runs: Frontend only
- Category: [Privacy & Cookies](https://wpide.com/library/category/privacy/)
- Tags: embeds, gdpr, iframes
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/privacy-two-click-iframes/

## Code

```php
// Host fragment => service name shown to the visitor.
$wpide_two_click_hosts = array(
    'open.spotify.com'    => 'Spotify',
    'w.soundcloud.com'    => 'SoundCloud',
    'dailymotion.com'     => 'Dailymotion',
    'player.twitch.tv'    => 'Twitch',
    'calendar.google.com' => 'Google Calendar',
    'docs.google.com'     => 'Google Docs',
    'typeform.com'        => 'Typeform',
    'bandcamp.com'        => 'Bandcamp',
);

add_filter( 'the_content', function ( $content ) use ( $wpide_two_click_hosts ) {
    if ( false === stripos( $content, '<iframe' ) ) {
        return $content;
    }

    return preg_replace_callback( '#<iframe\b[^>]*\bsrc=["\']([^"\']+)["\'][^>]*>\s*</iframe>#is', function ( $m ) use ( $wpide_two_click_hosts ) {
        foreach ( $wpide_two_click_hosts as $host => $name ) {
            if ( false === stripos( $m[1], $host ) ) {
                continue;
            }

            $key = sanitize_key( $name );

            return sprintf(
                '<div class="wpide-2click" data-service="%1$s"><template>%2$s</template><div class="wpide-2click-note" style="padding:16px;border:1px solid #c3c4c7;background:#f6f7f7;"><p style="margin:0 0 8px">%3$s</p><button type="button" class="wpide-2click-load">%4$s</button> <label style="margin-left:8px"><input type="checkbox" class="wpide-2click-always"> %5$s</label></div></div>',
                esc_attr( $key ),
                $m[0],
                esc_html( sprintf( 'This content is hosted by %s. Loading it sends data such as your IP address to %s.', $name, $name ) ),
                esc_html( 'Load ' . $name ),
                esc_html( 'Always allow ' . $name )
            );
        }

        return $m[0];
    }, $content );
}, 20 );

add_action( 'wp_footer', function () {
    ?>
<script>
(function () {
    var key = 'wpideAllowed';
    function allowed() { try { return JSON.parse(localStorage.getItem(key) || '[]'); } catch (e) { return []; } }
    function show(box) { var t = box.querySelector('template'); if (t) { box.replaceChildren(t.content.cloneNode(true)); } }
    var list = allowed();
    document.querySelectorAll('.wpide-2click').forEach(function (box) {
        if (list.indexOf(box.getAttribute('data-service')) !== -1) { show(box); }
    });
    document.addEventListener('click', function (e) {
        var btn = e.target.closest ? e.target.closest('.wpide-2click-load') : null;
        if (!btn) { return; }
        var box = btn.closest('.wpide-2click');
        var service = box.getAttribute('data-service');
        if (box.querySelector('.wpide-2click-always').checked) {
            var l = allowed();
            if (l.indexOf(service) === -1) { l.push(service); }
            try { localStorage.setItem(key, JSON.stringify(l)); } catch (err) {}
            document.querySelectorAll('.wpide-2click[data-service="' + service + '"]').forEach(show);
        } else {
            show(box);
        }
    });
})();
</script>
    <?php
} );
```

## Notes

YouTube, Vimeo and Google Maps have their own click-to-load snippets; add other services to $wpide_two_click_hosts.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Two-Click Loading for Spotify, SoundCloud and Other Embeds" 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/