Setting up Field Testing

In this guide, we will show you how to set up Field Testing on your website by adding a piece of JavaScript code. We will cover how to implement the script in Google Tag Manager as well as the most popular Content Management Systems (CMS), such as WordPress, Joomla, Drupal, Wix, and Squarespace. Lastly, we will also provide a general approach that will work for any CMS.

How to set up Field Testing on your website

To set up Field Testing, first go to the menu item "Field Testing" in your PageVitals account. A modal will guide to to the script. Copy this script to the clipboard or save it elsewhere.

PageVitals Field Testing script

Google Tag Manager

Google Tag Manager is one of the most common ways to manage and add scripts (or tags) to your site. If you're already using GTM, it may be the easiest way to get started with Field Testing:

  1. Sign in to your Google Tag Manager account: Navigate to Google Tag Manager and sign in to your account. If you haven't set up an account yet, create one and follow the steps to set up a new container for your website.

  2. Create a new tag: In your GTM container dashboard, click on the "New tag" button.

Google Tag Manager - add tag

  1. Name the tag: Write the name of the tag (like "PageVitals Field Testing") and click the "Tag Configuration section"

Google Tag Manager - configuration

  1. Choose Custom HTML: From the list of tag types, select "Custom HTML."

Google Tag Manager - custom HTML

  1. Add the PageVitals script: In the "HTML" input box, paste the script. You can include the <script> tags or exclude them; GTM will handle it correctly either way.

Google Tag Manager - add script

  1. Set up a trigger: Scroll down to the "Triggering" section and click on the "Choose a trigger to make this tag fire..." area. You can either select an existing trigger or create a new one. For example, you can choose the "All Pages" trigger if you want the custom script to load on every page of your website.

Google Tag Manager - add trigger

  1. Save and publish: After configuring the tag and its trigger, click "Save" on the top-right corner and return to your workspace. Click "Submit", write a version name and description, and then hit "Publish" to make the script live on your website.

Google Tag Manager - publish

WordPress

  1. In your WordPress dashboard, go to Plugins and clidk Add New Plugin.
  2. Under Search Plugins, write "pagevitals".PageVitals Wordpress Plugin
  3. When the plugin appears, click "Install Now".
  4. Click "Activate" (it still won't be active on your site before you add the website ID)
  5. In the plugins list, click "Settings"PageVitals Wordpress Plugin
  6. Add your website ID to the field "Website ID". The ID can be found here:How to get your website IDAnd inserted here:PageVitals Wordpress Plugin
  7. If you want to only include the RUM script on specific pages, or add Content Security Policies, you can also do this, but it's not mandatory.
  8. Click "Save Changes" and you're done.

If the plugin doesn't appear in your search, you can download the PageVitals WordPress Plugin here.

Joomla

  1. In your Joomla admin panel, go to the Extensions > Templates menu.
  2. Click on your active template to open the template manager.
  3. On the Edit screen, click the index.php file to open the file editor.
  4. Look for the opening <head> tag or the closing </head> tag in the index.php file.
  5. Before the closing </head> tag, paste your PageVitals script.
  6. Click the Save button to save your changes.

Drupal

  1. In your Drupal admin panel, go to the Appearance menu.
  2. Locate your active theme and click on the Settings button for that theme.
  3. In the settings page, scroll down to the 'Advanced' section and look for the 'Custom JavaScript' or 'Custom JS' option. If not available, you may need to edit your theme's template files directly.
  4. In the 'Custom JavaScript' or 'Custom JS' field, paste your PageVitals script.
  5. Click the 'Save configuration' button to save your changes.

If your theme does not have a 'Custom JavaScript' or 'Custom JS' option, you can manually edit the template files:

  1. Go to your Drupal installation's root directory and navigate to themes/your_theme_name/templates.
  2. Open the html.html.twig file or the page.html.twig file in a suitable text editor.
  3. Look for the opening <head> tag or the closing </head> tag.
  4. Before the closing </head> tag, paste your PageVitals script.
  5. Save and upload the modified file back to the server.

Wix

  1. In the Wix Editor, click 'Site' in the top menu bar and choose 'Custom Code'.
  2. Click the '+ Add Custom Code' button that appears in the custom code manager.
  3. In the 'Add Custom Code' window, give your code a name (e.g., 'PageVitals Field Testing') and paste your PageVitals script in the 'Paste the code snippet here' field.
  4. Select 'Load code on each new page' in the 'Add Code to Pages' section.
  5. Set the 'Place Code in' option to 'Head'.
  6. Click the 'Apply' button to save your changes.

Squarespace

  1. In your Squarespace dashboard, go to the 'Settings' menu.
  2. Click on 'Advanced' in the left sidebar.
  3. Select the 'Code Injection' option.
  4. In the 'Header' field, paste your PageVitals script.
  5. Click 'Save' to save your changes.

General Approach

If you are using a different CMS or a custom-built website, follow these guidelines to add the PageVitals script to your site:

  1. Locate your website's files, either on your local machine or your web server.
  2. Identify the file responsible for the <head> section of your site. It is usually named header.php, index.html, index.php, or default.html.
  3. Open the identified file in a text editor.
  4. Look for the opening <head> tag or the closing </head> tag.
  5. Before the closing </head> tag, paste your PageVitals script.
  6. Save the modified file and upload it back to the server (if necessary).

After adding the script to your website, it is recommended to validate the implementation by checking for the presence of the script in the source code of your website.

Previous page Field Testing / RUM Next page Using filters
We'd love to understand how you use our site so we can make it better and also manage our marketing spend. Read our cookie policy.