🚀 Integration Examples

For Joomla, you can add it directly to your template's main file. Navigate to Extensions > Templates > Templates, select your theme, and find index.php. Add the code before the closing </body> tag.

For Drupal, the recommended method is to declare the script as a library and then attach it to your theme or module.

Add the script via TypoScript or in a template file. Using TypoScript is the recommended method to avoid losing the code during updates.

Ghost provides a "Code Injection" feature in its admin panel. Navigate to Settings > Code Injection and paste the script tag into the Site Footer section.

For Craft CMS, you can add the script to your main layout template file, typically _layout.twig or _layout.html. Place the script tag before the closing </body> tag.

In Concrete5, you can add the script via the "Sitemap" or "Page Types" dashboard. Go to Dashboard > Pages & Themes > Page Types and edit the default page type. Under HTML Editor, add the script to the footer area.

OctoberCMS uses a similar approach to other CMS. Add the script to your main layout file, for example, /themes/your-theme/layouts/default.htm. Place the tag before the closing </body> tag.

WooCommerce runs on WordPress, so you can follow the standard WordPress integration process. Alternatively, you can use the "Insert Headers and Footers" plugin and paste the script tag into the footer section.

In Magento, the best way is to add it via the admin panel. Go to Content > Design > Configuration, select your theme, and under the HTML Head or Footer section, add the script to the "Scripts and Style Sheets" or "Footer" field.

For BigCommerce, navigate to Storefront > Script Manager in your admin panel. Click "Create a Script," give it a name, set the location to "Footer," and paste the script tag into the "Script Content" field.

PrestaShop lets you add custom code in the back office. Go to Design > Themes & Logo > Theme Configuration and look for a section to add custom code to the footer.

In Wix, go to your site's dashboard and navigate to Settings > Custom Code. Click "Add Custom Code," select "Footer" as the placement, and paste the script tag.

For other platforms like OpenCart, Ecwid, Volusion, nopCommerce, PlentyShop, or Shift4Shop, the process is similar. You'll typically find a "Script Manager," "Global Scripts," or "Custom Code" area in your store's admin dashboard to paste the script tag.

For Squarespace, navigate to Settings > Advanced > Code Injection. You can paste the script into the "Footer" section to ensure it appears on all pages.

In Webflow, go to Project Settings > Custom Code. You can paste the script tag into the "Footer Code" area to load the widget on every page of your site.

For other builders like Weebly, Jimdo, Site123, Duda, GoDaddy, Strikingly, or Bookmark, look for a "custom HTML," "embed code," or "code injection" feature in your dashboard or page editor. This is the simplest way to add the script globally.

You can add the script directly to index.html (recommended for simplicity) or load it dynamically using Renderer2 in a service or component.

Use the onMounted hook for the Composition API, or the mounted() hook for the Options API in your main component. For Nuxt.js, you can add it to the nuxt.config.js file.

Use the onMount lifecycle function to load the script when the component is created. This is typically done in your main App.svelte file.

In Ember, you can add the script in a component's didInsertElement hook or load it in a service to ensure it's available globally once the app has rendered.

For Backbone.js, you can load the script when your main application view is rendered. Add the script tag to your main HTML file or dynamically load it as shown here.

Alpine.js is lightweight, so you can simply add the script tag to your HTML file, just as with basic HTML integration. Place it just before the closing </body> tag.

In a Django project, you will add the script to your base template file, typically base.html. This ensures the script is loaded on every page that inherits from this template.

For Laravel, you will add the script to your main layout file, usually resources/views/layouts/app.blade.php, placing it before the closing </body> tag.

Hugo is a static site generator. You will add the script tag to your theme's main layout or partials, such as layouts/_default/baseof.html, to ensure it's included on every page.

For Jekyll, add the script to the main layout file, which is often named _layouts/default.html. Place the script tag before the closing </body> tag.

For platforms like Flask, Symfony, Spring Boot, ASP.NET Core, or CakePHP, the integration method is to simply add the script tag to your main layout or template file, just like a standard HTML site.

Contentful also provides content via API, so you'll integrate the script on your frontend. For example, if you're building a static site with Gatsby, you'll follow the **Static Site Generators** instructions for Gatsby.

For other platforms like Sanity.io, Prismic, GraphCMS (Hygraph), DatoCMS, Kentico Kontent, or Directus, the process is the same as the above. The integration is handled on the frontend application that consumes the content from the headless CMS.

For Kajabi, go to Settings > Site Details and find the "Page Scripts" section. You can paste the script tag into the "Header Page Scripts" or "Footer Page Scripts" area.

In ClickFunnels, open your funnel and go to Settings > Tracking Code. Paste the script into the "Footer Code" section to add it to all pages in your funnel.

For platforms like Podia, Substack, or Medium, you typically have limited customization options. For Podia, look for a "code snippet" area in the platform's settings. For Substack and Medium, adding third-party scripts is not officially supported, but you might be able to add custom HTML blocks in certain contexts.