/** * @file Integration guide content — full JSX guide for every supported platform. * * Each guide is keyed by the integration slug and rendered on the * `/integrations/[slug]` page. * * * 50 guides across 7 categories. */ import { type ReactNode } from 'react' import { CodeBlock } from '@/components/CodeBlock' // * ─── Guide registry ───────────────────────────────────────────────────────── const guides: Record = { /* ──────────────────────────────────────────────────────────────────────────── * 1. Next.js * ──────────────────────────────────────────────────────────────────────────── */ 'nextjs': ( <>

The best way to add Pulse to your Next.js application is using the built-in next/script component.

Method 1: App Router

Add the Pulse script to your root layout so it loads on every page.

{`import Script from 'next/script' export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( My React App
`}

Method 2: Programmatic injection via useEffect

If you prefer to inject the script programmatically (e.g. only in production), use a useEffect hook.

{`import { useEffect } from 'react' function App() { useEffect(() => { if (process.env.NODE_ENV === 'production') { const script = document.createElement('script') script.defer = true script.setAttribute('data-domain', 'your-site.com') script.src = 'https://pulse.ciphera.net/script.js' document.head.appendChild(script) } }, []) return

Hello World

}`}

Related Integrations:{' '} Next.js,{' '} Remix,{' '} Gatsby,{' '} Preact

), /* ──────────────────────────────────────────────────────────────────────────── * 3. Vue.js * ──────────────────────────────────────────────────────────────────────────── */ 'vue': ( <>

Add the script to your index.html — works for both Vue CLI and Vite-based projects.

Add the Pulse script to index.html

Both Vue CLI and Vite use an index.html as the entry point. Simply add the Pulse script inside the <head> tag.

{` My Vue App
`}

Looking for Nuxt? Check the dedicated{' '} Nuxt guide.

Related Integrations:{' '} Nuxt,{' '} VitePress

), /* ──────────────────────────────────────────────────────────────────────────── * 4. Angular * ──────────────────────────────────────────────────────────────────────────── */ 'angular': ( <>

Add the script to your src/index.html — the single entry point for all Angular applications.

Add the Pulse script to index.html

Place the Pulse script inside the <head> tag of your Angular app's src/index.html.

{` My Angular App `}

For more details, see the{' '} Angular docs .

Related Integrations:{' '} React,{' '} Vue.js

), /* ──────────────────────────────────────────────────────────────────────────── * 5. Svelte * ──────────────────────────────────────────────────────────────────────────── */ 'svelte': ( <>

Add the script to your index.html for Vite-based Svelte, or use <svelte:head> in SvelteKit.

Method 1: Svelte (Vite)

For standard Svelte projects using Vite, add the Pulse script to your{' '} index.html.

{` My Svelte App
`}

Method 2: SvelteKit

In SvelteKit, use <svelte:head> in your root layout to add the script to every page.

{` `}

Alternatively, you can add the script directly to{' '} src/app.html in your SvelteKit project.

Related Integrations:{' '} Astro,{' '} Vue.js

), /* ──────────────────────────────────────────────────────────────────────────── * 6. Nuxt * ──────────────────────────────────────────────────────────────────────────── */ 'nuxt': ( <>

Configure Pulse analytics in your nuxt.config for a framework-native setup.

Method 1: Nuxt 3

Add the Pulse script via the app.head option in your Nuxt 3 config.

{`export default defineNuxtConfig({ app: { head: { script: [ { defer: true, 'data-domain': 'your-site.com', src: 'https://pulse.ciphera.net/script.js', }, ], }, }, })`}

Method 2: Nuxt 2

In Nuxt 2, use the head property in your config.

{`export default { head: { script: [ { defer: true, 'data-domain': 'your-site.com', src: 'https://pulse.ciphera.net/script.js', }, ], }, }`}

For more details, see the{' '} Nuxt head config docs .

Related Integrations:{' '} Vue.js,{' '} Next.js,{' '} VitePress

), /* ──────────────────────────────────────────────────────────────────────────── * 7. Remix * ──────────────────────────────────────────────────────────────────────────── */ 'remix': ( <>

Add the Pulse script to your app/root.tsx so it's included on every route.

Add script to app/root.tsx

The root route is the top-level layout in Remix. Add the Pulse script inside the <head> section.

{`import { Links, Meta, Outlet, Scripts, ScrollRestoration, } from '@remix-run/react' export default function App() { return ( {title} `}

If you're using Astro's View Transitions, the script will persist across navigations by default since it's in the{' '} <head>.

For more details, see the{' '} Astro scripts docs .

Related Integrations:{' '} Svelte,{' '} Hugo,{' '} Eleventy

), /* ──────────────────────────────────────────────────────────────────────────── * 9. Solid.js * ──────────────────────────────────────────────────────────────────────────── */ 'solidjs': ( <>

Add the Pulse script to your index.html like any Vite-based project.

Add the Pulse script to index.html

Solid.js uses Vite under the hood, so simply add the Pulse script to your HTML entry file.

{` My Solid App
`}

Related Integrations:{' '} React,{' '} Qwik,{' '} Preact

), /* ──────────────────────────────────────────────────────────────────────────── * 10. Qwik * ──────────────────────────────────────────────────────────────────────────── */ 'qwik': ( <>

Add the Pulse script to your root entry component so it loads on every page.

Add to src/root.tsx

In Qwik, add the Pulse script to the <head> section of your root component.

{`import { component$ } from '@builder.io/qwik' import { QwikCityProvider, RouterOutlet } from '@builder.io/qwik-city' export default component$(() => { return ( My Preact App
`}

Related Integrations:{' '} React,{' '} Solid.js

), /* ──────────────────────────────────────────────────────────────────────────── * 12. HTMX * ──────────────────────────────────────────────────────────────────────────── */ 'htmx': ( <>

Since HTMX is used with server-rendered HTML, add the Pulse script to your server's base template.

Add to your base HTML template

HTMX works with any backend — Django, Flask, Laravel, Rails, Express, and more. Add the Pulse script to whichever base template your server renders.

{` My HTMX App `}

See the backend-specific guides for template syntax details:{' '} Django,{' '} Flask,{' '} Laravel,{' '} Rails,{' '} Express.

), /* ──────────────────────────────────────────────────────────────────────────── * 13. Ember.js * ──────────────────────────────────────────────────────────────────────────── */ 'ember': ( <>

Add the Pulse script to your app/index.html.

Add the Pulse script to index.html

Ember uses app/index.html as its entry point. Add the script inside the <head> tag.

{` My Ember App {{content-for "head"}} {{content-for "body"}} `}

For more details, see the{' '} Ember docs .

Related Integrations:{' '} React,{' '} Angular

), /* ──────────────────────────────────────────────────────────────────────────── * 14. Laravel * ──────────────────────────────────────────────────────────────────────────── */ 'laravel': ( <>

Add the Pulse script to your Blade layout template with a production guard.

Add to your Blade layout

Use Laravel's @production directive to only load the script in production.

{` @production @endproduction @yield('title') @vite(['resources/css/app.css', 'resources/js/app.js']) @yield('content') `}

For more details, see the{' '} Laravel @production docs .

Related Integrations:{' '} Django,{' '} Rails,{' '} WordPress

), /* ──────────────────────────────────────────────────────────────────────────── * 15. Django * ──────────────────────────────────────────────────────────────────────────── */ 'django': ( <>

Add the Pulse script to your base template with a debug guard.

Add to your base template

Use Django's template tags to only load the script when{' '} DEBUG is False.

{` {% if not debug %} {% endif %} {% block title %}My Django App{% endblock %} {% block content %}{% endblock %} `}

Make sure to pass debug to the template context via{' '} settings.DEBUG, or use a context processor to make it available globally.

For more details, see the{' '} Django template docs .

Related Integrations:{' '} Flask,{' '} Laravel,{' '} HTMX

), /* ──────────────────────────────────────────────────────────────────────────── * 16. Ruby on Rails * ──────────────────────────────────────────────────────────────────────────── */ 'rails': ( <>

Add the Pulse script to your application layout with a production environment guard.

Add to your application layout

Use an if guard to only load the script in production.

{` <% if Rails.env.production? %> <% end %> <%= yield(:title) || "My Rails App" %> <%= csrf_meta_tags %> <%= stylesheet_link_tag "application" %> <%= yield %> `}

For more details, see the{' '} Rails layout docs .

Related Integrations:{' '} Laravel,{' '} Django,{' '} Jekyll

), /* ──────────────────────────────────────────────────────────────────────────── * 17. Flask * ──────────────────────────────────────────────────────────────────────────── */ 'flask': ( <>

Add the Pulse script to your Jinja2 base template with a debug guard.

Add to your base template

Use Jinja2's conditional to only load the script when{' '} DEBUG is off.

{` {% if not config.DEBUG %} {% endif %} {% block title %}My Flask App{% endblock %} {% block content %}{% endblock %} `}

For more details, see the{' '} Flask template docs .

Related Integrations:{' '} Django,{' '} HTMX,{' '} Express

), /* ──────────────────────────────────────────────────────────────────────────── * 18. Express * ──────────────────────────────────────────────────────────────────────────── */ 'express': ( <>

Add the Pulse script to your template engine's layout (EJS, Pug, Handlebars) or serve it via static HTML.

Method 1: EJS template

If you use EJS as your template engine, add the script to your layout with a production guard.

{` <% if (process.env.NODE_ENV === 'production') { %> <% } %> <%= title %> <%- body %> `}

Method 2: Static HTML

If you serve static HTML files via Express, add the script directly.

{` My Express App

Hello World

`}

Related Integrations:{' '} Flask,{' '} Next.js,{' '} React

), /* ──────────────────────────────────────────────────────────────────────────── * 19. Gatsby * ──────────────────────────────────────────────────────────────────────────── */ 'gatsby': ( <>

Use the Gatsby SSR API or the Gatsby Head API to add Pulse to your site.

Method 1: gatsby-ssr.js

Use the onRenderBody hook to inject the Pulse script into every page's <head>.

{`import React from "react" export const onRenderBody = ({ setHeadComponents }) => { setHeadComponents([ {{ end }}`}

Method 2: Include the partial in your base layout

Add the partial to your baseof.html layout.

{` {{ partial "analytics.html" . }} {{ .Title }} {{ block "main" . }}{{ end }} `}

For more details, see the{' '} Hugo partials docs .

Related Integrations:{' '} Jekyll,{' '} Eleventy,{' '} Astro

), /* ──────────────────────────────────────────────────────────────────────────── * 21. Eleventy * ──────────────────────────────────────────────────────────────────────────── */ 'eleventy': ( <>

Add the Pulse script to your base Nunjucks or Liquid layout.

Add to your base layout

Place the Pulse script inside the <head> of your shared base template.

{` {{ title }} {{ content | safe }} `}

For more details, see the{' '} Eleventy layouts docs .

Related Integrations:{' '} Hugo,{' '} Jekyll,{' '} Astro

), /* ──────────────────────────────────────────────────────────────────────────── * 22. Jekyll * ──────────────────────────────────────────────────────────────────────────── */ 'jekyll': ( <>

Add the Pulse script to your default layout or an _includes{' '} partial.

Method 1: Create an analytics include

Create a reusable include with a production environment guard.

{`{% if jekyll.environment == "production" %} {% endif %}`}

Method 2: Include in your default layout

Reference the include in your default layout's{' '} <head>.

{` {% include analytics.html %} {{ page.title }} {{ content }} `}

For more details, see the{' '} Jekyll includes docs .

Related Integrations:{' '} Hugo,{' '} Eleventy,{' '} GitHub Pages

), /* ──────────────────────────────────────────────────────────────────────────── * 23. Docusaurus * ──────────────────────────────────────────────────────────────────────────── */ 'docusaurus': ( <>

Add the Pulse script via the scripts array in your Docusaurus config.

Configure in docusaurus.config.js

Docusaurus supports a scripts config option that injects script tags into every page.

{`module.exports = { scripts: [ { src: 'https://pulse.ciphera.net/script.js', defer: true, 'data-domain': 'your-site.com', }, ], // ... rest of config }`}

For more details, see the{' '} Docusaurus scripts config docs .

Related Integrations:{' '} VitePress,{' '} MkDocs,{' '} Gatsby

), /* ──────────────────────────────────────────────────────────────────────────── * 24. VitePress * ──────────────────────────────────────────────────────────────────────────── */ 'vitepress': ( <>

Add the Pulse script via VitePress's head config option.

Configure in .vitepress/config.ts

VitePress lets you inject tags into the <head> of every page via the head array.

{`import { defineConfig } from 'vitepress' export default defineConfig({ head: [ [ 'script', { defer: '', 'data-domain': 'your-site.com', src: 'https://pulse.ciphera.net/script.js', }, ], ], })`}

For more details, see the{' '} VitePress head config docs .

Related Integrations:{' '} Docusaurus,{' '} Vue.js,{' '} Nuxt

), /* ──────────────────────────────────────────────────────────────────────────── * 25. Hexo * ──────────────────────────────────────────────────────────────────────────── */ 'hexo': ( <>

Add the Pulse script to your Hexo theme's layout file.

Edit your theme's layout

Open the layout file for your active theme and add the Pulse script inside the <head>.

{` <%= config.title %> <%- css('css/style') %> <%- body %> <%- js('js/script') %> `}

Alternatively, you can use Hexo's after_render filter to inject the script programmatically.

For more details, see the{' '} Hexo templates docs .

Related Integrations:{' '} Hugo,{' '} Jekyll,{' '} Eleventy

), /* ──────────────────────────────────────────────────────────────────────────── * 26. MkDocs * ──────────────────────────────────────────────────────────────────────────── */ 'mkdocs': ( <>

Add the Pulse script to your MkDocs site using a custom template override.

Step 1: Create a custom template override

To include the data-domain attribute, create a template override file.

{`{% extends "base.html" %} {% block extrahead %} {% endblock %}`}

Step 2: Configure mkdocs.yml

Set the custom_dir to your overrides folder in your MkDocs configuration.

{`theme: name: material custom_dir: overrides`}

For more details, see the{' '} MkDocs customization docs .

Related Integrations:{' '} Docusaurus,{' '} VitePress,{' '} Django

), /* ──────────────────────────────────────────────────────────────────────────── * 27. WordPress * ──────────────────────────────────────────────────────────────────────────── */ 'wordpress': ( <>

Add the Pulse script via a plugin or by editing your theme's header file directly.

Method 1: Using a plugin (Recommended)

The easiest way is to use the{' '} WPCode (Insert Headers and Footers) {' '} plugin. Install it, then go to Code Snippets → Header & Footer{' '} and paste the Pulse script into the Header section.

{``}

Method 2: Edit header.php directly

Go to Appearance → Theme File Editor and edit{' '} header.php. Add the Pulse script before the closing{' '} </head> tag.

Related Integrations:{' '} Ghost,{' '} Drupal,{' '} WooCommerce

), /* ──────────────────────────────────────────────────────────────────────────── * 28. Ghost * ──────────────────────────────────────────────────────────────────────────── */ 'ghost': ( <>

Use Ghost's built-in Code Injection feature to add the Pulse script — no theme editing required.

Add via Code Injection

Go to Settings → Code injection → Site Header{' '} and paste the Pulse script.

{``}

Alternatively, you can add the script directly to your theme's{' '} default.hbs template file.

For more details, see the{' '} Ghost themes docs .

Related Integrations:{' '} WordPress,{' '} Blogger

), /* ──────────────────────────────────────────────────────────────────────────── * 29. Drupal * ──────────────────────────────────────────────────────────────────────────── */ 'drupal': ( <>

Add the Pulse script via a contributed module or by editing your theme's Twig template.

Method 1: Using Asset Injector module

Install the{' '} Asset Injector {' '} module and create a new JS injector with the Pulse script. Set it to load on all pages in the header region.

Method 2: Edit html.html.twig

Add the script directly to your theme's{' '} html.html.twig template in the head area.

{` {{ head_title|safe_join(' | ') }} {{ page_top }} {{ page }} {{ page_bottom }} `}

For more details, see the{' '} Drupal theming docs .

Related Integrations:{' '} WordPress,{' '} Joomla

), /* ──────────────────────────────────────────────────────────────────────────── * 30. Joomla * ──────────────────────────────────────────────────────────────────────────── */ 'joomla': ( <>

Add the Pulse script via your Joomla template or a custom HTML module.

Method 1: Edit template index.php

Go to Extensions → Templates → Your Template{' '} and edit index.php. Add the Pulse script before the closing </head> tag.

{` `}

Method 2: Custom HTML module

Create a “Custom HTML” module and assign it to the head position of your template. Paste the Pulse script as the content.

For more details, see the{' '} Joomla template docs .

Related Integrations:{' '} WordPress,{' '} Drupal

), /* ──────────────────────────────────────────────────────────────────────────── * 31. Strapi * ──────────────────────────────────────────────────────────────────────────── */ 'strapi': ( <>

Strapi is a headless CMS — add Pulse to the frontend{' '} that consumes your Strapi API, not to Strapi itself.

Where to add the script

Since Strapi is an API-only backend, the analytics script belongs in your frontend application. Follow the guide for whichever framework you're using to render your Strapi content:

Related Integrations:{' '} Contentful,{' '} Sanity,{' '} Next.js

), /* ──────────────────────────────────────────────────────────────────────────── * 32. Sanity * ──────────────────────────────────────────────────────────────────────────── */ 'sanity': ( <>

Sanity is a headless CMS — add Pulse to the frontend{' '} that renders your Sanity content, not to Sanity Studio.

Where to add the script

Since Sanity is a headless content platform, the analytics script belongs in your frontend application. Follow the guide for whichever framework you're using:

Related Integrations:{' '} Strapi,{' '} Contentful,{' '} Next.js

), /* ──────────────────────────────────────────────────────────────────────────── * 33. Contentful * ──────────────────────────────────────────────────────────────────────────── */ 'contentful': ( <>

Contentful is a headless CMS — add Pulse to the{' '} frontend that displays your Contentful content.

Where to add the script

Since Contentful is an API-first content platform, the analytics script belongs in your frontend application. Follow the guide for your framework:

Related Integrations:{' '} Strapi,{' '} Sanity,{' '} Next.js

), /* ──────────────────────────────────────────────────────────────────────────── * 34. Payload CMS * ──────────────────────────────────────────────────────────────────────────── */ 'payload': ( <>

Payload CMS is a headless CMS — add Pulse to the{' '} frontend application that renders your content.

Where to add the script

Since Payload is a headless CMS, the analytics script belongs in your frontend. Payload is most commonly used with Next.js, so the{' '} Next.js guide{' '} is the best starting point.

Related Integrations:{' '} Strapi,{' '} Contentful,{' '} Next.js

), /* ──────────────────────────────────────────────────────────────────────────── * 35. Shopify * ──────────────────────────────────────────────────────────────────────────── */ 'shopify': ( <>

Add the Pulse script via the Shopify theme editor — no app needed.

Method 1: Edit theme code

Go to Online Store → Themes → Edit code and open layout/theme.liquid. Add the Pulse script before the closing </head> tag.

{` `}

Method 2: Shopify Plus — Customer Events

If you're on Shopify Plus, you can add the Pulse script via{' '} Settings → Customer Events → Custom Pixels.

Use your custom domain or .myshopify.com domain as the{' '} data-domain value.

For more details, see the{' '} Shopify theme docs .

Related Integrations:{' '} WooCommerce,{' '} BigCommerce,{' '} PrestaShop

), /* ──────────────────────────────────────────────────────────────────────────── * 36. WooCommerce * ──────────────────────────────────────────────────────────────────────────── */ 'woocommerce': ( <>

WooCommerce runs on WordPress. Use WordPress methods to add the Pulse script.

Method 1: Using a plugin (Recommended)

Install the{' '} WPCode plugin {' '} and paste the Pulse script into the Header section.

{``}

Method 2: Edit header.php

Go to Appearance → Theme File Editor and add the Pulse script to your theme's header.php before{' '} </head>.

Use the same domain you track your main WordPress site with.

For the full WordPress setup, see the{' '} WordPress guide.

Related Integrations:{' '} Shopify,{' '} WordPress,{' '} BigCommerce

), /* ──────────────────────────────────────────────────────────────────────────── * 37. BigCommerce * ──────────────────────────────────────────────────────────────────────────── */ 'bigcommerce': ( <>

Add the Pulse script via BigCommerce's Script Manager.

Add via Script Manager

Go to Storefront → Script Manager → Create a Script{' '} and configure it as follows:

{``}

For more details, see the{' '} BigCommerce Script Manager docs .

Related Integrations:{' '} Shopify,{' '} WooCommerce,{' '} PrestaShop

), /* ──────────────────────────────────────────────────────────────────────────── * 38. PrestaShop * ──────────────────────────────────────────────────────────────────────────── */ 'prestashop': ( <>

Add the Pulse script to your PrestaShop theme template.

Edit your theme's head template

Open the head partial for your active theme and add the Pulse script.

{`{block name='head_seo'} {$page.meta.title} {/block} {block name='head_stylesheets'} {include file='_partials/stylesheets.tpl'} {/block}`}

For more details, see the{' '} PrestaShop theme docs .

Related Integrations:{' '} Shopify,{' '} WooCommerce,{' '} BigCommerce

), /* ──────────────────────────────────────────────────────────────────────────── * 39. Webflow * ──────────────────────────────────────────────────────────────────────────── */ 'webflow': ( <>

Paste the Pulse script into your Webflow project's custom code settings.

Add via Project Settings

Go to Project Settings → Custom Code → Head Code{' '} and paste the Pulse script.

{``}

Note: Custom code requires a paid Webflow site plan. The script won't appear in the Designer preview — publish your site to see it in action.

For more details, see the{' '} Webflow custom code docs .

Related Integrations:{' '} Squarespace,{' '} Wix,{' '} Framer

), /* ──────────────────────────────────────────────────────────────────────────── * 40. Squarespace * ──────────────────────────────────────────────────────────────────────────── */ 'squarespace': ( <>

Use Squarespace's Code Injection feature to add the Pulse script.

Add via Code Injection

Go to Settings → Developer Tools → Code Injection → Header{' '} and paste the Pulse script.

{``}

Note: Code Injection requires a Business or Commerce plan.

For more details, see the{' '} Squarespace code injection docs .

Related Integrations:{' '} Webflow,{' '} Wix,{' '} Carrd

), /* ──────────────────────────────────────────────────────────────────────────── * 41. Wix * ──────────────────────────────────────────────────────────────────────────── */ 'wix': ( <>

Use Wix's Custom Code settings to add the Pulse script.

Add via Custom Code

Go to Settings → Custom Code → Add Custom Code. Set the placement to Head and apply it to{' '} All pages.

{``}

Note: Custom Code requires a Wix Premium plan.

For more details, see the{' '} Wix custom code docs .

Related Integrations:{' '} Webflow,{' '} Squarespace,{' '} Framer

), /* ──────────────────────────────────────────────────────────────────────────── * 42. Framer * ──────────────────────────────────────────────────────────────────────────── */ 'framer': ( <>

Add the Pulse script to your Framer project's custom code settings.

Add via Project Settings

Go to Project Settings → General → Custom Code → Head{' '} and paste the Pulse script.

{``}

For more details, see the{' '} Framer custom code docs .

Related Integrations:{' '} Webflow,{' '} Squarespace,{' '} Wix

), /* ──────────────────────────────────────────────────────────────────────────── * 43. Carrd * ──────────────────────────────────────────────────────────────────────────── */ 'carrd': ( <>

Add the Pulse script to your Carrd site's head code section.

Add via Settings

Open your site's Settings panel and navigate to the{' '} Head section. Paste the Pulse script there.

{``}

Note: Custom code requires a Carrd Pro plan.

For more details, see the{' '} Carrd head settings docs .

Related Integrations:{' '} Framer,{' '} Webflow

), /* ──────────────────────────────────────────────────────────────────────────── * 44. Blogger * ──────────────────────────────────────────────────────────────────────────── */ 'blogger': ( <>

Add the Pulse script via Blogger's Theme HTML editor.

Edit your theme HTML

Go to Theme → Edit HTML and paste the Pulse script before the closing </head> tag.

{` `}

For more details, see the{' '} Blogger HTML editing docs .

Related Integrations:{' '} WordPress,{' '} Ghost

), /* ──────────────────────────────────────────────────────────────────────────── * 45. Google Tag Manager * ──────────────────────────────────────────────────────────────────────────── */ 'gtm': ( <>

Add Pulse via Google Tag Manager — works with any site that already has GTM installed.

Create a Custom HTML tag

Follow these steps to add Pulse through GTM:

  1. Go to Tags → New → Custom HTML
  2. Paste the Pulse script
  3. Set the trigger to All Pages
  4. Publish your container
{``}

For more details, see the{' '} GTM Custom HTML tag docs .

Related Integrations:{' '} WordPress,{' '} Shopify,{' '} Webflow

), /* ──────────────────────────────────────────────────────────────────────────── * 46. Notion * ──────────────────────────────────────────────────────────────────────────── */ 'notion': ( <>

Notion itself doesn't support custom scripts, but tools like{' '} Super.so,{' '} Potion, and{' '} Feather{' '} let you turn Notion pages into websites with custom code support.

Super.so

Go to Site Settings → Code → Head and paste the Pulse script.

{``}

Potion

Go to Project Settings → Custom Code → Head{' '} and paste the Pulse script.

For more details, see the{' '} Super.so docs .

Related Integrations:{' '} Webflow,{' '} Framer,{' '} Carrd

), /* ──────────────────────────────────────────────────────────────────────────── * 47. Cloudflare Pages * ──────────────────────────────────────────────────────────────────────────── */ 'cloudflare-pages': ( <>

Add Pulse to your project's HTML or follow your framework's guide.

Method 1: Framework-based setup (Recommended)

If you're deploying a framework (Next.js, Astro, Nuxt, etc.) to Cloudflare Pages, follow that framework's integration guide:

Method 2: Static HTML

For static HTML sites, add the Pulse script directly to your{' '} index.html.

{` My Site

Hello World

`}

For more details, see the{' '} Cloudflare Pages docs .

Related Integrations:{' '} Netlify,{' '} Vercel,{' '} GitHub Pages

), /* ──────────────────────────────────────────────────────────────────────────── * 48. Netlify * ──────────────────────────────────────────────────────────────────────────── */ 'netlify': ( <>

Add Pulse via your framework's setup or Netlify's snippet injection feature.

Method 1: Framework guide (Recommended)

The best approach is to follow your framework's integration guide. Netlify deploys framework projects, so the script setup happens in your source code:

Method 2: Snippet injection (via Netlify UI)

Go to Site settings → Build & deploy → Post processing → Snippet injection{' '} and add the Pulse script to the <head> of your pages.

{``}

For more details, see the{' '} Netlify snippet injection docs .

Related Integrations:{' '} Cloudflare Pages,{' '} Vercel,{' '} GitHub Pages

), /* ──────────────────────────────────────────────────────────────────────────── * 49. Vercel * ──────────────────────────────────────────────────────────────────────────── */ 'vercel': ( <>

Add Pulse via your framework's setup. Vercel deploys framework projects, so the script is added in your source code.

Follow your framework's guide

Vercel is a deployment platform — it doesn't have a built-in mechanism for injecting scripts. Add the Pulse script following your framework's integration guide:

Note: Vercel's Edge Middleware cannot inject scripts by design. Use the framework-level approach instead.

For more details, see the{' '} Vercel frameworks docs .

Related Integrations:{' '} Netlify,{' '} Cloudflare Pages,{' '} Next.js

), /* ──────────────────────────────────────────────────────────────────────────── * 50. GitHub Pages * ──────────────────────────────────────────────────────────────────────────── */ 'github-pages': ( <>

Add the Pulse script to your static site's HTML template on GitHub Pages.

Method 1: Jekyll (default for GitHub Pages)

Create an analytics include with a production guard and reference it in your default layout.

{`{% if jekyll.environment == "production" %} {% endif %}`}

Then include it in your layout's <head>:

{` {% include analytics.html %} {{ page.title }} {{ content }} `}

Method 2: Plain HTML

For simple static sites, add the Pulse script directly to your{' '} index.html.

{` My Site

Hello World

`}

Method 3: Hugo on GitHub Pages

If you're using Hugo with GitHub Pages, follow the{' '} Hugo guide.

For more details, see the{' '} GitHub Pages docs .

Related Integrations:{' '} Jekyll,{' '} Hugo,{' '} Netlify

), } // * ─── Public API ───────────────────────────────────────────────────────────── export function getGuideContent(slug: string): ReactNode | undefined { return guides[slug] }