Code Snippets
Named blocks of HTML, CSS, or JavaScript injected into your site when it builds — site-wide, or scoped by Location Rules to exactly where they belong.
What it is
A snippet is a block of code with a name, an on/off switch, and a set of Location Rules deciding where it applies. Use one for anything that isn't part of a page's own content: a search-engine verification tag, a style override, a third-party embed, or a widget Zitegen doesn't have a first-class integration for.
Snippets live in the site editor under Workspace → Code Snippets. They replaced the Integrations panel's two Custom Code textareas, which are gone — a snippet does the same injection, and adds a name, an on/off switch, and rules for where it applies.
HTML, CSS, and JavaScript
A snippet's language decides the wrapper, not the destination. CSS is emitted inside a <style> block and JavaScript inside a <script> block, so you write bare CSS or JS — the editor shows those tags greyed out above and below your code as a reminder. HTML is emitted exactly as written, so include your own tags there.
Because of that wrapping, a CSS or JS snippet containing a literal </style> or </script> is rejected when you save it: it would close the block early and break every page the snippet applies to.
Head or body
Head puts the snippet inside <head> — the right place for verification tags, CSS, and preloads. Body end puts it just before </body>, for chat widgets, tracking pixels, and anything that should load after your content.
Head snippets are emitted last in the <head>, after your site's own styles. That ordering is deliberate: it means a CSS snippet written to override an element's styling actually wins, instead of silently losing to the styles the editor generated.
Location Rules
Every snippet starts with a single Everywhere rule. Change it, or add more, to scope where the snippet is injected:
Everywhere — every page the site builds. Page — one specific page. Blog & WordPress posts — every page that renders through the blog layout: your own blog articles, and any WordPress-synced entries, which share that layout and so look the same. Content type — every entry of one custom content type. Taxonomy archive pages — the generated term listing pages for one taxonomy.
Rules are a flat or list: the snippet applies wherever any rule matches. There's no and grouping here, unlike Field Groups — a rendered page is one page of one kind, so combining two rules with and could only ever match nothing.
Creating a snippet
- 1
Open Code Snippets
In the site editor, go to Workspace → Code Snippets, then New snippet.
- 2
Write the code
On the Code tab, give it a name, pick the language and placement, and paste your code.
- 3
Choose where it applies
On the Location Rules tab, leave Everywhere for a site-wide snippet, or pick a page, your blog, a content type, or a taxonomy's archives.
- 4
Save and publish
Snippets are injected when the site builds, so publish (or preview) for the change to appear on the live site.
Previews and the Active switch
The switch on each row in the list turns a snippet on and off without opening it. An inactive snippet keeps its code and rules but is skipped by every build.
Include in previews (on the Settings tab) controls whether Preview and Development builds include the snippet. It defaults to on for CSS and off for HTML and JavaScript: a stylesheet has no side effects and needs to be visible for you to check it, while a preview view firing a real tracking pixel, webhook, or billed chat widget would pollute your production data. Turn it on for a specific snippet when you want to verify a script before publishing.
Production publishes always include every active snippet, regardless of this setting.
Snippets are part of your exported source
The built-in 404 gets your Everywhere snippets
AI agents can manage snippets too
What's next
Keep exploring
Need help?