Skip to main content

Site design & domains

Two dashboard screens shape how your Avero site looks and where it lives: Design & Theme (colors, fonts, header/footer chrome) and Domains (binding a custom domain and verifying its DNS). Both need the storefront.manage permission.

Who can use it​

  • Design & Theme and Domains — the storefront.manage permission (Admins).
  • Both live inside the Avero Sites dashboard, which is gated by the Hosted Site add-on. See Build your Avero site for enabling it.

Design & Theme​

The Design & Theme screen is a summary and launcher — "Design is edited in the block editor. Theme tokens and header/footer chrome are two modes of the editor's live canvas — this screen summarizes and launches, it doesn't duplicate those controls."

Design & Theme — the theme summary, chrome launcher, and theme-token editor.

Design & Theme — current theme, header/footer launcher, Brand Kit, and the per-site theme-token editor.

Theme tokens​

The Theme tokens card is the working editor: "Override your brand's storefront colors for this site. Anything you don't change inherits from the brand theme." It's organized as:

  • Your branding — one-click tiles to match this site to your Company branding or its assigned Brand.
  • House style — starting looks that "fill every color and font below for both light and dark. Tweak anything you like, then Save."
  • Brand, Surfaces, and Buttons & accents color tokens, edited per mode (Light / Dark), each with a live WCAG AA contrast hint.
  • Typography & shape — heading font, body font, and corner radius, which "Applies to both light and dark."

Overrides are sparse: an untouched token inherits from the brand theme. Save theme confirms "Theme saved" — "Changes apply to this site's storefront." The Current theme card summarizes your palette and shows whether the site Inherits brand or has N per-site overrides.

Header, footer & announcement chrome​

The header and footer that wrap every page are edited on the canvas in the block editor's chrome mode, not on this screen — "Menu, layout, sticky/transparent header, announcement bar, footer columns, and newsletter signup are edited on the canvas in chrome mode." Edit chrome in editor opens it.

In chrome mode a bar sits over the canvas: "Editing the site header — applies to every page" (or footer). The page blocks dim and lock so the chrome is the unambiguous editing target. What you can set:

  • Header — a layout (Nav left, Centered logo, Split nav, Utility bar, Minimal drawer); Stick to top on scroll and Transparent over hero behaviors; a Menu style (Normal dropdown or Mega menu); the navigation menu; a rich Announcement banner above the header; and Cart button / Account menu widget toggles.
  • Footer — a layout (Columns, Centered, Newsletter, Brand family, Minimal); a byline; up to four link columns; and an optional pre-footer band (e.g. a newsletter call-out). Social icons come from Website settings; the copyright / Powered-by strip is fixed.

Chrome publishes on its own button, separate from page publish: Publish chrome — "They go live on all pages of this site immediately. Page publish is separate and unaffected." Until you publish, edits carry a "Chrome draft — not published" chip. Discard draft reverts the header & footer to what's currently live.

Per-page chrome opt-out

A single page can hide the site header or footer — in the editor's Page panel, Hide site header / Hide site footer — "For a chromeless landing or campaign page. Other pages keep the site header and footer."

The Brand Kit cascade​

The Brand Kit card (marked Company-level) is the source of truth for your look: "Logo, brand colors, and typography cascade from your company Brand Kit into every site. Edit the source once at the company level." Edit Brand Kit opens /admin/company?tab=brand. Set it once and it flows into every site; per-site theme tokens override it only where you change them.

Domains​

The Domains screen binds one of your company domains to this site and shows its verification status. It does not buy or delete domains — "Domains are purchased & managed in Storefront settings. This screen binds an existing company domain to this site and shows verification status — it doesn't buy or delete domains." Manage domains opens /admin/store?tab=domains (see Your online storefront).

Domains — bind a company domain and verify its DNS records.

Domains — connect a company domain to this site, with its real DNS records and a working re-check.

Connect a domain​

Each company domain shows as a card. If it's free, Connect binds it to this site; if it's on another site, Move here moves it. Disconnect unbinds it. A subdomain slug is live immediately; a custom domain needs DNS.

DNS records & verification​

A connected custom domain expands to its real DNS records — an ownership TXT record plus the routing CNAME / A target. The side card lays out the three steps:

  1. Add the TXT record — "Proves you own the domain."
  2. Point CNAME / A records — "Routes visitors to Avero."
  3. SSL issued automatically — "HTTPS once DNS resolves."

Add the records at your DNS provider, then tap Re-check DNS on the domain — "Add these at your DNS provider, then re-check. Propagation can take up to an hour." Each record then shows its own status:

  • The TXT (ownership) record reads Found or Not found.
  • The routing record reads Live or Resolving.
  • Before a re-check, records show the stored state: Verified or Pending.

On success Avero says "Domain verified"; otherwise Not verified yet with the detail of what's still missing. The card header chip flips from Pending verification to Verified & live.

Reference​

ControlWhereWhat it does
House styleDesign → Theme tokensFills all colors + fonts from a starting look.
Save themeDesign → Theme tokensSaves per-site color/font overrides.
Edit chrome in editorDesign → Header & footerOpens the canvas chrome mode.
Publish chromeEditor chrome-mode barTakes the header & footer live on every page.
Edit Brand KitDesign → Brand KitOpens company Brand Kit (/admin/company?tab=brand).
Connect / Move hereDomainsBinds (or moves) a company domain to this site.
Re-check DNSDomains (custom domain)Runs verification and reports per-record status.
Manage domainsDomainsOpens Storefront domain settings to buy/verify.

Troubleshooting​

  • A color won't save — a token failing the WCAG AA contrast check is flagged low; pick colors that meet 4.5:1 for legibility.
  • My header change didn't go live — chrome publishes separately. Use Publish chrome in the chrome-mode bar; page Publish doesn't cover it.
  • "Transparent over hero" looks wrong — it needs a page that leads with a full-bleed hero; pages without one fall back to the solid header automatically.
  • No domains to connect — you have no company domains yet. Buy or add one in Storefront settings (/admin/store?tab=domains), then connect it here.
  • "Not verified yet" on a custom domain — the TXT and/or routing records aren't resolving. Confirm them at your DNS provider and Re-check DNS; propagation can take up to an hour.