Customizing App Navigation Header in MemberPress App

Navigation header customization enhances usability and reinforces branding within mobile applications. The app navigation header supports flexible More Menu placement and icon customization. This document explains how to configure header settings, relocate the More Menu, and customize header icons for improved member experience.

Understanding App Navigation Header

The navigation header appears at the top of app screens, displaying page titles and navigation elements. Header configuration controls title alignment, scroll behavior, and More Menu placement. Moving the More Menu from the Tab Bar to the header frees a Tab Bar slot for additional primary navigation. Proper header configuration balances functionality with clean interface design.

Understanding Header Configuration Benefits

Header customization provides multiple usability and branding advantages.

Relocatable More Menu flexibility affects Tab Bar capacity. Moving the More Menu to the header frees the fifth Tab Bar position for primary navigation items.

Tab Bar expansion allows five custom navigation items when More Menu moves to the header. Expanded capacity improves primary navigation access.

Icon customization aligns header appearance with brand identity. Default icons can be replaced with brand-appropriate selections.

Visual consistency maintains More Menu accessibility regardless of location. Members access secondary navigation from a familiar icon.

Accessing Header Bar Settings

Header configuration occurs within the menu settings interface.

1. Vaya a Dashboard > MP App > Menus.
   
2. Haga clic en el botón Header Bar ficha.
   
3. Localice el Header Bar Settings sección.

Header Bar settings control alignment, visibility, and More Menu placement.

Configuring Header Alignment

Header alignment affects title positioning and visual balance.

1. Localice el Header Bar Settings sección.
   
2. Select the desired alignment option:
   • Left Aligned keeps page titles aligned to the left;
   • Oculto hides the header is hidden during scroll for expanded content space.

3. Haga clic en Guardar configuración.

Left alignment maintains consistency with standard mobile design patterns.

Configuring More Menu Placement

More Menu placement determines whether secondary navigation appears in the Tab Bar or header.

1. Vaya a Dashboard > MP App > Menus > Header Bar.
   
2. Localice el More Menu Placement dropdown in Header Bar Settings.
   
3. Select the desired placement:

• Bottom Tab Bar keeps the More Menu in the fifth Tab Bar position;
• Top Header Bar moves the More Menu icon to the header.

4. Haga clic en Guardar configuración.

More Menu placement affects Tab Bar capacity and overall navigation organization.

Updating Header Menu Items

1. Ir a la Header Bar Menu ficha.
   
2. Encuentra el More Menu item (usually the user avatar).
   
3. Click the dropdown arrow > Item Icon > Select Icon.
   
4. Choose an icon from the Icon Pack or upload your own.
   
5. Haga clic en el botón Select Icon, then the Guardar menú.
   

Repeat for any action buttons (por ejemplo, Create Post, Add Group, Send Message):

• Click their dropdown arrows.
  
• Choose or upload new icons.
  
• Haga clic en el botón Select Icon, then the Guardar menú.

Updating the Tab Bar Menu

1. Switch to the Tab Bar Menu ficha.
   
2. If the More Menu is now in the header, click Añadir al menú for one more item (e.g., Notificaciones) from the MemberPress App o Logged In Member sections.
   
3. Ensure there are no more than four items total in the Tab Bar.
   
4. Haga clic en el botón Guardar menú.

Tab Bar capacity increases only when More Menu successfully moves to the header.