You can quickly add Claspo pop-up widgets to the site using one of the following systems, whichever is the most convenient for you:

Adding widgets using Google Tag Manager (GTM)

When you create a pop-up widget using Claspo services that is matching your tasks and goals, you get a script. You need to add that script to your site using the tag management system – Google Tag Manager.

Perform the following steps:

In Claspo, click the Install Script menu and click Install Script in Site Details.
Copy the script generated for your custom pop-up widget.
In GTM, go to the Tags section and click the New button.
Enter the tag’s name and click Tag Configuration.
Select Custom HTML from the list of the tag types.
Paste the script in the HTML field and click Save.
To create a trigger for your script, click Triggering and choose a trigger from the list.
Choose All Pages if you want to place your pop-up on all pages.
Click the Save button.
Click Submit to publish your trigger and the tag.

Adding widgets using WordPress

You can add the script to your WordPress site using one of the following methods described below.

Before applying any of the methods, copy the script generated for your custom pop-up widget as described in Adding widgets using Google Tag Manager, steps 1 and 2.

Method 1 - Using Insert Headers and Footers plugin

You can use Insert Headers and Footers plugin to add the script to the entire WordPress site.

Proceed as follows:

Go to https://wordpress.org/plugins/insert-headers-and-footers/ and download the plugin.
Run the downloaded file, follow the instructions to install the plugin.
To activate the plugin, go to Insert Headers and Footers >> Settings and paste the script you copied into one of the following boxes:

Scripts in Header (recommended)
Scripts in Footer

4. Click Save.

The plugin automatically loads the added code on every page of your website.

Method 2 - Adding the script manually using code

Using this method, you have to add the script manually to your WordPress files. Also, see the detailed instructions on how to copy and paste code in WordPress.

You can add the script to the following locations on your WordPress site:

Header (recommended)
Specific post
Specific page
Footer

Adding the script to the site header

To add the copied script to your site’s header, insert it into your functions.php file in a site-specific plugin or by using a code snippets plugin.

Example:

function wpb_hook_javascript() {
    ?>
        <script>
          // your javascript code goes here
        </script>
    <?php
}
add_action('wp_head', 'wpb_hook_javascript');

Adding the script to a specific post

When you need to add the script to a single WordPress post, add the conditional logic to the code.

Example:

function wpb_hook_javascript() {
    if (is_single ('5')) {
        ?>
            <script type="text/javascript">
              // your javascript code goes here
            </script>
        <?php
    }
}
add_action('wp_head', 'wpb_hook_javascript');

This code runs the script only if the post ID is ’5’. You have to place the ’5’ as your post ID.

To find the post ID, open the post where you want the script to run. The post ID is the number following ‘post=’.

Adding the script to a specific page

When you want to add the script to a single WordPress page, add the conditional logic to the code, as in the previous case.

Example:

function wpb_hook_javascript() {
  if (is_page ('10')) {
    ?>
        <script type="text/javascript">
          // your javascript code goes here
        </script>
    <?php
  }
}
add_action('wp_head', 'wpb_hook_javascript');

This code runs the script only if the page ID is ’10’. You have to place the ’10’ as your page ID.

To find the page ID, use the same method as described above. Open the page you want the script to run and find the page ID in the URL.

Adding the script to the site footer

Add the following code snippet to your website when you want the script to run in your site footer.

Example:

function wpb_hook_javascript_footer() {
  ?>
        <script>
          // your javascript code goes here
        </script>
    <?php
}
add_action('wp_footer', 'wpb_hook_javascript_footer');

This code hooks into 'wp_footer' instead of 'wp_head'.

Method 3 - Adding the script inside the posts or pages using a plugin

You can use a plugin to select the location in the content to embed your script.

Download the Code Embed plugin.
Install and activate the plugin in the Plugins menu in WordPress administration. See the installation guide for more details.
In the WordPress post editor, click the more options menu in the top-right corner of the screen and select Options.
In the dialog box, check the Custom fields option in the Advanced panels section.
In the Custom Fields meta box under the content editor, click the Enter new link.
Enter the custom field name beginning with the CODE prefix and paste the script into the Value field.
Click Add Custom Field.

Use this custom field to embed the script code in any location of a post or a page. To do that, add the following embed code anywhere in your content:

{{CODEmyjscode}}

After that, click Update or Publish to make your script code live on the page or post.