---
title: "How to Customize the App Navigation Header"
source: "https://docs.nexcess.com/software/learndash/customize-app-navigation-header/"
description: "Introduction Customizing your header bar and navigation menus elevates usability and reinforces branding in your LearnDash App. With the App Navigation Header,…"
vertical: "Software"
area: "LearnDash"
date: "2025-09-23"
last_modified: "2026-07-02"
---

# How to Customize the App Navigation Header

## **Introduction**

Customizing your header bar and navigation menus elevates usability and reinforces branding in your LearnDash App. With the App Navigation Header, you can move the **More Menu**, add custom **action buttons**, and update icons all while freeing up a fifth slot in the **Tab Bar** for more direct access to key app sections.

This guide walks you through header configuration options, **More Menu** placement, and icon customization for a cleaner and more engaging user experience.

## **Key Features of the App Navigation Header**

- **Customizable Action Buttons  
     Add and personalize two buttons in the header for quick actions like creating posts or messaging.
- **Relocatable More Menu  
     Move the More Menu from the Tab Bar to the top header, making space for an extra menu item.
- **Replaceable Icons  
     Change default action icons (e.g., Create Post, Add Group) to match your app’s branding.

## **Accessing Header Bar Settings**

1. In your WordPress Dashboard, go to **LearnDash App > Menus > Header Bar**.
2. Under **Header Bar Settings**, choose between:  
    
    - **Left Aligned** – Keeps the page title aligned to the left.
    - **Hidden** – Hides the header on scroll.

![Screenshot of Menus - Header Menu](https://docs.nexcess.com/wp-content/uploads/2026/06/How-to-Customize-the-App-Navigation-Header-in-the-Learndash-App-_-1.png)3. Click **Save Settings**.

## **Configuring More Menu Placement**

1. In the same settings area, find **More Menu Placement**.
2. Choose one of the following:  
    
    - **Bottom Tab Bar** – Keeps the More Menu in its default position.
    - **Top Header Bar** – Moves it to the top header.

![Screenshot of the Header Bar Settings](https://docs.nexcess.com/wp-content/uploads/2026/06/How-to-Customize-the-App-Navigation-Header-in-the-Learndash-App-_-2.png)3. Click **Save Settings**.

## **Troubleshooting and FAQs**

**Q: Custom header icons look misaligned.  
 A: Upload square icons with transparent backgrounds, and enable **Color Fill** to match your Tab Bar style.
