AgenCMS

Code snippets

Code snippets let you inject your own scripts, styles, and markup into your public website without touching theme files. Use them for analytics tags, chat widgets, tracking pixels, custom CSS tweaks, or structured data.

Open the snippet manager

  1. Go to your website workspace from the dashboard.
  2. In the sidebar, open Custom Code.

You land on the Custom code list at /dashboard/websites/{website}/code-snippets. It shows every snippet with its type, placement, scope, and an Active toggle.

Add a snippet

  1. Select New snippet.
  2. Enter a Name so you can recognize it later (for example, "Google Analytics" or "Header CSS").
  3. Pick a Snippet type:
    • Script for JavaScript.
    • HTML for raw markup.
    • CSS for styles.
    • JSON LD for structured data.
  4. Add an optional Description.
  5. Paste your code into the Snippet content editor. It highlights syntax based on the type you chose.
  6. Select Save snippet.

You do not need to wrap CSS in <style> tags or JSON-LD in <script> tags. agencms wraps the content for you when it renders the snippet. For an inline script, paste only the JavaScript; for HTML, paste the markup as-is.

Choose where it loads

The Placement field controls where the snippet appears in the page:

  • Head — inside <head>. Use this for styles, meta tags, and most analytics tags.
  • Body start — right after the opening <body> tag.
  • Body end — just before the closing </body> tag. This is the footer position and is best for scripts that should load last.

JSON-LD snippets always render in the head, so the placement option is locked for that type.

Load external scripts

For a Script snippet, you can load a file from another domain instead of pasting inline code. Fill in the External script URL field (for example, a vendor's CDN link) and leave the content empty. A script snippet needs either inline code or an external URL.

Use Load strategy to control how external scripts load:

  • Default — normal blocking load.
  • Async — loads in parallel and runs as soon as it is ready.
  • Defer — loads in parallel and runs after the page is parsed.

External URLs and load strategies apply only to Script snippets.

Control where and when it runs

By default a snippet runs Sitewide. To limit it, change the Scope:

  • Only these paths (include) — runs only on the listed paths.
  • Everywhere except these paths (exclude) — runs everywhere but the listed paths.

When scope is limited you can target pages two ways:

  • Internal links — pick real pages, posts, archives, categories, or tags. These stay linked to the actual content even if a slug changes.
  • Path rules — type one path per line. Wildcards work, for example /blog/*. Use this for advanced patterns.

Use Environment to decide where the snippet is allowed to run:

  • All — production and preview.
  • Production only — your live site.
  • Preview only — preview builds.

Load order sets the sequence when several snippets share a placement. Lower numbers load first.

Enable, disable, and archive

  • Toggle a snippet on or off from the Active switch in the list, or with Snippet active on the edit form. A disabled snippet stays saved but stops rendering.
  • To remove a snippet, use the archive action in the list. Archiving stops it from rendering but keeps its record in the database, so it is not a hard delete.

Edit a snippet

Select a snippet name in the list to open its edit page at /dashboard/websites/{website}/code-snippets/{id}/edit. Change any field and select Save snippet. Changes apply to your public site right away.

Related: Themes overview and Website settings.