ionic make a custom app header code example
Example 1: header for app ionic
<ion-app>
<ion-menu content-id="main-content">
<ion-header>
<ion-toolbar color="primary">
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-list-header>
Navigate
</ion-list-header>
<ion-menu-toggle auto-hide="false">
<ion-item button>
<ion-icon slot="start" name='home'></ion-icon>
<ion-label>
Home
</ion-label>
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
<ion-page class="ion-page" id="main-content">
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-toggle>
<ion-button>
<ion-icon slot="icon-only" name="menu"></ion-icon>
</ion-button>
</ion-menu-toggle>
</ion-buttons>
<ion-title>Header</ion-title>
</ion-toolbar>
</ion-header>
<ion-content class="ion-padding">
<h1>Main Content</h1>
<p>Click the icon in the top left to toggle the menu.</p>
</ion-content>
</ion-page>
</ion-app>
<ion-menu-controller></ion-menu-controller>
Example 2: header for app ionic
<div class="bar bar-header bar-positive">
<h1 class="title">bar-positive</h1>
</div>