Add header links and a footer to your site
## Add header links 1. Open your site in Hub. 2. Select **Edit site**, then **Edit sections**. 3. Open **Header & footer**. 4. Under **Header links**, select **Add link**. 5. Enter the link label and full URL, including `https://`. 6. Add more links or change their order as needed. Header links appear beside your logo on desktop and inside a compact **Links** menu on mobile. ## Add a footer 1. In **Header & footer**, enable **Full site footer**. 2. Add a short description of your organisation or site. 3. Add links to pages such as Contact, Privacy, Terms or social profiles. 4. Enter your copyright text. 5. Choose whether to show the **Hosted on Hub** credit. 6. Save and publish your changes. Preview both desktop and mobile layouts before publishing to make sure your links and footer content fit comfortably. ## Automatic footer columns Footer columns can be populated automatically from published records in a collection. This lets you list products, services or other content without manually maintaining footer links. ### Set up an automatic column 1. In the footer editor, add or select a footer column. 2. Under **Source**, choose **Automatic from collection**. 3. Select the **collection** to draw records from. 4. Optionally add **filters** to include only records matching specific field values — for example, `Brand = Labs` to show only a single brand's products. 5. Choose the **destination** — the published detail-page route where items should link to. 6. Set the **ordering** and any **limit** on how many items appear. 7. Save and publish. Existing manual columns keep their entries until you configure an automatic rule. Automatic columns display only published, unarchived records. The footer editor shows a labelled status for the active automatic rule, and the saved filter and destination survive a page reload. > **Existing columns:** Existing footer columns keep their default destination and ordering until you configure a rule. No existing content is changed until you save a rule. ## Choose a logo from the workspace library If your workspace has a logo library set up in **Settings → Branding**, you can pick any named variant directly in the header and footer editor. 1. In **Header & footer**, find the **Workspace logo** selector under the Header or Footer section. 2. Choose the variant you want — for example Primary, Light or Dark. 3. The selected file is copied into your site design. The site keeps that file even if the library changes later. You can still upload a PNG, JPG, WebP or SVG directly or paste a public URL if you prefer a one-off image. ## Control logo appearance Each header and footer includes logo appearance controls: | Setting | Options | |---|---| | **Logo frame** | Unboxed, Rounded box, Circle | | **Logo proportions** | Square, Natural proportions | | **Logo height** | 24–64 px | Natural proportions give wide wordmarks more horizontal space. Circle frames always use a square area and override the proportions setting. ## Set separate logos for light and dark themes Visitors using a dark-mode device or system preference will see a different logo if you configure one. This replaces the previous behaviour where one logo appeared in all themes. 1. In the header or footer editor, use **Logo for light theme** and **Logo for dark theme** to choose a library variant for each. 2. Leave either field blank to fall back to the main logo. The matching logo is selected from the visitor's resolved theme, including system mode. Previously saved selections continue to work even if the library entry is later removed. > **Existing designs:** Theme logos are opt-in. Your site keeps its default logo until you select theme variants and save. For details on building the logo library and colour palette, see *Manage workspace logos, colours and site branding*. ## Client logo layout on record headers When a record (such as a testimonial or case study) has a logo field, you can display it using a dedicated **Client logo** header layout. This shows the full logo on a small white surface above the record title, preserving its proportions rather than stretching it as a cover image. ### Theme variants for client logos A second **Logo for dark theme** image field can be configured alongside the primary logo field. When a record supplies both variants: - The displayed logo follows the site's resolved visitor theme — the light logo on light pages, the dark logo on dark pages. - The logo is shown on a transparent surface. - Records that supply only one logo retain the white-frame treatment. ### Set up a client logo header 1. Open the page or record template in the Sites editor. 2. Find the record header section. 3. In the **Layout** selector (a compact native select with five choices), choose **Client logo**. 4. Map the **Logo field** and, optionally, the **Logo for dark theme** field. 5. Save and publish the site. Other header layouts keep their existing rendering behaviour.