Updating my Navigation Menu Links
Your site's theme has a global site header with your site logo and navigation menu (depending on your theme, you'll have other elements as well).
Follow these instructions to access and edit Menus on your website theme.
-
From your Cloud Website, click the CMS icon in the left sidebar and go to Menu tab
-
If you have more than one menu on your site, select the correct menu from the Create or select a menu: dropdown.
Note: Your website theme may have other menus in use, ie: Links in your footer may use a separate menu.
-
-
From the Pages menu, check the box next to each page you want included and Click Add to Menu.
-
All added pages will appear at the end of your menu. Drag and drop the pages in the order you want and indent pages to create dropdown menus.
-
All added pages will appear at the end of your menu. Drag and drop the pages in the order you want and indent pages to create dropdown menus.
-
Click Save Changes.
Here's a video tutorial that will help you with the creation and customization of your navigation menus:
Menus are essential for guiding visitors through a website. In the Cloud Website buider, menu creation and customization are handled through the builder interface, with options varying depending on whether the free or pro version is in use.
Accessing Menu Elements
Within the builder, menu elements are available via the sidebar. Once the menu element is dragged onto the page, the prompt to "Create a Menu" appears—this is the starting point for building navigation.
Creating a Menu in the CMS
To begin, navigate to the CMS section located in the top-left corner of the builder. Select Menus, then use the dropdown to choose Create New Menu. Name the menu (e.g., "Main Demo Menu"), click the plus icon, and select it.
Next, choose the desired pages from the left-hand panel and click Add to Menu. Pages can be reordered by clicking, holding, and dragging them into the preferred sequence. Once the menu is arranged, click Save Changes.
Adding Draft Pages to the Menu
If a page is still in draft mode (e.g., an RSVP or Contact Us page), it must be published before it can be added to the menu. After publishing, return to the CMS > Menus section and add the newly published page to the menu. Save changes and close the menu editor.
Refreshing the Builder to Load the Menu
If the newly created menu does not appear in the menu element options, refresh the browser. After refreshing, the menu (e.g., "Main Demo Menu") will be available for selection and can be loaded into the page.
Styling the Menu Element
The menu element offers extensive customization options:
- Layout Controls: Adjust padding, margins, and alignment.
- Link Styling: Each link can be individually styled. Pro users can enable Mega Menu functionality for any link, allowing additional elements to be embedded within the menu.
- Icons: Icons can be added to links. For example, selecting a "house" glyph for a "Home" link. Icons can be positioned left or right, resized, and spaced accordingly.
- Typography and Colors: Global typography settings apply to the entire menu. Text color can be set for normal, hover, and active states. For instance, hover color might be teal, while the active page (e.g., RSVP) appears in black.
Advanced Menu Functions
Additional layout options include:
- Vertical Alignment: Adjust spacing between links.
- Hamburger Menu: On tablet and mobile views, a hamburger menu appears by default. Clicking it opens a drawer containing the menu.
Styling the Hamburger Menu
To access hamburger menu settings, increase the top padding of the column temporarily. This exposes the hamburger menu for selection. Once selected, the following options are available:
- Size Adjustment
- Drawer Position: Choose left or right.
- Color Customization
After styling, reduce the padding to its original value. The drawer can be opened to further customize individual menu items, including icon selection, typography, text color, background, and border styling. Alignment options include center, left, or right.
Related Help Article
Ready to learn more? Check out Brizy Cloud's help article: How to create a Menu and add pages into it
**In our Cloud Websites documentation, you may come across the name "Brizy" or links to articles found on the Brizy website. Brizy is a technology partner that helps us provide an enhanced, user-friendly website editing experience. The Brizy partnership is explicitly designed for ministries, ensuring we offer the best solution to meet your church's website needs.**
Updated
