> For the complete documentation index, see [llms.txt](https://sygnal.gitbook.io/sygnal-webflow-components/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-component-dev-approach/production-deployment.md).

# Production Deployment

Either;

1. Change `.env` and replace the `WEBFLOW_WORKSPACE_API_TOKEN`, or&#x20;
2. Change `webflow.json` and&#x20;
   1. append " TEST" to the `library.name`&#x20;
   2. and "-test" to the `library.id`&#x20;

## Github Actions Approach&#x20;

### Branch-conditioned CI&#x20;

Per-env secrets; generate `.env` / patch `webflow.json` at build time. For local dev, auto-switch with a git hook.

Create two secrets in the repo: `WF_TOKEN_PROD` and `WF_TOKEN_PREVIEW`.<br>

```git
# .github/workflows/deploy.yml
name: deploy
on: [push]

jobs:
  build:
    runs-on: ubuntu-latest
    env:
      # choose token by branch
      WEBFLOW_WORKSPACE_API_TOKEN: ${{ github.ref == 'refs/heads/main' && secrets.WF_TOKEN_PROD || secrets.WF_TOKEN_PREVIEW }}
    steps:
      - uses: actions/checkout@v4

      # write .env for the job
      - run: |
          cat > .env <<EOF
          WEBFLOW_WORKSPACE_API_TOKEN=${WEBFLOW_WORKSPACE_API_TOKEN}
          EOF

      # patch webflow.json per branch
      - if: github.ref == 'refs/heads/main'
        run: |
          jq '.library.name="Sygnal Library" | .library.id="lib_prod_id"' webflow.json > w.json && mv w.json webflow.json
      - if: github.ref != 'refs/heads/main'
        run: |
          jq '.library.name="Sygnal Library (Preview)" | .library.id="lib_preview_id"' webflow.json > w.json && mv w.json webflow.json

      # …build/deploy steps here

```

### Env approach

If you prefer **Environments**, put the secrets under `production` (main) and `preview` (non-main) and gate with `if:`.

2. Keep local files out of Git

```
# .gitignore
.env
webflow.json
```

Commit templates only:

```
.env.example
webflow.main.json
webflow.preview.json
```

3. Auto-switch locally on branch change (Windows-friendly)\
   `tools/sync-env.ps1`

```powershell
$branch = (git rev-parse --abbrev-ref HEAD).Trim()
$mode = if ($branch -eq 'main') { 'main' } else { 'preview' }

Copy-Item -Force ".env.$mode" ".env"
Copy-Item -Force "webflow.$mode.json" "webflow.json"
Write-Host "Synced env for branch '$branch' -> $mode"
```

`.git/hooks/post-checkout` (sh)

```sh
#!/bin/sh
pwsh -File tools/sync-env.ps1
```

(make executable: `git update-index --chmod=+x .git/hooks/post-checkout`)

Notes

* Never commit real tokens.
* If you need per-branch preview names/IDs, encode branch in the preview values (e.g., `"Sygnal Library ($GITHUB_REF_NAME)"`) by templating before patching.
