Menu Custom Area

The Menu Custom Area element allows you to easily place other elements in the topmost area of the menu. It can also be shown or hidden in the Desktop Menu or Mobile Menu


The Visibility control allows you to specify whether to hide the Menu Custom Area based on the Menu Builder’s Desktop Menu or Mobile Menu settings.

  • Hide In
    • Desktop Menu – Hide the Menu Custom Area in the Desktop Menu.
    • Mobile Menu – Hide the Menu Custom Area in the Mobile Menu.


The Layout controls allow you to fine-tune the positioning and spacing of content within the element. You can align items horizontally or vertically, adjust gaps between elements, and set specific breakpoints for responsive design.

  • Align – Choose how to horizontally align content within the container.
  • Vertical Align – Adjust the vertical alignment of content within the container.
  • Gap – Set the space between items in the container.
  • Horizontal – Further options for horizontal layout adjustments.
    • Align – Specify the horizontal alignment of items.
    • Vertical Align – Choose the vertical alignment for items when in a horizontal layout.
    • Vertical At – Set a breakpoint for when the vertical alignment settings kick in.


The Container controls are pivotal in defining the structural canvas of your web elements. These settings allow you to manipulate the container’s dimensions, ensuring content consistency across various display sizes. Additionally, detailed customization options for padding and borders, including radius, style, and shadow, enable a more refined and visually appealing presentation.

  • Width – Specify the width of the container.
  • Min Height – Set a minimum height for the container, ensuring it never shrinks below this vertical space.
  • Padding – Adjust the internal space within the container boundaries, affecting the layout of contained content.
    • Padding – Define the specific padding space on all sides within the container.
  • Borders – Customize the container’s borders, enhancing its visual presence on the webpage.
    • Radius – Round the corners of your container by setting a border radius, contributing to a smoother, more organic look.
    • Styling – Choose the style of the border, such as solid, dashed, or dotted, and select its color.
    • Shadow – Apply a shadow effect around the container, creating depth on the page.