Skip to main content
All CollectionsDivi 5Options Groups
Understanding the Menu Text Options in Divi 5
Understanding the Menu Text Options in Divi 5

Learn how to use the Menu Text options to customize the appearance of the Menu module to better integrate it into your design.

Updated this week

The Menu Text options in Divi allow you to customize the appearance and behavior of your menu text fully. These settings give you control over everything from font style to alignment, ensuring your menu aligns with your design goals.

Menu module - Menu Text options

Where to Find the Menu Text Options

  1. Open the module Settings: Click the gear icon or the module itself to access the settings.

  2. Navigate to the Design Tab: Locate the Menu Text option group.

Menu Text Customization Settings

  1. Active Link Color: The active link represents the current page being viewed. This setting allows you to select a color for active links, helping users differentiate them from other menu links. You can choose a color from your site's palette or use the eyedropper tool to pick a custom shade.

  2. Menu Font: Choose the font style for your menu text. By default, the theme’s standard font is selected. You can select another font from the dropdown or upload a custom font to match your branding.

  3. Menu Font Weight: You can adjust the boldness of your menu text by selecting from the available font weights, which range from light to extra bold.

  4. Menu Font Style: Customize the style of the menu text. You can apply:

    1. Italicized

    2. Capitalized

    3. Small Capitals

    4. Underlined

    5. Strike-through

  5. Menu Text Color: You can select a custom color for your menu text from your site’s color palette or use the eyedropper for more options.

  6. Menu Text Size: You can define the size of your menu text by using the range slider or entering a numerical value. This helps ensure that the text is appropriately sized for your design.

  7. Menu Letter Spacing: You can control the spacing between each letter by dragging the range slider or inputting a specific value. Larger values increase the spacing between characters.

  8. Menu Line Height: To improve readability, you can adjust the vertical spacing between lines of text by using the slider or entering a numerical value.

  9. Menu Text Shadow: Add a shadow effect to the menu text. Once a shadow style is selected, you can configure:

    • Horizontal and vertical shadow direction

    • Shadow blur strength

    • Shadow color

  10. Text Alignment: Choose how your menu text is aligned within the module:

    • Left

    • Center

    • Right

    • Justify

  11. Text Color: Choose between the Dark or Light color scheme.

Tips for Using Menu Text Options

  • Enhance Readability: Use a clear font and proper line height to ensure the metadata is easy to read.

  • Maintain Visual Balance: Adjust the font size and letter spacing to align with the rest of your blog module’s design.

  • Add Depth Subtly: Use light shadows to make the text stand out against complex backgrounds.

  • Stick to Branding: Match the font, color, and style with your site’s typography for a cohesive look.

Did this answer your question?