Description
Ariade Header and Menu gives the free Ariade block theme its header. WordPress.org theme rules keep this kind of functionality out of themes, so it lives here, in a small plugin you install once and forget. Activate it and the Ariade header is in place – there is nothing to switch on.
What you get
- One header, set up from its own settings. Select the Ariade Site Header block in the Site Editor and everything is in its settings panel: brand style, colours, the menu it shows, the header buttons and letter case. No code and no CSS needed.
- Brand style. Logo only, logo with site name and tagline, or name and tagline only.
- Header colours with a contrast check. Background, menu links, hover, current page, button, drop-down panel and the mobile menu. Each pair is checked against WCAG as you choose, and hover and the current page are also underlined, so they never rely on colour alone.
- A logo that works on a dark header. Show the logo in white, or choose a separate logo for dark backgrounds.
- You can see where the menu comes from. The settings panel names the menu shown in the header and links straight to it.
- A drop-down menu that works for everyone. Arrow keys move between items, Escape closes a sub-menu, focus is always visible, and screen readers hear each item once, with no stray numbers or icons.
- A mobile drawer with the same buttons. The menu drawer on small screens shows the same header button as the desktop header, with the text and link you set once.
- An auto-built sitemap block. Drop it on a page and it lists every page, post and category on the site, grouped and paginated, kept up to date on its own.
- Valid HTML, kept that way. Under Settings, Ariade Header and Menu: one title tag per page when an SEO plugin prints its own, no invalid “auto” in image sizes, stray style code moved out of the body, and anything injected between the head and the body removed. All four are on by default and can be switched off.
- Text exactly as you wrote it. Made to match Ariade’s house style: plain hyphens, no automatic dashes.
Built accessibility-first
Every part of this plugin was tested by hand with JAWS, NVDA, VoiceOver and TalkBack, on the keyboard alone, and at 200 and 400 percent zoom. It meets WCAG 2.2 Level AA.
For developers
The filter ariade_brand_markup still replaces the brand lockup completely (it now also receives the chosen brand style). ariadec_use_ariade_header set to false keeps the theme’s core Navigation header.
Live demo: showcase.ananyoo.com
Blocks
This plugin provides 4 blocks.
- Ariade Header Actions Header action buttons – search, account, cart, the "Get the theme" button, and the mobile menu button. Show or hide account, cart and the CTA, and edit the CTA, from the block settings.
- Ariade Primary Menu The accessible primary navigation – desktop mega-menu plus mobile drawer. Menu items are managed in Appearance → Menus (assign a menu to the "Primary" location).
- Ariade Sitemap A dynamic, WCAG-friendly HTML sitemap that auto-populates from your content. Choose which content types to list, the marker style, columns, and how large catalogues are handled (link to archives or numbered pages).
- Ariade Site Header The one Ariade accessible header – brand, drop-down menu, mobile drawer and header buttons. Brand style, header colours, letter case and the buttons are all set in the block settings.
Installation
- Install and activate the free Ariade theme from Appearance, Themes, Add New.
- Install and activate Ariade Header and Menu from Plugins, Add New. The Ariade header is used straight away.
- Open Appearance, Menus, and assign a menu to the Primary location. Until you do, the header lists your published top-level pages.
- To change the brand, colours or header button, open Appearance, Editor, edit the Header, select the Ariade Site Header block and use its settings panel.
FAQ
-
Yes. With Rank Math, Yoast, All in One SEO or SEOPress active, WordPress no longer prints its own block-theme title, so each page has exactly one. It is on by default under Settings, Ariade Header and Menu.
-
Do I need the Ariade theme?
-
The blocks work on any block theme, but they are designed for Ariade and match its header without any extra styling.
-
In the Site Editor, edit the Header template part, select the Ariade Site Header block, and use its settings panel. The mobile drawer button follows the same button setting.
-
Why was the plugin renamed?
-
It was called Ariade Companion. The new name says what it does. The plugin folder and all settings are unchanged, so updating keeps everything as it was.
-
How do I add the sitemap?
-
Add the Ariade Sitemap block to any page. It lists your pages, posts and categories automatically and keeps itself current.
-
Does it load anything from outside my site?
-
No. The plugin makes no external requests and collects no data.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“Ariade Header and Menu” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “Ariade Header and Menu” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.5.2
- Security: all block output is now escaped late, on output. The header,
menu and header-actions blocks pass their markup through wp_kses()
with an allow-list of the elements the header uses (new filter
ariadec_header_allowed_html); the Sitemap block escapes its lists,
pager and wrapper attributes; the cart badge uses wp_kses_post().
1.5.1
- Mobile menu colours now also reach third-level rows (a sub-menu inside
a sub-menu), which kept the theme blue in 1.5.0.
1.5.0
- New colours on the Ariade Site Header block: menu link on hover and
focus, current page, drop-down background and text, and a Mobile menu
colours panel (background, text, accent). Every pair has a WCAG
contrast check in the editor; hover and the current page are also
underlined, so they never rely on colour alone. - The mobile menu button follows the header button colours.
- New: logo on a dark header. “White logo” shows the logo in white (the
bundled Ariade logo switches to its white version), or choose a
separate logo image for dark backgrounds. - Each new setting only acts when it is chosen, so existing headers look
exactly as before.
1.4.2
- The “No site logo is set yet” hint in the Brand panel no longer shows
on sites that display the bundled Ariade logo.
1.4.1
- Fix: on a site with no logo of its own but the Ariade branding switch
on (theme demos), the logo brand styles now show the bundled Ariade
logo, as the theme’s Site Logo block does, instead of the site name.
1.4.0
- Renamed from Ariade Companion to Ariade Header and Menu. The slug
(ariade-companion) and all saved settings are unchanged. - New: Brand style on the Ariade Site Header block – logo only, logo with
site name and tagline, or name and tagline only. Replaces the need for
the ariade_brand_markup filter on client sites; the filter stays for
developers and now also receives the chosen style. - New: header colours on the block – background, menu links and icons,
button background and button text – each with a WCAG contrast check in
the editor. Drop-down panels and the mobile menu keep their own colours. - New: capital letters in the menu and buttons can be switched off.
- New: the block settings name the menu shown in the header, with links
to edit it or choose another. - One header only: with the plugin active, Ariade’s stock core Navigation
header is replaced by the Ariade header in memory. The “Use the Ariade
header / No thanks” notice is gone. Headers customised in the Site
Editor and child themes with their own header file are left alone.
Filter ariadec_use_ariade_header (default true). - With no menu assigned, the header now lists the site’s published
top-level pages instead of sample links. - Fix: the default browser icon on fresh installs pointed at image files
the plugin never shipped. It now uses the icon bundled with Ariade.
1.3.5
- New filter ariade_brand_markup on the header brand block, so a child theme
or plugin can supply its own brand lockup (for example a client logo mark
beside the site name and tagline). The default output is unchanged.
1.3.4
- All four Valid HTML corrections are now on by default, so a fresh
install validates out of the box. Saved settings are kept as they are. - The settings row is created on activation and checked on each admin
load, so a reinstall or a stale cache can no longer lose the settings.
1.3.3
- Fix: the page-rewriting corrections now wrap every other plugin’s
output buffer, so they also catch markup that another plugin adds at
the very end of the page, such as an element injected before the body.
1.3.2
- New Valid HTML option: remove anything placed between the head and the
body. Some hosting page-speed layers inject an element there, which
makes the W3C validator stop reading the page. Off until switched on.
1.3.1
- Fix: the single title tag correction now runs just before the title
prints, so it also works when WordPress adds its block-theme title while
the template loads. 1.3.0 could leave two title tags with Rank Math.
1.3.0
- New: Valid HTML module, under Settings, Ariade Companion. One title tag
per page when an SEO plugin prints its own; no invalid “auto” value in
image sizes; and an optional fix that moves style code printed inside
the body into the head. The first two act at the source and rewrite
nothing; the third is off until you switch it on.
1.2.0
- First release on WordPress.org.
- The header button now defaults to “Contact us”, linking to your contact
page. Set your own text and link on the Header actions block. - Passes WordPress Plugin Check with no findings: every header link is
escaped at output, sitemap template variables carry the plugin prefix.
1.1.5
- House style: every en dash and em dash in the plugin’s own text and
readme is now a plain hyphen.
1.1.4
- The mobile menu button now shows the same text and link as the header
button. It reads the Header actions block’s settings from the header
template part, so setting the button once in the Site Editor changes
both. Before, the mobile menu always fell back to the contact page.
1.1.3
- The mobile drawer button now follows the header block’s own call to action settings. It is hidden when the header call to action is switched off, and it uses the header’s button text and link when they are set. Before, the drawer ignored both and always showed the default “Get the theme”. Without header settings it keeps the theme default, and the ariade_drawer_cta filter still has the final say; it now also receives the header options as a second argument.
- The desktop header button now falls back to the contact page this site actually uses, the same lookup the drawer button already had, instead of a hard coded /contact/.
- Menu numbers in the mobile drawer (01, 02 and so on) are hidden from screen readers with aria-hidden. They sat inside the link text, so links were announced as “Home zero one” and “Contact zero seven”. The accessible name is now just the menu label.
1.1.2
- The mobile drawer button now links to the contact page this site actually uses. It was hard coded to /contact/, so on any install that names the page differently the button spent a redirect before arriving. The lookup is cached for a day and the ariade_drawer_cta filter still overrides it.
1.1.1
- Fix: the auto-populated sitemap is back on the Sitemap page. Since Ariade 1.5.0 the theme’s “ariade/sitemap” pattern is a core-blocks list, and although this plugin carried the Ariade Sitemap block, nothing inserted it into the page – so the Sitemap page (and child-theme pages such as ananyoo.com’s /table-of-contents/ that reuse the pattern) lost the patterned hero, the card grid and the per-section pagination. The companion now swaps the pattern’s content for the block on init (priority 30, after theme patterns and block registration), in memory only; theme files and the database are untouched. Skipped automatically when the block or the pattern is missing, or when the pattern already contains the block (classic full Ariade theme). New filter
ariadec_restore_sitemap_pattern(default true) to keep the core-blocks version.
1.1.0
- New: LinkedIn-friendly link previews. The plugin removes the two WordPress oEmbed discovery
<link>tags from the page head (filterariadec_remove_oembed_discovery, default on). LinkedIn’s crawler reads oEmbed before Open Graph and the WordPress oEmbed “rich” response has only the post title and author, so every post preview on LinkedIn showed the wrong title, “Rich media” and “No image found”. With the links gone LinkedIn uses the Open Graph title, description and image, like Facebook and X. The oEmbed endpoint itself is unchanged. Placed in the companion rather than the theme because the WordPress.org theme requirements list wp_oembed_add_discovery_links as a hook a theme must not remove. Verified with the LinkedIn Post Inspector on 81 ananyoo.com URLs, 4 September 2026.
1.0.0
- First release. Carries the four Ariade blocks (site-header, primary-nav, header-actions, sitemap) moved out of the theme for WordPress.org compliance, the front-end navigation script, the header inserter pattern, the one-click header switch, and the default-favicon fallback. Safe alongside the classic full Ariade theme (all registrations and definitions are guarded).
