Skip to main content
Browse the guide

Website management

Navigation

Build header and footer variants — mega menus, top bars, sponsor strips — and pin them to pages.


Your navigation is the menu that runs across the top of your public site (the header) and the band of links at the very bottom (the footer). You can build multiple named variants of each — every site has a mandatory Default header and footer, and you can add more variants and assign them to individual pages (handy for a juniors programme, an events hub, or any section that needs its own menu). Find it under Website management in the admin sidebar, on the Navigation page.

Who can use this

You need the admin role to create, edit or save menus. Moderators can open the pages and look around, but only admins can save — a moderator's save will be refused. Everything you save appears straight away on your public site.

What's on the page

The Navigation page is a gallery of your menu variants, split into Header variants and Footer variants:

  • Every variant is a card showing its name, a summary of what's in it, and how many pages use it. The Default of each type is badged and can't be deleted.
  • + New header / + New footer creates a variant (up to 8 of each type). Duplicate starts a new variant from an existing one — usually the quickest way.
  • Rename, Make default and Delete live on each card. Deleting a variant returns its pages to the Default automatically.

Clicking Edit opens the canvas editor for that menu, with three tabs:

  • Canvas (default) — the menu rendered on a mock page, click-to-edit like the page editor. Click any part — a menu item, the top bar, the logo, the bar background, a footer column, the sponsor strip — and just that element's settings open in the side panel. Drag a menu item (or footer column) onto another to reorder it. Quick-add buttons in the panel append new items and select them straight away.
  • All settings — the full long-form panels with a pinned live preview, handy for bulk editing.
  • JSON (advanced) — for copying a menu between variants or organisations.

The standard floating save pill sits top right.

Step by step

  1. Open a header variant and find the Items section.
  2. Click + Link, + CTA (a call-to-action button), + Dropdown, or + Mega menu.
  3. Set the Label (what visitors read), choose a Style, and set the Visibility.
  4. For a link or CTA, choose Internal page and pick a destination, or External link and paste a full https:// address.
  5. Use the ↑ / ↓ arrows to reorder, or to remove. You can have up to 12 top-level items; dropdowns hold up to 8 child links; mega menus hold up to 4 columns of 8 links each.

Build a mega menu

A mega menu opens a full-width panel of grouped link columns — the pattern large federation sites use for deep sections.

  1. Add a + Mega menu item (or switch an existing dropdown's Type to Mega menu — its links seed the first column).
  2. Add up to 4 columns, each with an optional heading and up to 8 links.
  3. On phones, the panel collapses into a single expandable group in the burger menu.

Add a top utility bar

  1. In a header variant, enable the Top utility bar section.
  2. Pick a background, then add small links (up to 8) and social icons (up to 8).
  3. The strip renders above your main navbar — ideal for cross-site links ("My Football"-style networks) and social icons.
  1. With Internal page selected, use the search box to filter your built-in routes and every page on your organisation (drafts included).
  2. If you type a path that doesn't exist yet, you'll see an amber warning. For a simple path you can click Create page at … to make a draft and jump straight into the page editor.
  3. A link to a page that doesn't exist shows a Missing page badge and is hidden on the public site until that page is published.
  1. Open a footer variant.
  2. Set the Layout variant, Background, Text tone, an optional Intro text, and your Copyright line.
  3. Add Columns (up to 6, each with up to 10 link rows), Social links (up to 10, with a brand icon picker), an optional Footer CTA button, and a Sponsors & partners logo strip (up to 12 logos, each optionally linking to the sponsor's site).
  1. Create the variant here first (usually by duplicating the Default).
  2. Open the page in the Pages editor. Once you have more than one variant of a type, Header and Footer pickers appear in the editor toolbar next to the Sidebar control.
  3. Pick the variant — it saves immediately and the editor preview updates. Choose the "(default)" option to switch back.

Save your changes

  1. As soon as you edit anything, the save pill reads Unsaved changes.
  2. Click Save header (or Save footer). The button shows Saving…, then Saved.
  3. Discard reverts to your last saved version; Export JSON downloads a copy of the menu.

Roll back to an earlier version

Every save records a version, listed newest-first in the Version history card at the bottom of the menu's editor.

  1. Open the menu from the Navigation gallery and scroll below the editor to Version history. Each row shows when it was saved and a short summary (item count, mega menu, sponsor logos and so on); the top row is badged Current.
  2. Click Restore on the version you want to bring back. The editor reloads with that version and it goes live on your public site straight away.
  3. Restoring is itself recorded as a new version, so you can always roll forward again — nothing is ever lost. Use the ← Newer / Older → links to page through longer histories.

Field reference

FieldWhereWhat it does
Layout variantHeader / FooterOverall arrangement (e.g. Logo left, links right; Multi-column).
Background treatment / Background / Text toneHeader / FooterColour styling of the bar.
Top utility barHeaderOptional slim strip above the navbar: small links, social icons, and its own background.
Signed-in / Signed-out labelHeaderText and style for the account and sign-in buttons.
Stick header to top on scrollHeaderKeeps the navbar visible as visitors scroll.
Show site name next to logoHeaderTurn off if your logo already includes the club name. This is site-wide branding, shared by every variant.
TypeItemLink, CTA button, Dropdown or Mega menu.
StyleItemButton appearance (Plain, Navbar, Brand or Status).
VisibilityItem / Footer linkAlways visible, Signed-out visitors only, Members only, Members & up, Moderators & admins, or Admins only.
LabelItem / Column / SocialThe text shown (FontAwesome icons allowed).
Internal page / External linkURL fieldChoose a page on your site or an off-site https:// address.
Sponsors & partnersFooterLogo strip above the columns: image URL, sponsor name (alt text) and an optional link per logo.
Intro text / Copyright lineFooterOptional sentence and the copyright notice above/within the footer.

Tips & FAQ

  • Which menu shows on which page? Every page uses the Default header and footer unless it pins a variant in the page editor. Built-in routes (news, events, shop, account) always use the Default.
  • Icons in labels: open the "Use FontAwesome icons in any label" helper to paste a free icon snippet into any label.
  • Register and sign-in links hide themselves when they no longer apply. A link to the Register page is hidden automatically for visitors who already belong to your organisation (including anyone with a pending application), and Sign in / Sign up links are hidden for signed-in visitors — whatever the item's Visibility setting says. You can safely leave these links on "Always visible".
  • External links open in a new tab and are kept safe automatically.
  • Made a mistake? Every save records a version — use Version history below the menu's editor to restore any earlier one, so you can change things confidently.
  • ClubHelix branding sits below your editable footer and follows your plan. On the Free plan the "Powered by ClubHelix" strip appears above your site header and in the footer; on Standard it appears in the footer only; on Pro and Enterprise your site carries no visible ClubHelix branding at all. There's no setting for this — it changes automatically with your plan.
  • Related: build the pages your menu links to under Pages, adjust colours and buttons under Theme, and set your logo on Branding. See the Admin overview for the bigger picture.