{"id":121400,"date":"2023-07-05T11:01:44","date_gmt":"2023-07-05T05:31:44","guid":{"rendered":"https:\/\/theplusaddons.com\/docs\/create-custom-header-mobile-menu\/"},"modified":"2026-04-11T05:20:13","modified_gmt":"2026-04-10T23:50:13","slug":"create-custom-header-mobile-menu","status":"publish","type":"documents","link":"https:\/\/theplusaddons.com\/docs\/create-custom-header-mobile-menu\/","title":{"rendered":"How to create Custom Header with Mobile Menu, Woo cart, Search, Login and Sticky header Menu? [Video Tutorial]"},"content":{"rendered":"\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"How to create Custom Header with Mobile Menu, Woo cart, Search, Login and Sticky header Menu?\" width=\"1200\" height=\"675\" src=\"https:\/\/www.youtube.com\/embed\/96Wh1AEKNtU?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<h5 class=\"wp-block-heading\">Video Duration: 27 : 50<\/h5>\n\n\n\n<h2 class=\"wp-block-heading\">Video Overview<\/h2>\n\n\n\n<p>All needs related to navigation and whole header section is covered under our collection of widgets for elementor. You can create search bar, woocommerce mini cart, music bar, login section, mega menu and many more using this elementor header builder widgets.<\/p>\n\n\n\n<p>Biggest Navigation Builder for Elementor<br>300+ Unique Customisation Options<br>10+ Sections for Header area included<br>Unlimited Possibilities without Coding<\/p>\n\n\n\n<p>Horizontal &amp; Vertical Menu<br>You may use the navigation menu multiple ways in direct header or in templates for creative vertical menus. It also have some hover effects included.<\/p>\n\n\n\n<p>Mobile Menu<br>Packed with lots of responsive options, Mobile menu have various hamburger icon styles, as well as Complete styling and typography options.<\/p>\n\n\n\n<p>Mobile Swiper Menu<br>You can keep navigation menu as per the standard style and in mobile device it will be like a slider, which you can use by swipe.<\/p>\n\n\n\n<p>On Hover Reverse Effect<br>When you hover on one navigation menu, Remaining menus will have opacity on them. It will add plus in to your website\u2019s UX.<\/p>\n\n\n\n<p>Header Search Bar<br>We have included multiple styles of header search bar to use in main navigation area of your website using header meta info widget.<\/p>\n\n\n\n<p>WooCommerce Mini Cart<br>You ecommerce feature of website is half done without mini cart in your header, We have included multiple cart styles in our header bundle.<\/p>\n\n\n\n<p>Extra Toggle Bar<br>Show more information to your visitors by showing your elementor templates in extra toggle bar in navigation area.<\/p>\n\n\n\n<p>Header Music Player<br>Everyone loves music, Engage your visitors by adding music player in the navigation bar of your site using the plus addons.<\/p>\n\n\n\n<p>Header Logo Widget<br>Simple yet useful widget for header site logo, In which there is an option to use dual on hover logo, Tooltip, and SVG options.<\/p>\n\n\n\n<p>Most Advanced Mega Menu<br>This mega menu is created with all advanced options so you can achieve the best possibilities.<\/p>\n\n\n\n<p>No Coding Knowledge Required<br>It&#8217;s simple and intuitive, You can start easily and use any elementor widgets to craft your mega menu.<\/p>\n\n\n\n<div class=\"wp-block-buttons pseocta is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-a89b3969 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button pseocta\"><a class=\"wp-block-button__link has-nxt-global-color-1-background-color has-background wp-element-button\" href=\"https:\/\/theplusaddons.com\/pricing\/\">Get The Plus Addons for Elementor<\/a><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-buttons pseocta is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-a89b3969 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button pseocta\"><a class=\"wp-block-button__link has-nxt-global-color-1-background-color has-background wp-element-button\" href=\"https:\/\/theplusaddons.com\/elementor-widgets\/\">View 120+ Elementor Widgets Demo<\/a><\/div>\n<\/div>\n\n\n\n<style>\n.pseocta .wp-block-button{\n padding: 1em 0em !important;\n}\n<\/style>\n\n","protected":false},"author":2115,"featured_media":121401,"parent":0,"comment_status":"open","ping_status":"open","template":"","format":"standard","docs":[575,630],"class_list":["post-121400","documents","type-documents","status-publish","format-standard","has-post-thumbnail","hentry","docs-video-tutorials","docs-plus-widgets-videos"],"acf":[],"_links":{"self":[{"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/documents\/121400","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/documents"}],"about":[{"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/types\/documents"}],"author":[{"embeddable":true,"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/users\/2115"}],"replies":[{"embeddable":true,"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/comments?post=121400"}],"version-history":[{"count":0,"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/documents\/121400\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/media\/121401"}],"wp:attachment":[{"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/media?parent=121400"}],"wp:term":[{"taxonomy":"docs","embeddable":true,"href":"https:\/\/theplusaddons.com\/wp-json\/wp\/v2\/docs?post=121400"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}