Page Sub Menu

You can use an Additional Sub Menu on any Page for Intra Navigation purposes.

Code Example

<!-- Page Sub Menu
============================================= -->
<div id="page-menu" data-mobile-sticky="true">
	<div id="page-menu-wrap">
		<div class="container">
			<div class="page-menu-row">

				<div class="page-menu-title">Explore <span>CANVAS</span></div>

				<nav class="page-menu-nav">
					<ul class="page-menu-container">
						<li class="page-menu-item current"><a href="#"><div>Gallery</div></a></li>
						<li class="page-menu-item"><a href="#"><div>Features</div></a></li>
						<li class="page-menu-item"><a href="#"><div>Models</div></a></li>
						<li class="page-menu-item"><a href="#"><div>Reviews</div></a>
							<ul class="page-menu-sub-menu">
								<li class="page-menu-item"><a href="#"><div>Expert Reviews</div></a></li>
								<li class="page-menu-item"><a href="#"><div>User Reviews</div></a></li>
						<li class="page-menu-item"><a href="#"><div>Compare</div></a></li>
						<li class="page-menu-item"><a href="#"><div>Build</div></a></li>
						<li class="page-menu-item"><a href="#"><div>Order</div></a></li>

				<div id="page-menu-trigger"><i class="icon-reorder"></i></div>

</div><!-- #page-menu end -->

Note: It is recommended that you place the Page Sub Menu code just below the Header.

Custom Page-Menu Breakpoints

You can now add Custom Breakpoints with Canvas for the Page Menus according to your needs. This is helpful when you have a longer menu and require the Page-Menu to be responsive on a Custom Breakpoint.

<body class="stretched" data-pagemenu-breakpoint="1200">

Last Modified: April 12, 2023