1. Adventist Web Engine
  2. Solution home
  3. Building
  4. Website advanced topics

Styling website menus

Overview

Depending on the design (Adventist, Hope) there may be options to style the elements of the menu. This could include setting the colors of the navigation links, adding a hover color, setting a link as a button, or adding a "live" indicator for a livestream page.


Note:

If you have not created a menu, please create a menu first.



How to



Under the website, navigate to the Menus submodule. Then select the menu you want to style. To discover the options available for your design, click on the three vertical dots to the right of the navigation link to be styled. Then select "Edit" from the menu. When the modal popup appears, the styling options are in the lower area of the modal.





Adventist design



  • Variant: Use to set link as a link or a button (default link appearance)
  • Item color: set color of the navigation element
  • Item hover color: set the color when the mouse hovers over the element
  • Items dark color:  set color of the navigation element for dark mode
  • Item dark hover color: set the color when the mouse hovers over the element for dark mode



Hope design



  • Live: adds a red dot to the link. Used for the Livestream page.



Additional Information




to review 2025-12-11

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article