Visual editor requirements

You build variations in Grona’s visual editor, which shows your real page inside the dashboard. Preview links then show your saved changes on your live site. This page explains how each one opens your page, what your page needs, and what stops it from loading.

How the editor opens your page

The editor does not load your page directly in your browser. Grona’s servers fetch the page, prepare it for editing and serve it into the editor frame:

The request comes from Grona’s servers, with a desktop Chrome browser’s headers, not from your own browser or network.
Redirects are followed on the server, up to five, so the editor shows the final page.
Framing headers are removed. Grona strips X-Frame-Options and Content-Security-Policy from the copy it serves to the editor. You do not need to change those headers on your site.
Grona adds its own editing script to the copy. Your installed Grona snippet stands down inside the editor, so the editor does not depend on it.
Client-rendered pages are rendered first. When the server HTML is an empty application shell, or your site’s bot protection blocks the request, Grona renders the page in a headless browser and opens that snapshot. Your site’s own scripts are removed from the snapshot, so interactive parts of the page do not run in the editor.

What your page needs

Public reachability. Grona’s servers must be able to reach the page over the internet. Pages on localhost, on a private network or behind a VPN cannot be opened.
No login. The editor does not have your visitors’ sessions, so pages behind a login open as whatever a signed-out visitor sees, usually the login page. A Shopify store protected by its storefront password can be opened when you give Grona the store password.
A valid TLS certificate. A page whose certificate does not match its host name is refused. With an expired or self-signed certificate, the page opens but cookies are not sent with the request.
A host that resolves. If the host name does not resolve, Grona retries once with www. in front, then reports an error.

What breaks the editor

Firewall rules or IP allow lists that admit only your own network.
Bot protection that blocks the request and also defeats the headless render.
Content that depends on a signed-in session or a cookie set in your own browser.
Elements inside iframes or shadow DOM, which Grona cannot change. See Single-page applications.

How preview links open your page

A preview link is your page’s own address with a gronaPreview parameter. It opens your live site in the visitor’s browser, so it needs the Grona snippet on the page. Grona then fetches the variation and applies it, skipping URL rules, schedule, targeting and consent, and records no page view or goal.

The parameter must stay in the address. Preview does not follow links or route changes in a single-page app. Preview links do not expire and are not signed, so treat a link to a draft as visible to anyone who has it. See Preview and QA a variation.