Drupal

Integrating Rybbit Analytics with your Drupal site can be done by adding the tracking script to your theme or by using a module that allows adding custom JavaScript.

1. Get Your Tracking Script

First, you’ll need your Rybbit tracking script. You can find this in your Rybbit dashboard under Site Settings > Tracking Code. It will look something like this:

<script async defer src="https://app.rybbit.io/api/script.js" data-site-id="YOUR_SITE_ID"></script>

Replace YOUR_SITE_ID with your actual Site ID from your Rybbit dashboard.

Method 1: Adding to Your Theme (Recommended for Themers)

If you are comfortable editing your Drupal theme files, this is a direct way to add the script.

a. Locate your theme’s html.html.twig file: This file is responsible for the overall HTML structure of your pages. You can typically find it in your active theme’s directory: themes/custom/your_theme_name/templates/layout/html.html.twig

If your custom theme doesn’t have one, you might need to copy it from your base theme (e.g., Stable, Classy) or from Drupal core (core/themes/stable/templates/layout/html.html.twig).

b. Add the script: Open the html.html.twig file and paste the Rybbit tracking script just before the closing </body> tag.

{# ... existing content ... #}
    <js-bottom-placeholder token="{{ placeholder_token }}">
  </body>
</html>

Modify it to include the script:

{# ... existing content ... #}
    <js-bottom-placeholder token="{{ placeholder_token }}">
 
    {# Rybbit Analytics Script #}
    <script async defer src="https://app.rybbit.io/api/script.js" data-site-id="YOUR_SITE_ID"></script>
  </body>
</html>

Replace YOUR_SITE_ID with your actual Site ID.

c. Clear Drupal Caches: After adding the script, you must clear Drupal’s caches for the changes to take effect.

• Go to Manage > Configuration > Development > Performance (e.g., /admin/config/development/performance).
• Click the Clear all caches button.
• Alternatively, use Drush: drush cr

Method 2: Using a Module (e.g., “Asset Injector”)

For users less comfortable with code, or for more flexible management, a module like Asset Injector  can be used.

a. Install and Enable Asset Injector:

• Download and install the Asset Injector module from Drupal.org.
• Enable the module via Manage > Extend (/admin/modules).

b. Add a JavaScript Asset:

• Go to Manage > Configuration > Development > Asset Injector (/admin/config/development/asset-injector).
• Click on JS injector.
• Click + Add JS inject.
• Label: Give it a name like “Rybbit Analytics”.
• Code: Paste your Rybbit tracking script into the code field.
• Pages: Configure where the script should appear. For sitewide tracking, you might select “Add on every page except the listed pages” and leave the list empty, or use specific conditions if needed.
• Preprocess JavaScript: Usually, you can leave this unchecked for external scripts.
• Scope: Select Footer to add the script to the bottom of the page.

c. Save and Clear Caches:

• Save the asset.
• Clear Drupal’s caches as described in Method 1.

3. Verify Integration

• Open your live Drupal website in a browser.
• Navigate through a few pages.
• Check your Rybbit dashboard for incoming data. It might take a few minutes for the first events to appear.

That’s it! Rybbit Analytics should now be integrated with your Drupal site.