First please install and activate Elementor and Kingo Theme Elements for Elementor plugins before you proceed.
Once you get required plugins installed. Please follow below steps.
Setting up header & navigation menu using “Header Content” which build using Elementor page builder. It provides more flexibilities to fully customize main header content & layout.
First please navigate to Appearance > Customize > Navigation > General > Display Header Content From and select “Header Content”
Then look at “Default Header Content Settings” section.
- Default Header Content – Select default header content for general pages & posts
- Default Sticky Header Content – Select default sticky header content for general pages & posts
- Default Transparent Header Content – Select default transparent header content for general pages & posts
You can select each header content options from your current header posts. However if you don’t create anything yet. Please follow below instructions.
Create header content posts
We are using Elementor Page Builder plugin so you can use its drag&drop user interface to create your header contents.
Please navigate to WordPress Dashboard > Headers > Add New Header. Then enter its title and click “Edit with Elementor” option.
Now you will open Elementor page builder editor. You can customize menu columns, contents including social icons, buttons, logo image etc.
Adding Navigation Menu Widget
If you want to display your custom menu which you have already created it in Appearance > Menus. Simply select “elements” tab and search for “navigation”.
You will find “Theme Navigation Menu” widget there , drag it to where you want to display on the right side.
Then you can customize its options including typography, margin etc.
Adding Side/Mobile Menu Link
You can use widget such as b
utton to add link to mobile menu. By adding CSS ID “elementor_mobile_nav”. Please see below example of using button widget.
Import Demo Navigation Menu Templates
Click “Add Template” button and select “Blocks” section. Then select “Theme Navigation Menu” for select box option.
You will see list of predefined templates there. Select one you want to import and click “Insert”.