Load scripts after consent

Scripts that do not read Google Consent Mode, such as advertising pixels, chat widgets and embedded players, run as soon as they are on the page. Signocore Consent holds them back until the visitor allows their category, with one attribute and no JavaScript of your own.

Hold a script back

Change the script's type to text/plain and name its category in data-scc-consent. The browser does not run a script of that type, so it waits on the page:

<script type="text/plain" data-scc-consent="statistics">
    // Runs only after the visitor allows Statistics.
</script>

For a script loaded from another address, move src to data-src:

<script type="text/plain" data-scc-consent="marketing" data-src="https://example.com/pixel.js"></script>

As soon as the visitor allows the category, the plugin swaps each waiting script for a real one, on the same page and without a reload, and on every later page view. Other attributes, such as id, class or data- attributes, are copied to the real script. Scripts loaded from another address run in the order they appear on the page, unless you add async.

The categories are necessary, preferences, statistics and marketing, plus any a developer adds with the signocore_consent_categories filter. A script marked with an always-active category, such as necessary, runs straight away, before the visitor has chosen.

A script that needs several categories

List the categories separated by spaces. The script runs only when the visitor allows all of them:

<script type="text/plain" data-scc-consent="statistics marketing" data-src="https://example.com/tracker.js"></script>

Where to add the markup

• In a page or post: use a Custom HTML block. Only users who may post unfiltered HTML, which on a single site means administrators and editors, can save script tags.
• In your theme: in a child theme's footer.php, or from a wp_footer callback in functions.php.
• From another plugin: most plugins for header and footer code let you paste the markup as it is.

Only script elements are held back. For an embedded video or map, load the iframe from a held-back script, or check the choice in your own code as shown below.

Check the choice in your own code

The plugin's script exposes window.SignocoreConsent:

The script loads in the page footer. Code that runs earlier, for example in the head, should wait for the signocore-consent:ready event, which fires once per page as soon as a choice exists:

window.addEventListener('signocore-consent:ready', (event) => {
    if (event.detail.preferences === true) {
        loadChatWidget();
    }
});

window.addEventListener('signocore-consent:updated', (event) => {
    if (event.detail.preferences === true) {
        loadChatWidget();
    }
});

ready covers a returning visitor and the first choice on a page, and updated covers every later change. Make your loader safe to call twice. Every event is listed in Hooks and JavaScript events.

Pages that load WordPress without your theme

A standalone PHP page that loads wp-load.php never runs wp_head() and wp_footer(), so the plugin cannot print its output on its own. Call the two helper functions instead:

<?php require __DIR__ . '/wp-load.php'; ?>
<!doctype html>
<html lang="en">
<head>
    <?php if (function_exists('signocore_consent_head')) { signocore_consent_head(); } ?>
    <!-- Google Tag Manager or the Google tag goes here -->
</head>
<body>
    <!-- Your page -->
    <?php if (function_exists('signocore_consent_footer')) { signocore_consent_footer(); } ?>
</body>
</html>

signocore_consent_head() prints the Consent Mode defaults, a returning visitor's choice and the stylesheet. Call it before any Google tag. signocore_consent_footer() prints the banner, the settings window and the script, right before </body>. Both print nothing while Cookie consent is off. The function_exists() checks keep the page working if the plugin is deactivated.