From 855200bcbdeb998dafff821cdb26dc84e89ba02b Mon Sep 17 00:00:00 2001
From: Matt Jennings <mjenningscba@gmail.com>
Date: Tue, 8 Sep 2026 16:29:07 -0500
Subject: [PATCH] feat(publisher): site-level CSP allowlist for third-party
 script origins
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Published pages lock `script-src` to `'self'`, and nothing could lift it:
plugin `frontend.assets[]` are same-origin only and `networkAllowedHosts`
reaches `connect-src`, not `script-src`. Any site that needs a Google
Analytics / Tag Manager loader, the Meta pixel, or a chat widget therefore
ships with those tags silently blocked (#227).

Add `site.settings.csp` — an owner-controlled allowlist of exact HTTPS
origins: `scriptOrigins` union into `script-src`, `connectOrigins` union
into `connect-src` together with `'self'` (the base plan has no
`connect-src`, so creating one without `'self'` would cut same-origin
fetches off from their `default-src` fallback). Entries are validated by
`isCspOrigin` (`https://host[:port]`, optional `*.` label; never a path,
`http://`, or a CSP keyword) and `parseSiteSettings` drops invalid entries
one by one instead of failing the settings object.

The plugin relaxation pass now unions `'self'` / `'unsafe-inline'` into
`script-src` and `style-src` instead of replacing the directive, so a
plugin tracker no longer strips the importmap sha256 hash or the site
allowlist that the publisher already emitted. The write policy classifies
`settings.csp` as structural.

Editing surface: Settings → Publishing → Content Security Policy, two
textareas (one origin per line, commit on blur, invalid lines reported
field-locally and never persisted).

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 docs/editor.md                                |   2 +-
 docs/features/plugin-system.md                |   2 +-
 docs/features/publisher.md                    |   3 +
 docs/features/site-shell.md                   |   3 +
 server/publish/frontendInjections.ts          |  13 +-
 server/writePolicy/siteDiff.ts                |   3 +-
 src/__tests__/page-tree/siteSettings.test.ts  | 117 ++++++++++++++++++
 src/__tests__/publisher/cspPlan.test.ts       |  69 +++++++++++
 .../publisher/frontendInjections.test.ts      |  20 +++
 .../settings/settingsSections.test.tsx        |  56 +++++++++
 .../modals/Settings/SettingsModal.module.css  |  18 +++
 .../Settings/sections/PublishingSection.tsx   |  94 +++++++++++++-
 src/core/page-tree/index.ts                   |  11 +-
 src/core/page-tree/siteSettings.ts            |  77 ++++++++++++
 src/core/publisher/render.ts                  |  25 +++-
 15 files changed, 502 insertions(+), 11 deletions(-)
 create mode 100644 src/__tests__/page-tree/siteSettings.test.ts

diff --git a/docs/editor.md b/docs/editor.md
index 2de45ee41..dea3d6183 100644
--- a/docs/editor.md
+++ b/docs/editor.md
@@ -609,7 +609,7 @@ The sidebar shell expands/collapses by animating `--*-panel-width`. The panel sl
 |---------------|------------------------------------------------------------------------------|
 | General       | Site name, meta title, meta description, language, favicon                   |
 | Shortcuts     | Auto-rendered keyboard shortcut reference from the keybindings registry       |
-| Publishing    | Self-hosted runtime info + framework CSS tree-shaking toggle                 |
+| Publishing    | Self-hosted runtime info, framework CSS tree-shaking toggle, published-page CSP allowlist (`settings.csp`) |
 | Preferences   | Catalog-driven editor preferences (auto-rendered from `PREFERENCE_CATALOG`)  |
 
 Site-specific controls that were previously sections of this modal (Pages roster, Breakpoints/Viewports, Conditions) now live in their dedicated surfaces: the Site Explorer panel and `CanvasContextSelector` (unified condition axis).
diff --git a/docs/features/plugin-system.md b/docs/features/plugin-system.md
index 62f161280..09fc75547 100644
--- a/docs/features/plugin-system.md
+++ b/docs/features/plugin-system.md
@@ -624,7 +624,7 @@ Supported `kind` values are `script`, `script-inline`, `style`, `style-inline`,
 
 `attrs` passes through to the emitted tag except where `server/publish/frontendInjections.ts` owns the value: `data-plugin-id` on every tag, `src` on every script, strategy attributes on external scripts, and `href` plus `rel` on stylesheet assets. Bare `link` and `meta` declarations rely entirely on `attrs`. Inline JSON-LD uses `{ "kind": "script-inline", "attrs": { "type": "application/ld+json" }, "content": "..." }`.
 
-The injection pipeline derives CSP changes from the plan. Inline scripts/styles add the matching `'unsafe-inline'` directive. `networkAllowedHosts[]` contributes published-page `connect-src` origins for plugins with frontend assets, which is why frontend trackers that call their own or third-party ingest endpoints must list those hosts as well as declare `frontend.assets`.
+The injection pipeline derives CSP changes from the plan. Inline scripts/styles add the matching `'unsafe-inline'` directive. `networkAllowedHosts[]` contributes published-page `connect-src` origins for plugins with frontend assets, which is why frontend trackers that call their own or third-party ingest endpoints must list those hosts as well as declare `frontend.assets`. No manifest field adds a host to `script-src`: a plugin cannot load a remote third-party script. That is a site-owner decision, made in Settings → Publishing → Content Security Policy (`site.settings.csp`, see [publisher.md](publisher.md) → "CSP").
 
 ### Settings — declared in `instatic-plugin.config.ts` / `plugin.json`
 
diff --git a/docs/features/publisher.md b/docs/features/publisher.md
index f7efd7b6a..f96769b11 100644
--- a/docs/features/publisher.md
+++ b/docs/features/publisher.md
@@ -364,6 +364,9 @@ The CSP is modelled as **data**, not a string assembled with regex. `src/core/pu
   - `media-src` deliberately mirrors `img-src`. Both govern passive references that execute nothing, so allowing a remote image while blocking a remote `<video>` would be an arbitrary line. It has to be stated explicitly: an unset `media-src` falls back to `default-src 'self'`, and the only symptom is a video that silently never loads.
 - The server injection pipeline (`server/publish/frontendInjections.ts`) merges plugin `frontend.assets[]` relaxations + elected media-adapter origins into the plan in **one** pass via `rewriteCspMeta` — no second regex pass, no per-directive `RegExp`.
 - The module-JS injector (`injectModuleScripts` in `server/publish/moduleJsBundle.ts`) merges `script-src 'self'` through the same `rewriteCspMeta` helper — only when at least one `/_instatic/module-js/<moduleId>.js` script tag was injected.
+- **Site allowlist — `site.settings.csp`** (`SiteCspSettings` in `src/core/page-tree/siteSettings.ts`). The only sanctioned way to let a *third-party* script origin through. `scriptOrigins` union into `script-src`; `connectOrigins` union into `connect-src` together with `'self'` (the base plan has no `connect-src`, so creating one without `'self'` would cut same-origin fetches for forms, holes and loops off from their `default-src` fallback). Entries are exact HTTPS host sources — `https://host[:port]`, optionally `https://*.host` — validated by `isCspOrigin`; `parseSiteSettings` drops anything else entry-by-entry. Edited in Settings → Publishing → Content Security Policy. Typical use: a runtime script that injects `https://www.googletagmanager.com/gtag/js` needs that origin in `scriptOrigins` and `https://*.google-analytics.com` in `connectOrigins`; the Meta pixel needs `https://connect.facebook.net` in `scriptOrigins` (its beacons are `<img>` requests, already covered by `img-src https:`).
+
+Every downstream stage **unions** into the plan (`addCspSources`); only directives a stage fully owns (`worker-src`) are replaced. A plugin tracker's `script-src 'self'` relaxation therefore keeps the importmap `sha256` hash and the site allowlist next to it.
 
 Because `serializeCsp` sorts, the same plugins + adapters always emit a **byte-identical** policy across runs (gated by `src/__tests__/publisher/cspPlan.test.ts`) — important for content-hashing and stable tests. Editing the emitted CSP string manually is **not** safe — it's a derived value. Mutate the plan (`setCspDirective` to replace, `addCspSources` to union) and re-serialize.
 
diff --git a/docs/features/site-shell.md b/docs/features/site-shell.md
index 512b056ca..eb64db963 100644
--- a/docs/features/site-shell.md
+++ b/docs/features/site-shell.md
@@ -127,10 +127,13 @@ type SiteSettings = {
   language?:        string
   framework?:       FrameworkSettings       // colors, typography, spacing, preferences — absent when disabled
   fonts?:           SiteFontsSettings       // installed font library + editable font tokens
+  csp?:             SiteCspSettings         // third-party origins allowed by the published-page CSP
   shortcuts:        Record<string, string>  // keyboard shortcut overrides
 }
 ```
 
+`csp` is the published-page Content-Security-Policy allowlist: `scriptOrigins` (unioned into `script-src`) and `connectOrigins` (unioned into `connect-src`), each a list of exact `https://` host sources (a leading `*.` wildcard label is allowed; paths, `http://` and CSP keywords are not — `isCspOrigin` is the gate, `parseCspOriginList` the normalizer). Absent when empty; the write policy treats it as a structural setting. How the publisher applies it: [docs/features/publisher.md](publisher.md) → "CSP".
+
 `framework` holds the structured design token system (`src/core/framework/`). When present it carries:
 - `colors.tokens` — `FrameworkColorToken[]`, each with a slug (becomes a CSS var like `--primary`), light/dark values, utility generation flags (text/background/border/fill), shade/tint variant counts. Slugs are normalized by `normalizeFrameworkColorSlug` (trim, lowercase, strip leading `--`, replace non-alphanumeric runs with `-`). When two tokens normalize to the same root slug, the second receives a `-2` suffix, the third `-3`, and so on — resolved in generation order via `buildColorSlugMap` so the earlier token keeps the base name.
 - `typography` — `FrameworkTypographySettings` with fluid scale groups, each emitting `font-size` vars + optional utility classes.
diff --git a/server/publish/frontendInjections.ts b/server/publish/frontendInjections.ts
index d0a476253..77e60be6b 100644
--- a/server/publish/frontendInjections.ts
+++ b/server/publish/frontendInjections.ts
@@ -20,7 +20,9 @@
  *        - inline style  → `style-src`  gets `'unsafe-inline'`
  *        - external script/style: no relaxation needed (same-origin / allowlisted)
  *        - plugin-declared `networkAllowedHosts` → appended to `connect-src`
- *      Pure-meta plans get no CSP changes.
+ *      Pure-meta plans get no CSP changes. Every relaxation is a union into
+ *      the publisher's plan, so sources it already emitted (importmap hash,
+ *      the site's `settings.csp` allowlist) survive.
  *
  * Pure data assembly — no DOM, no fetch. Called from a single place at the
  * dispatcher (`server/router.ts → tryServePublishedPage / tryServeContentRoute`),
@@ -383,8 +385,13 @@ function relaxCspForPlan(html: string, plan: FrontendInjections, hasTags: boolea
       //     adds `'unsafe-inline'` on top
       //   • Worker spawn from any plugin script → relax `worker-src`
       //     to `'self' blob:`
+      //
+      // These are UNIONS, not replacements: the publisher may already have
+      // put the importmap `sha256-…` hash and the site's own allowlisted
+      // third-party origins (`settings.csp.scriptOrigins`) into `script-src`,
+      // and a plugin shipping a tracker must not silently strip them.
       if (plan.hasExternalScript || plan.hasInlineScript) {
-        setCspDirective(
+        addCspSources(
           csp,
           'script-src',
           plan.hasInlineScript ? ["'self'", "'unsafe-inline'"] : ["'self'"],
@@ -394,7 +401,7 @@ function relaxCspForPlan(html: string, plan: FrontendInjections, hasTags: boolea
 
       // Style: relax to `'unsafe-inline'` only when an inline style is present.
       if (plan.hasInlineStyle) {
-        setCspDirective(csp, 'style-src', ["'self'", "'unsafe-inline'"])
+        addCspSources(csp, 'style-src', ["'self'", "'unsafe-inline'"])
       }
 
       // Connect: union per-plugin `networkAllowedHosts`, plus the standard
diff --git a/server/writePolicy/siteDiff.ts b/server/writePolicy/siteDiff.ts
index 0f2c6fc63..dbbab19f1 100644
--- a/server/writePolicy/siteDiff.ts
+++ b/server/writePolicy/siteDiff.ts
@@ -118,7 +118,7 @@ export function validateSiteWriteDiff(
   }
 
   // Settings — split into chromatic-style fields (framework/fonts) and
-  // structural fields (metaTitle/metaDescription/favicon/language/shortcuts).
+  // structural fields (metaTitle/metaDescription/favicon/language/shortcuts/csp).
   diffSettings(ctx, previous.settings, next.settings)
 
   // breakpoints — adding / removing / reordering is style infra.
@@ -180,6 +180,7 @@ function diffSettings(
     'faviconUrl',
     'language',
     'shortcuts',
+    'csp',
   ]
   for (const key of structuralKeys) {
     if (!deepEqual(prev[key], next[key])) {
diff --git a/src/__tests__/page-tree/siteSettings.test.ts b/src/__tests__/page-tree/siteSettings.test.ts
new file mode 100644
index 000000000..4017ae93d
--- /dev/null
+++ b/src/__tests__/page-tree/siteSettings.test.ts
@@ -0,0 +1,117 @@
+/**
+ * SiteSettings — `settings.csp` allowlist parsing and origin validation.
+ *
+ * The allowlist is the only place an owner can let a third-party script
+ * origin through the publisher's `script-src 'self'`, so what it accepts
+ * matters: exact HTTPS origins (optionally a `*.` wildcard label), never a
+ * scheme wildcard, a path, or a CSP keyword. Persisted junk is dropped
+ * entry-by-entry rather than failing the whole settings object.
+ */
+import { describe, it, expect } from 'bun:test'
+import { compiledCheck } from '@core/utils/typeboxCompiler'
+import {
+  SiteCspSettingsSchema,
+  isCspOrigin,
+  parseCspOriginList,
+  parseSiteSettings,
+} from '@core/page-tree'
+
+describe('isCspOrigin', () => {
+  it.each([
+    'https://www.googletagmanager.com',
+    'https://connect.facebook.net',
+    'https://*.google-analytics.com',
+    'https://cdn.example.co.uk:8443',
+    'https://a-b.example',
+  ])('accepts %s', (origin) => {
+    expect(isCspOrigin(origin)).toBe(true)
+  })
+
+  it.each([
+    'http://www.googletagmanager.com',
+    'https://www.googletagmanager.com/gtag/js',
+    'https://www.googletagmanager.com/',
+    'https://',
+    'https://localhost',
+    'https:',
+    "'unsafe-inline'",
+    '*',
+    'www.googletagmanager.com',
+    'https://*',
+    'https://-bad.example',
+    'https://user:pw@example.com',
+    'https://example.com?x=1',
+    ' https://example.com',
+  ])('rejects %s', (origin) => {
+    expect(isCspOrigin(origin)).toBe(false)
+  })
+})
+
+describe('parseCspOriginList', () => {
+  it('trims, drops blanks and invalid entries, and de-duplicates in first-seen order', () => {
+    expect(
+      parseCspOriginList([
+        '  https://b.example ',
+        '',
+        'http://nope.example',
+        'https://a.example',
+        'https://b.example',
+        42,
+        null,
+      ]),
+    ).toEqual(['https://b.example', 'https://a.example'])
+  })
+
+  it('returns [] for non-arrays', () => {
+    expect(parseCspOriginList(undefined)).toEqual([])
+    expect(parseCspOriginList('https://a.example')).toEqual([])
+    expect(parseCspOriginList({ 0: 'https://a.example' })).toEqual([])
+  })
+})
+
+describe('parseSiteSettings — csp', () => {
+  it('keeps a valid allowlist', () => {
+    const settings = parseSiteSettings({
+      shortcuts: {},
+      csp: {
+        scriptOrigins: ['https://www.googletagmanager.com'],
+        connectOrigins: ['https://www.google-analytics.com'],
+      },
+    })
+    expect(settings.csp).toEqual({
+      scriptOrigins: ['https://www.googletagmanager.com'],
+      connectOrigins: ['https://www.google-analytics.com'],
+    })
+    expect(compiledCheck(SiteCspSettingsSchema, settings.csp)).toBe(true)
+  })
+
+  it('drops invalid entries without failing the rest of the settings', () => {
+    const settings = parseSiteSettings({
+      metaTitle: 'Kept',
+      shortcuts: {},
+      csp: {
+        scriptOrigins: ['https://ok.example', "'unsafe-inline'", 'javascript:alert(1)'],
+        connectOrigins: 'https://not-an-array.example',
+      },
+    })
+    expect(settings.metaTitle).toBe('Kept')
+    expect(settings.csp).toEqual({ scriptOrigins: ['https://ok.example'], connectOrigins: [] })
+  })
+
+  it('omits csp entirely when nothing valid remains or the field is malformed', () => {
+    expect(parseSiteSettings({ shortcuts: {}, csp: { scriptOrigins: [], connectOrigins: [] } }).csp)
+      .toBeUndefined()
+    expect(parseSiteSettings({ shortcuts: {}, csp: ['https://a.example'] }).csp).toBeUndefined()
+    expect(parseSiteSettings({ shortcuts: {} }).csp).toBeUndefined()
+    expect('csp' in parseSiteSettings({ shortcuts: {} })).toBe(false)
+  })
+
+  it('schema rejects a raw list carrying a non-origin', () => {
+    expect(
+      compiledCheck(SiteCspSettingsSchema, {
+        scriptOrigins: ['https://ok.example', 'http://nope.example'],
+        connectOrigins: [],
+      }),
+    ).toBe(false)
+  })
+})
diff --git a/src/__tests__/publisher/cspPlan.test.ts b/src/__tests__/publisher/cspPlan.test.ts
index e9cfea458..138c67887 100644
--- a/src/__tests__/publisher/cspPlan.test.ts
+++ b/src/__tests__/publisher/cspPlan.test.ts
@@ -26,6 +26,7 @@ import {
 } from '../../../server/publish/frontendInjections'
 import { VideoModule } from '@modules/base/video'
 import { makeModule, makeRegistry, makePage, makeSite } from './helpers'
+import { DEFAULT_SITE_SETTINGS } from '@core/page-tree'
 
 describe('CspPlan — serialization is deterministic and sorted', () => {
   it('sorts directives by name and sources within each directive', () => {
@@ -261,3 +262,71 @@ describe('publishPage — CSP frame-src from module cspSources', () => {
     expect(csp).toContain('https://www.youtube-nocookie.com')
   })
 })
+
+// ---------------------------------------------------------------------------
+// publishPage — site-level CSP allowlist (`settings.csp`)
+//
+// The base policy locks `script-src` to `'self'`, which blocks every
+// third-party tag (GA / GTM loaders, the Meta pixel). Plugins cannot lift it:
+// `frontend.assets[]` is same-origin only and `networkAllowedHosts` reaches
+// `connect-src`, not `script-src`. The owner's explicit allowlist is the one
+// sanctioned way through, and it must survive the downstream plugin pass.
+// ---------------------------------------------------------------------------
+
+const ANALYTICS_CSP = {
+  scriptOrigins: ['https://www.googletagmanager.com', 'https://connect.facebook.net'],
+  connectOrigins: ['https://www.google-analytics.com', 'https://*.google-analytics.com'],
+}
+
+function siteWithCsp(csp: typeof ANALYTICS_CSP | undefined) {
+  return makeSite({
+    settings: { ...structuredClone(DEFAULT_SITE_SETTINGS), ...(csp ? { csp } : {}) },
+  })
+}
+
+describe('publishPage — CSP allowlist from settings.csp', () => {
+  const plainPage = () => makePage({ root: { moduleId: 'test.plain', props: {} } })
+  const reg = () => makeRegistry({ 'test.plain': makeModule('test.plain') })
+
+  it('unions allowlisted script origins into script-src', () => {
+    const { html } = publishPage(plainPage(), siteWithCsp(ANALYTICS_CSP), reg())
+    const csp = extractPublishedCsp(html)
+    expect(csp).toContain('script-src https://connect.facebook.net https://www.googletagmanager.com;')
+    expect(csp).not.toContain("script-src 'none'")
+  })
+
+  it("adds connect-src with 'self' so same-origin fetches keep working", () => {
+    const { html } = publishPage(plainPage(), siteWithCsp(ANALYTICS_CSP), reg())
+    const csp = extractPublishedCsp(html)
+    expect(csp).toContain(
+      "connect-src 'self' https://*.google-analytics.com https://www.google-analytics.com;",
+    )
+  })
+
+  it('leaves the policy untouched when no allowlist is set', () => {
+    const { html } = publishPage(plainPage(), siteWithCsp(undefined), reg())
+    const csp = extractPublishedCsp(html)
+    expect(csp).toContain("script-src 'none'")
+    expect(csp).not.toContain('connect-src')
+  })
+
+  it('survives the plugin relaxation pass (plugin tracker must not strip the allowlist)', () => {
+    const { html } = publishPage(plainPage(), siteWithCsp(ANALYTICS_CSP), reg())
+    const out = injectFrontendAssets(
+      html,
+      planWith({
+        hasExternalScript: true,
+        tags: {
+          head: [],
+          'head-end': [],
+          'body-start': [],
+          'body-end': ['<script src="/uploads/plugins/acme/1.0.0/t.js" defer></script>'],
+        },
+      }),
+    )
+    const csp = extractPublishedCsp(out)
+    expect(csp).toContain(
+      "script-src 'self' https://connect.facebook.net https://www.googletagmanager.com;",
+    )
+  })
+})
diff --git a/src/__tests__/publisher/frontendInjections.test.ts b/src/__tests__/publisher/frontendInjections.test.ts
index acd439084..fbf41a25a 100644
--- a/src/__tests__/publisher/frontendInjections.test.ts
+++ b/src/__tests__/publisher/frontendInjections.test.ts
@@ -23,6 +23,14 @@ import {
 } from '../../../server/publish/frontendInjections'
 import { createFakeDb } from '../server/dbTestFake'
 
+const PAGE_WITH_ALLOWLISTED_CSP = `<!doctype html>
+<html>
+<head>
+<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'sha256-IMPORTMAP' https://www.googletagmanager.com; worker-src 'none'; style-src 'self' 'unsafe-inline';">
+</head>
+<body></body>
+</html>`
+
 const PAGE_WITH_CSP_META = `<!doctype html>
 <html>
 <head>
@@ -147,6 +155,18 @@ describe('frontend injection — asset attributes', () => {
 })
 
 describe('frontend injection — CSP relaxation', () => {
+  it('unions `self` into script-src without dropping the importmap hash or site allowlist', () => {
+    const out = injectFrontendAssets(PAGE_WITH_ALLOWLISTED_CSP, {
+      ...emptyPlan(),
+      hasExternalScript: true,
+      hasInlineScript: true,
+      tags: { ...emptyPlan().tags, 'body-end': ['<script>window.t=1</script>'] },
+    })
+    expect(out).toContain(
+      "script-src 'self' 'sha256-IMPORTMAP' 'unsafe-inline' https://www.googletagmanager.com;",
+    )
+  })
+
   it('keeps script-src `none` when no plugin contributes a tag', () => {
     const out = injectFrontendAssets(PAGE_WITH_CSP_META, emptyPlan())
     expect(out).toContain("script-src 'none'")
diff --git a/src/__tests__/settings/settingsSections.test.tsx b/src/__tests__/settings/settingsSections.test.tsx
index 4e6b027a4..70d76838c 100644
--- a/src/__tests__/settings/settingsSections.test.tsx
+++ b/src/__tests__/settings/settingsSections.test.tsx
@@ -114,3 +114,59 @@ describe('PublishingSection — framework CSS output preferences', () => {
     ).toBe(false)
   })
 })
+
+describe('PublishingSection — Content Security Policy allowlist', () => {
+  function mountWithSite() {
+    const site = makeSite()
+    useEditorStore.setState({
+      site,
+      activePageId: site.pages[0].id,
+    } as Parameters<typeof useEditorStore.setState>[0])
+    render(<PublishingSection />)
+  }
+
+  it('commits one origin per line into settings.csp on blur', () => {
+    mountWithSite()
+    const scripts = screen.getByLabelText(/allowed script origins/i)
+    fireEvent.change(scripts, {
+      target: { value: 'https://www.googletagmanager.com\n\n  https://connect.facebook.net  ' },
+    })
+    fireEvent.blur(scripts)
+
+    expect(useEditorStore.getState().site!.settings.csp).toEqual({
+      scriptOrigins: ['https://www.googletagmanager.com', 'https://connect.facebook.net'],
+      connectOrigins: [],
+    })
+    expect(screen.queryByRole('alert')).toBeNull()
+  })
+
+  it('reports invalid lines next to the field and persists only the valid ones', () => {
+    mountWithSite()
+    const connect = screen.getByLabelText(/allowed connection origins/i)
+    fireEvent.change(connect, {
+      target: { value: 'https://www.google-analytics.com\nhttp://insecure.example\nnot a url' },
+    })
+    fireEvent.blur(connect)
+
+    expect(useEditorStore.getState().site!.settings.csp).toEqual({
+      scriptOrigins: [],
+      connectOrigins: ['https://www.google-analytics.com'],
+    })
+    const alert = screen.getByRole('alert')
+    expect(alert.textContent).toContain('http://insecure.example')
+    expect(alert.textContent).toContain('not a url')
+    expect(connect.getAttribute('aria-invalid')).toBe('true')
+  })
+
+  it('clears settings.csp when both lists are emptied', () => {
+    mountWithSite()
+    const scripts = screen.getByLabelText(/allowed script origins/i)
+    fireEvent.change(scripts, { target: { value: 'https://www.googletagmanager.com' } })
+    fireEvent.blur(scripts)
+    expect(useEditorStore.getState().site!.settings.csp).toBeDefined()
+
+    fireEvent.change(scripts, { target: { value: '' } })
+    fireEvent.blur(scripts)
+    expect(useEditorStore.getState().site!.settings.csp).toBeUndefined()
+  })
+})
diff --git a/src/admin/modals/Settings/SettingsModal.module.css b/src/admin/modals/Settings/SettingsModal.module.css
index e742e38e9..f42984725 100644
--- a/src/admin/modals/Settings/SettingsModal.module.css
+++ b/src/admin/modals/Settings/SettingsModal.module.css
@@ -301,6 +301,24 @@
 }
 
 /* ── PublishingSection ───────────────────────────────────────────────────── */
+.fieldHint {
+  font-size: var(--text-s);
+  color: var(--text-subtle);
+  margin: 0 0 var(--space-l);
+  line-height: 1.5;
+}
+
+.fieldHint code {
+  font-size: var(--text-xs);
+  color: var(--text-muted);
+}
+
+.fieldError {
+  margin: var(--space-s) 0 0;
+  font-size: var(--text-xs);
+  color: var(--danger);
+}
+
 .pubRuntimeList {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
diff --git a/src/admin/modals/Settings/sections/PublishingSection.tsx b/src/admin/modals/Settings/sections/PublishingSection.tsx
index f863067b4..9d0770e7f 100644
--- a/src/admin/modals/Settings/sections/PublishingSection.tsx
+++ b/src/admin/modals/Settings/sections/PublishingSection.tsx
@@ -1,14 +1,37 @@
 /**
  * PublishingSection — self-hosted CMS publishing details.
+ *
+ * Also owns the published-page Content-Security-Policy allowlist
+ * (`settings.csp`): the only place an owner can let a third-party script
+ * origin (analytics, tag manager, ad pixel) through the publisher's
+ * `script-src 'self'` default. Textareas commit on blur (one origin per line);
+ * invalid lines are reported next to the field and never persisted.
  */
+import { useState } from 'react'
 import { useSiteSettingsController } from '../useSiteSettingsController'
 import { resolveFrameworkPreferences } from '@core/framework'
+import { isCspOrigin, parseCspOriginList, type SiteCspSettings } from '@core/page-tree'
 import { Switch } from '@ui/components/Switch'
+import { Textarea } from '@ui/components/Input'
 import { SkeletonBlock } from '@ui/components/Skeleton'
 import s from '../SettingsModal.module.css'
 
+type CspListKey = keyof SiteCspSettings
+
+const EMPTY_CSP: SiteCspSettings = { scriptOrigins: [], connectOrigins: [] }
+
+/** Split a textarea into candidate origins: one per line, trimmed, blanks dropped. */
+function splitOriginLines(raw: string): string[] {
+  return raw
+    .split(/\r?\n/)
+    .map((line) => line.trim())
+    .filter(Boolean)
+}
+
 export function PublishingSection() {
-  const { site, error, updateFrameworkPreferences } = useSiteSettingsController()
+  const { site, error, updateFrameworkPreferences, updateSiteSettings } =
+    useSiteSettingsController()
+  const [cspErrors, setCspErrors] = useState<Partial<Record<CspListKey, string>>>({})
 
   if (error) {
     return <p className={s.sectionDescription} role="alert">{error}</p>
@@ -20,6 +43,19 @@ export function PublishingSection() {
 
   const frameworkPreferences = resolveFrameworkPreferences(site.settings.framework?.preferences)
   const treeShakeId = 'publishing-tree-shake-framework-utilities'
+  const csp = site.settings.csp ?? EMPTY_CSP
+
+  function commitCspList(key: CspListKey, raw: string) {
+    const lines = splitOriginLines(raw)
+    const invalid = lines.filter((line) => !isCspOrigin(line))
+    setCspErrors((prev) => ({
+      ...prev,
+      [key]: invalid.length > 0 ? `Not an https:// origin: ${invalid.join(', ')}` : undefined,
+    }))
+    const next: SiteCspSettings = { ...csp, [key]: parseCspOriginList(lines) }
+    const isEmpty = next.scriptOrigins.length === 0 && next.connectOrigins.length === 0
+    updateSiteSettings({ csp: isEmpty ? undefined : next })
+  }
 
   return (
     <div>
@@ -75,6 +111,62 @@ export function PublishingSection() {
           </div>
         </div>
       </section>
+
+      <section aria-labelledby="pub-csp-heading" className={s.sectionBlock}>
+        <h4 id="pub-csp-heading" className={s.subHeading}>
+          Content Security Policy
+        </h4>
+        <p className={s.fieldHint}>
+          Published pages only run scripts from this site. List the third-party origins your
+          runtime scripts load from (analytics, tag managers, ad pixels) and the origins they
+          send data to. One <code>https://</code> origin per line, for example{' '}
+          <code>https://www.googletagmanager.com</code>. Wildcard subdomains such as{' '}
+          <code>https://*.google-analytics.com</code> are allowed; paths and{' '}
+          <code>http://</code> are not.
+        </p>
+
+        <div className={s.genFieldRow}>
+          <label htmlFor="pub-csp-script-origins" className={s.label}>
+            Allowed script origins
+          </label>
+          <Textarea
+            id="pub-csp-script-origins"
+            rows={3}
+            spellCheck={false}
+            defaultValue={csp.scriptOrigins.join('\n')}
+            placeholder={'https://www.googletagmanager.com\nhttps://connect.facebook.net'}
+            invalid={Boolean(cspErrors.scriptOrigins)}
+            aria-describedby={cspErrors.scriptOrigins ? 'pub-csp-script-origins-error' : undefined}
+            onBlur={(e) => commitCspList('scriptOrigins', e.target.value)}
+          />
+          {cspErrors.scriptOrigins && (
+            <p id="pub-csp-script-origins-error" className={s.fieldError} role="alert">
+              {cspErrors.scriptOrigins}
+            </p>
+          )}
+        </div>
+
+        <div className={s.genFieldRow}>
+          <label htmlFor="pub-csp-connect-origins" className={s.label}>
+            Allowed connection origins
+          </label>
+          <Textarea
+            id="pub-csp-connect-origins"
+            rows={3}
+            spellCheck={false}
+            defaultValue={csp.connectOrigins.join('\n')}
+            placeholder={'https://www.google-analytics.com\nhttps://*.google-analytics.com'}
+            invalid={Boolean(cspErrors.connectOrigins)}
+            aria-describedby={cspErrors.connectOrigins ? 'pub-csp-connect-origins-error' : undefined}
+            onBlur={(e) => commitCspList('connectOrigins', e.target.value)}
+          />
+          {cspErrors.connectOrigins && (
+            <p id="pub-csp-connect-origins-error" className={s.fieldError} role="alert">
+              {cspErrors.connectOrigins}
+            </p>
+          )}
+        </div>
+      </section>
     </div>
   )
 }
diff --git a/src/core/page-tree/index.ts b/src/core/page-tree/index.ts
index e53a029e6..695aa5d7d 100644
--- a/src/core/page-tree/index.ts
+++ b/src/core/page-tree/index.ts
@@ -55,7 +55,7 @@ export type {
   StyleRuleOrigin,
 } from './styleRule'
 export type { Condition, ConditionDef } from './condition'
-export type { SiteSettings } from './siteSettings'
+export type { SiteSettings, SiteCspSettings } from './siteSettings'
 export type { SiteShell, SiteDocument } from './siteDocument'
 export type {
   DecorativeSiteExplorerSectionId,
@@ -69,7 +69,14 @@ export type {
 
 // Defaults
 export { DEFAULT_BREAKPOINTS, breakpointMediaQuery, defaultBreakpointMediaQuery } from './breakpoint'
-export { DEFAULT_SITE_SETTINGS } from './siteSettings'
+export {
+  DEFAULT_SITE_SETTINGS,
+  SiteCspSettingsSchema,
+  CSP_ORIGIN_PATTERN,
+  isCspOrigin,
+  parseCspOriginList,
+  parseSiteSettings,
+} from './siteSettings'
 
 // Condition helpers
 export { conditionId, conditionLabel, makeConditionDef, parseConditions } from './condition'
diff --git a/src/core/page-tree/siteSettings.ts b/src/core/page-tree/siteSettings.ts
index ac01486bf..9575e81a2 100644
--- a/src/core/page-tree/siteSettings.ts
+++ b/src/core/page-tree/siteSettings.ts
@@ -29,6 +29,64 @@ import { compiledCheck } from '@core/utils/typeboxCompiler'
 import { FrameworkSettingsSchema } from '@core/framework-schema'
 import { SiteFontsSettingsSchema, parseSiteFontsSettings } from '@core/fonts'
 
+// ---------------------------------------------------------------------------
+// SiteCspSettings — site-level Content-Security-Policy allowlist
+//
+// The publisher's base policy locks `script-src` to `'self'`, which is right
+// for a static site but blocks every third-party tag a marketing site needs
+// (Google Analytics / Tag Manager loaders, the Meta pixel, chat widgets, …).
+// Plugins cannot lift this — `frontend.assets[]` is same-origin only and
+// `networkAllowedHosts` reaches `connect-src`, not `script-src`. This is the
+// one explicit, owner-controlled place to allow an external origin. Entries
+// are exact HTTPS origins (`https://host[:port]`, optionally `https://*.host`)
+// — never a scheme wildcard, never `'unsafe-inline'`, never a path — so the
+// policy stays a real allowlist.
+// ---------------------------------------------------------------------------
+
+/**
+ * One CSP host source: `https://` + host (optionally a `*.` wildcard label)
+ * + optional port. No path, query, credentials, or trailing slash — CSP
+ * ignores everything after the host anyway, so accepting it would only hide
+ * typos.
+ */
+export const CSP_ORIGIN_PATTERN =
+  '^https://(?:\\*\\.)?[A-Za-z0-9](?:[A-Za-z0-9-]*[A-Za-z0-9])?(?:\\.[A-Za-z0-9](?:[A-Za-z0-9-]*[A-Za-z0-9])?)+(?::[0-9]{1,5})?$'
+
+const CSP_ORIGIN_RE = new RegExp(CSP_ORIGIN_PATTERN)
+
+/** True when `value` is a CSP host source the allowlist accepts. */
+export function isCspOrigin(value: string): boolean {
+  return CSP_ORIGIN_RE.test(value)
+}
+
+const CspOriginSchema = Type.String({ pattern: CSP_ORIGIN_PATTERN })
+
+export const SiteCspSettingsSchema = Type.Object({
+  /** Origins merged into the published page's `script-src` (third-party loaders). */
+  scriptOrigins: Type.Array(CspOriginSchema),
+  /** Origins merged into `connect-src` (where those scripts send beacons / fetch). */
+  connectOrigins: Type.Array(CspOriginSchema),
+})
+
+export type SiteCspSettings = Static<typeof SiteCspSettingsSchema>
+
+/**
+ * Normalize a raw origin list: trim, drop blanks and anything that is not a
+ * valid CSP host source, de-duplicate, keep first-seen order. Used by the
+ * tolerant settings parser and by the Settings UI when it commits a textarea.
+ */
+export function parseCspOriginList(raw: unknown): string[] {
+  if (!Array.isArray(raw)) return []
+  const out: string[] = []
+  for (const entry of raw) {
+    if (typeof entry !== 'string') continue
+    const trimmed = entry.trim()
+    if (!trimmed || !isCspOrigin(trimmed) || out.includes(trimmed)) continue
+    out.push(trimmed)
+  }
+  return out
+}
+
 // ---------------------------------------------------------------------------
 // SiteSettingsSchema
 // ---------------------------------------------------------------------------
@@ -42,6 +100,8 @@ export const SiteSettingsSchema = Type.Object({
   framework: Type.Optional(FrameworkSettingsSchema),
   /** Library of installed fonts — absent when no fonts added. */
   fonts: Type.Optional(SiteFontsSettingsSchema),
+  /** Third-party origins allowed by the published-page CSP — absent when none. */
+  csp: Type.Optional(SiteCspSettingsSchema),
   /** Keyboard shortcut overrides — defaults to {} — handled in parseSiteSettings. */
   shortcuts: Type.Record(Type.String(), Type.String()),
 })
@@ -86,6 +146,8 @@ export function parseSiteSettings(raw: unknown): SiteSettings {
 
   const fonts = r.fonts != null ? parseSiteFontsSettings(r.fonts) : undefined
 
+  const csp = parseSiteCspSettings(r.csp)
+
   return {
     ...(typeof r.metaTitle === 'string' ? { metaTitle: r.metaTitle } : {}),
     ...(typeof r.metaDescription === 'string' ? { metaDescription: r.metaDescription } : {}),
@@ -93,6 +155,21 @@ export function parseSiteSettings(raw: unknown): SiteSettings {
     ...(typeof r.language === 'string' ? { language: r.language } : {}),
     framework,
     fonts,
+    ...(csp ? { csp } : {}),
     shortcuts,
   }
 }
+
+/**
+ * Tolerant parse of `settings.csp`: invalid entries are dropped rather than
+ * failing the whole settings object, and an allowlist with nothing left in it
+ * collapses to `undefined` so an empty object never persists.
+ */
+function parseSiteCspSettings(raw: unknown): SiteCspSettings | undefined {
+  if (!raw || typeof raw !== 'object' || Array.isArray(raw)) return undefined
+  const r = raw as Record<string, unknown>
+  const scriptOrigins = parseCspOriginList(r.scriptOrigins)
+  const connectOrigins = parseCspOriginList(r.connectOrigins)
+  if (scriptOrigins.length === 0 && connectOrigins.length === 0) return undefined
+  return { scriptOrigins, connectOrigins }
+}
diff --git a/src/core/publisher/render.ts b/src/core/publisher/render.ts
index f4b6eaad7..7bcfb3cb0 100644
--- a/src/core/publisher/render.ts
+++ b/src/core/publisher/render.ts
@@ -20,7 +20,7 @@
  * threading another ternary through 150 lines.
  */
 
-import type { Page, SiteDocument } from '@core/page-tree'
+import type { Page, SiteCspSettings, SiteDocument } from '@core/page-tree'
 import type { IModuleRegistry } from '@core/module-engine'
 import type { TemplateRenderDataContext } from '@core/templates/dynamicBindings'
 import { buildPageFrame, buildSiteFrame, buildRouteFrame } from '@core/templates/contextFrames'
@@ -455,6 +455,7 @@ function buildContentSecurityPolicy(
   anyScriptTag: boolean,
   importmap: PublishedRuntimePackageImportmap | undefined,
   moduleCspSources: ReadonlyMap<string, ReadonlySet<string>>,
+  siteCsp: SiteCspSettings | undefined,
 ): string {
   const plan = createBaseCspPlan({ anyScriptTag, importmapSha: importmap?.sha256 })
   // Merge per-page CSP requirements declared by module render() outputs.
@@ -465,6 +466,21 @@ function buildContentSecurityPolicy(
   for (const [directive, sources] of moduleCspSources) {
     addCspSources(plan, directive, sources)
   }
+  // Site-level allowlist (`settings.csp`): the owner's explicit list of
+  // third-party origins. Script origins union into `script-src` (dropping the
+  // lone 'none' on script-less pages, which is harmless — nothing on the page
+  // loads them). Connect origins union into `connect-src` together with
+  // `'self'`: the base plan has no `connect-src`, so without `'self'` a
+  // newly-created directive would stop falling back to `default-src 'self'`
+  // and cut off same-origin fetches (forms, holes, loops).
+  if (siteCsp) {
+    if (siteCsp.scriptOrigins.length > 0) {
+      addCspSources(plan, 'script-src', siteCsp.scriptOrigins)
+    }
+    if (siteCsp.connectOrigins.length > 0) {
+      addCspSources(plan, 'connect-src', ["'self'", ...siteCsp.connectOrigins])
+    }
+  }
   return `\n  ${cspMetaTag(plan)}`
 }
 
@@ -605,7 +621,12 @@ export function publishPage(
 
   const meta = buildDocumentMetaTags(site, page, templateContext, options.documentMeta)
   const runtime = buildRuntimeAssetsBlock(options, acc)
-  const csp = buildContentSecurityPolicy(runtime.anyScriptTag, runtime.importmap, acc.cspSources)
+  const csp = buildContentSecurityPolicy(
+    runtime.anyScriptTag,
+    runtime.importmap,
+    acc.cspSources,
+    site.settings.csp,
+  )
 
   const html = assembleHtmlDocument({
     langAttr: meta.langAttr,