Sub Nav Block

Pattern Documentation

The Sub Nav feature is built as an Advanced Custom Fields (ACF) Block and can be found with using any block inserter. The Sub Nav ACF Block can be added to any page once, providing an interface for navigating to sections on the current page or linking off-page with an action.

The feature piggybacks on the color-aware functionality used seen in the masthead to understand if it should display as “light” or “dark”.

Block Settings

The Sub Nav always includes a link page top (#main), using the current Page title, but includes a field for overriding the link text if the page title is undesirable. The inner section links are managed with a repeater of ACF Link fields, of which, the URL value expects a corresponding page anchor. Lastly, the block has a single Link field for rendering an action.

Usage

The Sub Nav block can be added anywhere within a page layout – nested or top-level – but the intent is for the feature to appear from the bottom of the screen as the user scrolls through the page, so adding the block further down the page is recommended.