Skip to main content

WordPress

This guide covers installing the DAP SDK on WordPress sites, including theme-based, plugin-based, and headless WordPress setups.

Prerequisites​

  • WordPress 5.0+
  • Admin access to the WordPress dashboard

Option A — functions.php (Recommended)​

Add the SDK using WordPress's script enqueue system in your theme's functions.php:

<?php
function breakground_dap_enqueue_scripts() {
    wp_enqueue_script(
        'breakground-dap',
        'https://cdn.example.com/sdk.js',
        array(),    // no dependencies
        null,       // no version string (CDN handles caching)
        false       // load in <head>, not footer
    );

    wp_add_inline_script(
        'breakground-dap',
        "window.DAPObject = 'DAP';
        window.DAP = window.DAP || function() {
            (window.DAP.q = window.DAP.q || []).push(arguments);
        };
        window.DAP.l = Date.now();
        DAP('init', { tenantKey: 'YOUR_TENANT_KEY' });",
        'before'
    );
}
add_action('wp_enqueue_scripts', 'breakground_dap_enqueue_scripts');

Parameter breakdown:

ParameterValuePurpose
Handle'breakground-dap'Unique identifier for the script
SourceCDN URLWhere to load the SDK from
Dependenciesarray()No other scripts need to load first
VersionnullPrevents WordPress from appending ?ver=
In footerfalseLoads the script in <head> for early initialization

The 'before' argument in wp_add_inline_script places the initialization code before the external script loads, setting up the stub function so calls are queued.

tip

Always use a child theme's functions.php. Edits to a parent theme's functions.php will be overwritten on theme updates.

Option B — Header Injection Plugin​

If you do not have access to theme files, use a code injection plugin such as WPCode or Insert Headers and Footers:

  1. Install and activate the plugin from Plugins > Add New.
  2. Navigate to the plugin's settings (typically under Code Snippets or Settings > Insert Headers and Footers).
  3. Paste the SDK snippet into the Header section:
<!-- DAP SDK Snippet -->
<script>
  (function (w, d, s, o, f, js, fjs) {
    w["DAPObject"] = f;
    w[f] =
      w[f] ||
      function () {
        (w[f].q = w[f].q || []).push(arguments);
      };
    w[f].l = 1 * new Date();
    js = d.createElement(s);
    fjs = d.getElementsByTagName(s)[0];
    js.id = f;
    js.src = o;
    js.async = 1;
    js.crossOrigin = "anonymous";
    fjs.parentNode.insertBefore(js, fjs);
  })(window, document, "script", "https://cdn.example.com/sdk.js", "DAP");
  DAP("init", { tenantKey: "YOUR_TENANT_KEY" });
</script>
  1. Save and verify on the front end.

Option C — Custom Plugin​

For WordPress multi-site installations or when you want the SDK to persist across theme changes, create a standalone plugin.

Create wp-content/plugins/breakground-dap/breakground-dap.php:

<?php
/**
 * Plugin Name: Break Ground SDK
 * Description: Loads the BreakGround Digital Adoption Platform SDK.
 * Version: 1.0.0
 * Author: Your Team
 */

if (!defined('ABSPATH')) {
    exit;
}

function breakground_dap_load_sdk() {
    wp_enqueue_script(
        'breakground-dap',
        'https://cdn.example.com/sdk.js',
        array(),
        null,
        false
    );

    wp_add_inline_script(
        'breakground-dap',
        "window.DAPObject = 'DAP';
        window.DAP = window.DAP || function() {
            (window.DAP.q = window.DAP.q || []).push(arguments);
        };
        window.DAP.l = Date.now();
        DAP('init', { tenantKey: 'YOUR_TENANT_KEY' });",
        'before'
    );
}
add_action('wp_enqueue_scripts', 'breakground_dap_load_sdk');

Activate the plugin from Plugins > Installed Plugins in the WordPress admin.

Headless WordPress​

If you use WordPress as a headless CMS with a separate front-end application (React, Vue, etc.), the SDK should be installed on the front-end, not in WordPress. Refer to the appropriate framework guide:

Caching​

info

Caching plugins (WP Super Cache, W3 Total Cache, etc.) do not affect the SDK snippet because it is output by the theme on every page load. The script tag is part of the HTML response, not a static asset.

If you use a CDN in front of your WordPress site, ensure that the CDN does not strip inline <script> tags from the HTML response.

Gotchas​

warning
  • Use a child theme: Always add code to a child theme's functions.php. Parent theme updates will overwrite your changes.
  • Correct hook name: Use wp_enqueue_scripts (the action hook), not wp_head. The enqueue system handles dependency ordering and deduplication.
  • Script optimization plugins: Plugins like Autoptimize, WP Rocket, or LiteSpeed Cache may defer, combine, or minify scripts in ways that break the SDK initialization. If the SDK fails to load, exclude breakground-dap from script optimization in the plugin settings.

Verification​

  1. Visit your WordPress site in a browser (not the admin area).
  2. Open the developer console (F12 or Cmd+Option+I).
  3. Type window.DAP and press Enter. You should see the DAP function object.
  4. Enable debug mode for detailed logs:
DAP("init", { tenantKey: "YOUR_TENANT_KEY", debug: true });
  1. Check the Console tab for messages prefixed with [DAP] confirming successful initialization.

Next Steps​