Loading Third Party Scripts In The Epoch iFrame

This document is primarily aimed at developers of plugins related to comments, such as anti-spam plugins, looking to integrate with Epoch. It is also aimed at those looking to create a site-specific integration with Epoch.

Developers of third party plugins related to comments are encouraged to  submit a pull request to add compatibility with their plugins inside of the epoch_add_thirdparty_scripts_in_footer function. That function is located in includes/functions.php.

Background

One of the options in Epoch is to use an iFrame (the good kind) to load comments in. This mode creates allows for the total overriding of the theme's styles for comments and the comment form.

NOTE: When not using the iFrame, everything  should work as expected. If it does not, please open an issue.

Using the iFrame requires us to load Epoch's JavaScript, and its dependencies (jQuery, Handlebars and Visibility) inside of the iFrame. We chose not to run  wp_header or wp_footer insides of the iFrame, as that would defeat the purpose of using the iFrame and cause unnecessary scripts and styles to be loaded.

Instead we run the action  epoch_iframe_footer inside of the iFrame. While you could use that hook to echo a script tag, or any other data, we use and recommend that you use the filterepoch_iframe_scripts to load your scripts, as detailed in the next section.

Adding Your Scripts Inside The Epoch iFrame

In order to use the  epoch_iframe_scripts filter to load your scripts, you must register your scripts using wp_enqueue_script or wp_register_script. You must do so at or beforewp_enqueue_scripts is fired.

Once you script handles are registered, you must add them to the array of handles exposes by epoch_iframe_scripts. For example if your script is registered with the handle "fancy-pants" then you would register it with Epoch like so:

 add_filter( 'epoch_iframe_scripts', function( $scripts ) {
        $handles[]  = 'fancy-pants';
        return $handles;
    });<br>
	

You can also add multiple scripts, like this:

 add_filter( 'epoch_iframe_scripts', function( $handles ) {
        $my_script_handles  = array( 'georg', 'friedrich', 'handel' );
        if ( ! empty( $handles ) && is_array( $handles ) ) {
            $handles = array_merge( $handles, $my_script_handles );
        }else{
            $handles = $my_script_handles;
        }

        return $handles;

     });
	

IMPORTANT This method will not include any handles registered as a dependency. If your scripts have dependencies, you must add their handles at epoch_iframe_scripts as well. jQuery will always be loaded, as it is used by Epoch.

Localized Data

If you are using  wp_localize_script to inject translation or other data to JavaScript, there is no special handling required. Epoch uses wp_localize_script() and the object it adds to the DOM is available to the scripts we load inside of the iFrame.