Page Guard Dog

Guard pages from direct URL bypasses

A password gate is just a visual overlay — anyone who knows your URL can skip it entirely. Page Guard Dog is an invisible component you drop on any protected page. If a visitor hasn't authenticated, they're redirected before seeing a single pixel.

The problem it solves

A password gate component only controls what a visitor sees on one page — it does nothing to protect the destination page it redirects to
If your gate on / sends authenticated visitors to /home, anyone who simply types /home into their browser skips the gate entirely
Page Guard Dog closes that gap by guarding the destination page itself — silently checking for a valid session on every load and redirecting unauthorised visitors before any content renders

A password gate component only controls what a visitor sees on one page — it does nothing to protect the destination page it redirects to
If your gate on / sends authenticated visitors to /home, anyone who simply types /home into their browser skips the gate entirely
Page Guard Dog closes that gap by guarding the destination page itself — silently checking for a valid session on every load and redirecting unauthorised visitors before any content renders

Features

Zero visual footprint in production — renders absolutely nothing on the published site, so it cannot affect your page layout, content, or styling in any way
Visible on the Framer canvas — displays a small labelled pill with a paw icon and a green status dot so you can easily find, select, and configure it in the editor
Instant redirect — unauthorised visitors are sent away before a single frame of page content is painted, preventing any flash of protected content
Session-aware — reads the same encrypted token written by Secure Section Password, including expiry time. Expired or missing sessions are treated as unauthorised
Safe in the Framer editor — the redirect logic only runs in the published or previewed site, never inside the canvas editor
Drop-anywhere placement — does not need to wrap content, cover anything, or sit in any particular layer position. Place it anywhere on the page
Token cleanup — automatically removes expired tokens from localStorage rather than leaving stale data behind
Single prop setup — only one field to configure: the page to redirect unauthorised visitors to

Use cases

Any page that SecureSectionPassword redirects to after a correct password entry — this is its primary and intended companion use
Multi-page protected sections where several pages all need to verify the same session before rendering
Client preview sites where direct URL sharing would otherwise bypass the gate entirely

How to use

In Framer, go to Assets → Code → New File, name it PageGuardDog, paste the code, and save
On every page you want to protect (e.g. /home), drag PageGuardDog anywhere onto the canvas
Give it a small fixed size such as 220×52 — this is only visible in the editor, not in the published site
In the right-hand properties panel, set Redirect to the page where unauthorised visitors should land (e.g. /)
Publish — anyone who visits the protected page without a valid session is immediately redirected

Notes

Page Guard Dog must be used alongside Secure Section Password — it reads the session token that component writes on successful login. It will not work without it
The AUTH_KEY constant (ssp_auth_token) and AUTH_VERSION (1) in both components must stay identical. If you customise either component, keep these values in sync
If you ever need to invalidate all existing sessions — for example, after changing your password — increment the AUTH_VERSION value in both components from "1" to "2" and republish. All existing tokens will be rejected
Session duration is controlled by the Session duration dropdown on SecureSectionPassword, not by Page Guard Dog itself