There are a number of Dotdigital scripts you can add to your site through your Content Management System (CMS), which allow you to collect and transfer data, and trigger certain actions, across both systems.

You can add scripts to your entire Drupal site using a custom module, or by editing the site theme. You can also edit the HTML of a specific page to add a Dotdigital signup form or survey.

Add scripts to your entire site

The following amendments to your Drupal site must be performed by your web developers.

⚠️The scripts provided here are examples and must not be copied. You can find the scripts you need in your Dotdigital account.

Learn more about the available scripts in Integrate Dotdigital with your CMS.

Option 1: Use a custom module

1. Create a custom module

If you don't have a custom module already, you must create one.

A custom module typically consists of:

a folder with the module name
an .info.yml file
a .module file.

For example, create a folder named my_custom_module and add my_custom_module.info.yml and my_custom_module.module files to it.

2. Edit the .info.yml file

Open the my_custom_module.info.yml file and add the following content:

Name	My Custom Module
Type	module
Description	A custom module to include the chat script, ROI tracking script, and cart insight script.
Package	Custom
core_version_requirement	^8 \|\| ^9

3. Edit the .module file

Open the my_custom_module.module file and add the following PHP code to implement hook_page_attachments:

This example uses the script for Dotdigital Chat.

<?php
/**
* Implements hook_page_attachments().
*/
function my_custom_module_page_attachments(array &$attachments) {   
    $attachments['#attached']['html_head'][] = [
     [
        '#type' => 'html_tag',
        '#tag' => 'script',
        '#attributes' => [
            'type' => 'text/javascript',
        ],
        '#value' => "
            window._ddgChatConfig = {
                apiSpace: '9ec294be-1bd9-4714-8fe7-73bab454c263',
                urlBase: 'https://webchat.dotdigital.com'
            };
            (function(d, s, id){
                var js, cjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) {return;}
                js = d.createElement(s); js.id = id;
                js.src = 'https://webchat.dotdigital.com/widget/bootstrap.js';
                cjs.parentNode.insertBefore(js, cjs);
            }(document, 'script', 'ddg-chat-widget'));
        ",
    ],
];
}

4. Enable the custom module

In the Drupal administration interface, go to Extend > Modules.
Find the custom module you created in step 1, select the checkbox next to it, and then select Install.

Example

To add the Web behavior tracking script you would add:

$attachments['#attached']['html_head'][] = [
        [
            '#type' => 'html_tag',
            '#tag' => 'script',
            '#attributes' => [
                'type' => 'text/javascript',
            ],
            '#value' => "
                (function(w, d, u, t, o, c) {
                    w['dmtrackingobjectname'] = o;
                    c = d.createElement(t);
                    c.async = 1;
                    c.src = u;
                    t = d.getElementsByTagName(t)[0];
                    t.parentNode.insertBefore(c, t);
                    w[o] = w[o] || function() {
                        (w[o].q = w[o].q || []).push(arguments);
                    };
                })(window, document, '//static.trackedweb.net/js/_dmptv4.js', 'script', 'dmPt');
                window.dmPt('create', 'DM-SAMPLE-01');

Option 2: Edit your site theme

Go to your theme's folder.
This is usually located in the /themes directory of your Drupal installation.
Open the html.html.twig file, which is usually located in your theme's /templates folder.
If you don't have an html.html.twig file, you can copy it from the Drupal core stable theme located at /core/themes/stable/templates/layout.

Insert your script just before the closing tag in the html.html.twig file:

   <script>
       window._ddgChatConfig = {
           apiSpace: '9ec294be-1bd9-4714-8fe7-73bab454c263',
           urlBase: 'https://webchat.dotdigital.com'
       };
       (function(d, s, id){
           var js, cjs = d.getElementsByTagName(s)[0];
           if (d.getElementById(id)) {return;}
           js = d.createElement(s); js.id = id;
           js.src = 'https://webchat.dotdigital.com/widget/bootstrap.js';
           cjs.parentNode.insertBefore(js, cjs);
       }(document, 'script', 'ddg-chat-widget'));
   </script>
   <script>
       (function(w, d, u, t, o, c) {
           w['dmtrackingobjectname'] = o;
           c = d.createElement(t);
           c.async = 1;
           c.src = u;
           t = d.getElementsByTagName(t)[0];
           t.parentNode.insertBefore(c, t);
           w[o] = w[o] || function() {
               (w[o].q = w[o].q || []).push(arguments);
           };
       })(window, document, '//static.trackedweb.net/js/_dmptv4.js', 'script', 'dmPt');
       window.dmPt('create', 'DM-SAMPLE-01');
       // Page track feature
       window.dmPt('track');
       window.dmPt('track', { customVar: 'Hello', anotherKey: 'World' });
   </script>

After adding the scripts, you must clear your Drupal site's cache to see the changes. In the Drupal Administration panel, go to Configuration > Performance and select Clear all caches.

Add a script to an individual page

You can add a Dotdigital form to your Drupal site by editing the source code of an individual page.

You can also add a signup form to the footer, or other configurable area of your site.

Edit page HTML

Log in to the Drupal administration panel.
Expand the Manage drop-down menu and select Content.
Select the page you want to edit, or select Add content, then Basic page to create a new one.
If you want to add a popover, expand the Format drop-down menu and select Full HTML.
For an embedded form, skip this step.
For Body, select Source.
Paste in the script you want to use.
Expand the Save as drop-down menu and select Published.
Select Save.

Add a block to the site footer

Availability of this option depends on your site theme.

Log in to the Drupal administration panel.
Select Structure, then select Block layout.
For Footer, select Place block.
Select Add content block, then select Basic block.
For Block description, enter a recognisable name, for example, Dotdigital form.
Expand the Text format drop-down menu and select Full HTML.
For Body, select Source.
Paste in your form embed code and select Save and configure.
Set your desired Visibility settings.
Expand the Region drop-down menu and select Footer.
Select Save block.
Optionally, drag the block to a different location in the list under Footer, to change to display order of your blocks.
Select Save blocks.

In addition to the instructions provided here, it’s also possible to use the Script Manager module to add JavaScript snippets to your Drupal site.

Use the Remote Web Handlers Plugin for Drupal Integration

You can use the Remote Web Handlers plugin to integrate Drupal webforms with Dotdigital. This plugin allows you to create new contacts for each signup by connecting your Drupal form to our API using a remote POST handler.

Remote Web Handlers is not a Dotdigital-built plugin.

Changes made to BigCommerce

Additional scripts for Shopify features

Integrate Dotdigital with your Content Management System

Integrate Dotdigital with Joomla

Integrate Dotdigital with Magnolia