---
title: Installing the script (activation) code
description: "### Friendly, All-Access Guide to Installing the Funneler AI Script This expanded guide covers all major CMS options and plain websites. The core goal is the same: insert the following tag just before the closing `` on your pages. In your Funneler…"
url: "https://funneler.ai/guide/installing-the-script-code/"
updated: "2025-12-18"
category: Chatbot Agent Funnels
---

# Installing the script (activation) code

### Friendly, All-Access Guide to Installing the Funneler AI Script

This expanded guide covers all major CMS options and plain websites. The core goal is the same: insert the following tag just before the closing `</body>` on your pages.

In your Funneler dashboard, go to **[Chat Funnels](https://app.funneler.ai/chat-funnels)**, click the activation code button, and copy the unique account code found within the **<script>...your account code...</script>** snippet. You may save this code locally for future reference.

Now choose your platform from the list below to get started.

---

### Table of Contents

- [1) WordPress](#Wordpress)
- [2) Elementor](#Elementor)
- [3) Beaver Builder](#Beaver)
- [4) Divi](#Divi)
- [5) Other WordPress page builders](#Other)
- [6) Child Theme or Site-wide Plugin (safe, maintainable approach)](#Child-theme)
- [7) Plugins for “Insert Headers and Footers” style insertions](#Plugins)
- [8) WordPress Multisite considerations](#Multisite)
- [9) Wix](#Wix)
- [10) Webflow](#Webflow)
- [11) Squarespace](#Squarespace)
- [12) Joomla](#Joomla)
- [13) Drupal](#Drupal)
- [14) Magento / Adobe Commerce](#Magento)
- [15) Weebly](#Weebly)
- [16) Shopify](#Shopify)
- [17) Plain non-CMS / hand-coded websites](#Plain-sites)

---

### **1) WordPress**

### Quick recap

- You’re inserting a small JavaScript tag just before the closing `</body>` tag.
- The code snippet: ****<script>...your account code...</script>****

### Best-practice overview

- Use a maintenance-friendly path (child theme or site-wide plugin) to survive updates.
- Clear caches after insertion; test in incognito to verify loading.

### Path options

#### Path A: Page-builder friendly approach (Elementor, Beaver Builder, Divi, etc.)

- Elementor (and similar editors)
- Beaver Builder
- Divi
- Other builders (Thrive, Brizy, Oxygen, etc.)

#### Path B: Safe, maintainable approach

- Child Theme (recommended)
- Lightweight plugin (Code Snippets / WPCode)
- Functions.php enqueue (advanced)

#### Path C: Plugins for “Insert Headers and Footers” style insertion

- Insert Headers and Footers
- WPCode (Snippets)
- Code Snippets

### Testing & troubleshooting

- View Source to confirm tag before `</body>`.
- Incognito testing; check console for errors.

---

### **2) Elementor**

### Approach

- Use a site-wide footer insertion via a snippet plugin (recommended) OR
- Place a snippet in Elementor’s Theme Builder footer (if you have Elementor Pro).

### Steps (recommended site-wide method)

1. Install and activate a snippet plugin (e.g., WPCode or Insert Headers and Footers).
2. Create a new snippet.
3. Location: Before `</body>` (Footer).
4. Content: html `<script>...your account code...</script>`
5. Save and set to All Pages.
6. Clear caches and test.

### Alternative (page-level)

- Edit a page with Elementor.
- Add an HTML widget near the bottom and paste the script tag.
- Note: To cover all pages, you’d need to repeat or use the site-wide method.

---

### **3) Beaver Builder**

### Approach

- Prefer a global footer or code injection method.
- If your theme supports it, add to footer.php in a child theme; otherwise, use a snippet plugin.

### Steps (global code injection)

1. Install a snippet plugin.
2. Create a new snippet with location: Before `</body>`.
3. Content: the script tag.
4. Save, enable on all pages, clear caches, test.

---

### **4) Divi**

### Approach

- Divi has integration areas for code snippets.

### Steps

1. Divi > Theme Options > Integration.
2. In “Before </body>” (or similar) paste the code.
3. Save changes and test across pages.

---

### **5) Other WordPress page builders**

- Oxygen Builder, Thrive Architect, Brizy, etc.
- General guidance: use a global code insertion path via a snippet plugin or theme integration area when available.
- If no global option exists, resort to editing footer.php in a child theme with caution.

---

### **6) Child Theme or Site-wide Plugin (safe, maintainable approach)**

### 1) Child Theme (recommended)

- Create/edit footer.php in your child theme.
- Insert the snippet just before `</body>`.

Example:

```
?php// Footer content...?>
<script>...your account code...</script>
</body>
</html>
```

- Why child themes? Updates to the parent theme won’t overwrite your changes.

### 2) Lightweight Plugin (Code Snippets / WPCode)

- Create a snippet: Location = Before `</body>`; Content = script tag.

### 3) Site-wide functions.php alternative (advanced)

```
<?php
// Footer content...
?>
<script>...your account code...</script></body>
</html>
```

---

### **7) Plugins for “Insert Headers and Footers” style insertions**

### Common steps

1. Install and activate the plugin.
2. Create a new snippet:
   - Type: HTML or Script
   - Location: Before `</body>` (Footer)
   - Content: the script tag
3. Apply to All Pages; clear caches; test.

---

### **8) WordPress Multisite considerations**

- Use a network-wide code injection (via a site admin plugin) if you want the script on all subsites.
- Alternatively, add to the shared footer template or use a central child theme that propagates to all sites.

---

### **9) Wix**

- Wix Editor: Settings > Tracking & Analytics or Custom Code.
- Add a new tool, place code in Footer, paste snippet ****<script>...your account code...</script>****, apply to all pages, publish.
- Confirm with Page Source in a live view.

---

### **10) Webflow**

- Project Settings > Custom Code > Footer Code.
- Paste the snippet ****<script>...your account code...</script>**** ,save and publish.
- Code runs site-wide on all pages.

---

### **11) Squarespace**

- Settings > Advanced > Code Injection > Footer.
- Paste snippet **<script>...your account code...</script>**; save and publish.
- Code runs site-wide on all pages.

---

### **12) Joomla**

### Approach

- Use a site-wide template override or a simple extension that injects code before `</body>`.

### Steps

1. Identify the template’s footer file (e.g., index.php in your template).
2. Insert the snippet ****<script>...your account code...</script>**** just before the closing `</body>`.
3. Clear caches and verify.

---

### **13) Drupal**

### Approach

- Use a site-wide HTML head/footer injection module or add a small custom module.

### Steps

1. Install a module like "Block" or "Footer Scripts" (depending on Drupal version).
2. Add a block that outputs: html `<script>...your account code...</script>`
3. Place block in the footer region; test across pages.

---

### **14) Magento / Adobe Commerce**

### Approach

- Use the layout XML to add a script to the footer, or use a module that supports custom JS.

### Steps

1. Create/modify layout update to include:

```
xml<referenceContainer name="before.body.end"> <block class="MagentoFrameworkViewElementText" name="funneler_ai_script"> <arguments> <argument name="text" xsi:type="string"><![CDATA[<script>...your account code...</script>]></argument> </arguments> </block> </referenceContainer>
```

2. Deploy and test.

---

### **15) Weebly**

### Approach

- Use the site-wide Settings > SEO > Header Code or Footer Code (depending on version).
- Paste snippet in Footer; save and publish.

---

### **16) Shopify**

Shopify is a bit different because it uses theme-level liquid templates rather than inserting raw HTML into every page. Here are practical, safe options to include your script site-wide:

### Pink note on Shopify architecture

- Shopify themes render pages via Liquid templates. To add a script site-wide, you typically insert it into the theme’s theme.liquid file, just before the closing </body> tag. If you’re using Shopify Online Store 2.0, you can also use an app or theme sections to manage code snippets, but the common approach remains editing theme.liquid.

### Approaches

#### Approach A: Theme editing (site-wide)

1. From Shopify Admin, go to Online Store > Themes > Actions > Edit code.
2. Open layout/theme.liquid (or layout/theme.liquid in some themes).
3. Just before </body>, insert:

```
html<script>...your account code...</script>
```

1. Save changes and test on storefront.

#### Approach B: Theme app extension or Shopify app (per-page or app-managed)

- If you’re using a code injection app or a Shopify App that manages snippets, use its UI to inject your snippet before </body> on all pages or on specific templates.
- Ensure the app is configured to load on all pages and that the snippet is exactly:

```
html<script>...your account code...</script>
```

### Testing

- Open a storefront page, View Page Source to confirm the script tag appears before the closing tag.
- Check on mobile and desktop, and verify it loads without blocking content.

---

### **17) Plain non-CMS / hand-coded websites**

### Steps

1. Open your HTML files (index.html, page.html, etc.).
2. Before the closing `</body>`, insert: html `<script>...your account code...</script>`
3. Save and upload; clear caches; test.

### Tips

- Maintain a single source of truth by centralizing the code in a common footer include if you serve many pages via server-side templates.

---

### **Testing & Troubleshooting**

- Verify the tag is present just before `</body>` via View Source.
- Test in an incognito window to bypass cache.
- Check the browser console for errors (e.g., mixed content, CSP blocks, or syntax errors).
- If the script doesn’t load:
  - Confirm the URL is correct and accessible (HTTPS).
  - Ensure no conflicting script blocks use the same globals.
  - Consider deferring or asynchronously loading the script if needed, though the current instruction requests before `</body>`.

---

### **Quick reference checklist**

-  Identify the platform and method you’ll use (WordPress + plugin, child theme, or page builder)
-  Prepare the exact snippet to insert
-  Insert the snippet ****<script>...your account code...</script>**** just before `</body>`
-  Clear caches (site, plugin, browser)
-  Verify with View Source and incognito testing
-  Document where you kept the change (for future updates)

### Advanced Installation Options

#### Install on Specific Pages Only

Modify the code to show widget only on certain pages:

```
<script>
  // Only load on homepage
  if (window.location.pathname === '/') {
    var script = document.createElement('script');
    script.src = 'https://app.funneler.ai/chat-widget.js';
    script.setAttribute('data-funnel-id', 'YOUR_FUNNEL_ID');
    document.head.appendChild(script);
  }
</script>
```

#### Delay Widget Load

Wait for page to fully load first:

```
<script>
  window.addEventListener('load', function() {
    var script = document.createElement('script');
    script.src = 'https://app.funneler.ai/chat-widget.js';
    script.setAttribute('data-funnel-id', 'YOUR_FUNNEL_ID');
    document.head.appendChild(script);
  });
</script>
```

#### Custom Positioning

Override default position with CSS:

```
<style>
  #funneler-chat-widget {
    bottom: 80px !important; /* Move up from bottom */
    right: 30px !important;  /* Adjust from right */
  }
</style>
```

---

### Google Tag Manager Installation

Using GTM? Follow these steps:

1. **Create New Tag:**

- Go to GTM dashboard
- Click **"Tags" > "New"**
- Name it "Funneler Widget"

1. **Configure Tag:**

- Tag Type: **Custom HTML**
- Paste your activation code

1. **Set Trigger:**

- Trigger: **All Pages** (or specific pages)
- Or use **Page View** trigger

1. **Save and Publish:**

- Click **"Save"**
- Click **"Submit"**
- Publish changes

---

### Verifying Installation

**Check if widget is working:**

1. **Visit Your Website:**

- Open your site in a browser
- Look for chat widget in corner
- Try different pages

1. **Test the Widget:**

- Click to open chat
- Send a test message
- Verify AI responds

1. **Check Browser Console:**

- Press F12 to open developer tools
- Look for errors in Console tab
- Funneler should load without errors

1. **Verify in Funneler Dashboard:**

- Go to your funnel analytics
- Check if conversations appear
- May take a few minutes to sync

---

### Troubleshooting Installation

**Problem: Widget doesn't appear**

**Solutions:**

1. ✅ Check code is pasted correctly
2. ✅ Verify it's in the `<body>` section, before `</body>`
3. ✅ Clear browser cache and refresh
4. ✅ Check browser console for errors
5. ✅ Ensure funnel is published and active
6. ✅ Try incognito/private browsing mode

**Problem: Widget shows but doesn't work**

**Solutions:**

1. ✅ Verify funnel ID is correct
2. ✅ Check if funnel is active in dashboard
3. ✅ Look for JavaScript errors in console
4. ✅ Disable browser ad blockers
5. ✅ Check if other scripts conflict

**Problem: Widget appears on wrong pages**

**Solutions:**

1. ✅ Use conditional code (see Advanced Options above)
2. ✅ Install in page-specific templates
3. ✅ Use GTM with page-specific triggers

**Problem: Widget position is wrong**

**Solutions:**

1. ✅ Use custom CSS to adjust position
2. ✅ Check for CSS conflicts
3. ✅ Use browser DevTools to debug positioning

**Problem: Multiple widgets appear**

**Solutions:**

1. ✅ Code may be pasted multiple times
2. ✅ Check theme template and plugin both have code
3. ✅ Remove duplicate installations

---

### Performance Best Practices

**Optimize Load Times:**

1. **Load Asynchronously:** Our code already does this
2. **Place in Footer:** Loads after main content
3. **Use CDN:** We serve from global CDN (automatic)
4. **Lazy Load on Scroll:** Advanced option available

**Mobile Optimization:**

- Widget is automatically responsive
- Touch-friendly on mobile devices
- Adjusts size for small screens
- Can hide on mobile if needed:

```
<style>
  @media (max-width: 768px) {
    #funneler-chat-widget {
      display: none !important;
    }
  }
</style>
```

---

### Removing the Widget

To remove Funneler widget:

1. Locate where you pasted the code
2. Delete the entire `<script>` block
3. Save changes
4. Clear cache
5. Refresh your site

**Note:** Removing the widget doesn't delete your funnel or data. You can reinstall anytime.

---
