WP.com protected iFrames.

[mattheu]

WP.com/VIP provides a neat solution for embedding content from untrusted sources using their embed button. Basically it allows you to dump any old embed code - whatever it may be, from wherever. This is then rendered inside an iFrame to sandbox it from the rest of your site.

This is pretty much what Facebook are doing with all our embeds :smile:

The protected-iframe shortcode outputs a bunch of code - script, form and iframe, that is definitely not allowed by FB Instant Articles and gets stripped.

However we can workaround by just wrapping in their social embed syntax: <figure class="op-social"><iframe>// Code </iframe></figure>

We have come up with a solution for this, but I'm hesitant as to whether to include our fix for this in the core plugin. Its something anyone on VIP will run into though. Its also a bit of a hack and definitely not PHP 5.2 compatible! I'm going to outline the problem below. However, my solution is fairly generic, and could possibly by used by other shortcodes too, adding support without having to specify a custom callback.

Would be interested in your thoughts?

[mattheu]

My code is something like this - I'll open a PR if you think its worth including.

/**
 * Wrap shortcode output in figure op-social + iframe markup to sandbox functionality.
 *
 * Used to handle generic shortcodes that we can't really mess with.
 * Note you will need to manually add any scripts using the filter provided.
 *
 * @param  string $shortcode_tag Shortcode.
 * @return void
 */
function sandbox_shortcodes() {

    global $shortcode_tags;

    /**
     * Get array of shortcode tags to sandbox.
     *
     * Filterable so you can add your own here.
     * 
     * @var array
     */
    $simple_fb_ia_sandbox_output_for_shortcodes = apply_filters(
        'simple_fb_ia_sandbox_output_for_shortcodes',
        array( 'protected-iframe' )
    );

    foreach ( $simple_fb_ia_sandbox_output_for_shortcodes as $shortcode_tag ) {

        if ( ! isset( $shortcode_tags[ $shortcode_tag ] ) ) {
            continue;
        }

        $old_callback = $shortcode_tags[ $shortcode_tag ];

        $shortcode_tags[ $shortcode_tag ] = function() use ( $old_callback ) {

            /**
             * Get standard shortcode output.
             *
             * Filterable, in case you need to add custom scripts/styles here.
             * 
             * @var string HTML.
             */
            $output = apply_filters(
                'simple_fb_ia_sandboxed_shortcode_output',
                call_user_func_array( $old_callback, func_get_args() )
            );

            return sprintf(
                '<figure class="op-social"><iframe>%s</iframe></figure>',
                $output
            );

        };

    }
}