Nav Menu, Nav Logo & Nav Search widget let you to display Nav Menu with Logo & Search. You can easily build this stunning widget in different style, with EnterAddons.
Using Nav Menu, Nav Logo and Nav Search Widget :
You can see the below video to get an insight into how you can use the Nav Menu, Nav Logo & Nav Search Widget, Or you can follow the documentation whichever you find convenient.
- VIDEO-1 ( Nav Menu Widget )
- VIDEO-2 ( Nav Logo & Nav Search Widget )
Firstly, select the Nav Menu Widget from the menu bar on the left-hand side of your screen and drag and drop it in the selected area.
Step1
Secondly, from ‘Content’ section you will get Nav Menu section.
From ‘Nav Menu’ section you can select menu i.e ‘Menu1’, that previously made in WordPress dashboard > Appearance > Menus.
Step2
From ‘Style’ section you can stylize the widget. You will get the Nav Menu Wrapper Style, Menu Item Style, Dropdown Menu Style, Menu Item Before/After Style and Humburger Menu Style section respectively.
After that, from ‘Nav Menu Wrapper Style‘ section you can add wrapper-width, wrapper-height, background-type, horizontal-alignment, vertical-alignment, margin, padding, border-type, border-radius and box-shadow respectively, and that is given below.
Then, from ‘Menu Item Style’ section you can add typography, menu-item-gap, margin, padding, border-type, border-radius, box-shadow and background-type respectively in NORMAL view.
Moreover, from this section you can see HOVER view.
After that, from ‘Dropdown Menu Style’ section you can add color, typography, text-stroke, margin, padding, box-shadow, border-type and border-radius respectively in NORMAL view.
Moreover, from this section you can see HOVER view.
After that, from ‘Menu Item Before/After Style’ section you can add / select line-animation, active-menu-before-line ( show / hide ) option, line-width, line-height, top-position, left-position and background-type respectively.
Moreover, from this section you can you add / select line-animation, active-menu-after-line( show / hide ) option, line-width, line-height, bottom-position, left-position and background-type respectively, and that is shown as below.
Then, from ‘Humburger Menu Style’ section you can add menu-icon, menu-close-icon, icon-size, margin, padding, border-type, border-radius, box-shadow and background-type respectively in NORMAL view.
Moreover, from this section you can see HOVER view also like below.
Again, from this section you can add menu-icon, menu-close-icon, icon-size, margin, padding, border-type, border-radius, box-shadow and background-type respectively.
Moreover Again , from this section in ‘Humburger Menu Area’ you can add dropdown-top-position, left-position, width, height, item-alignment, border-type, border-radius and background-type respectively.
Step4
Firstly, select the Nav Logo Widget from the menu bar on the left-hand side of your screen and drag and drop it in the selected area.
After that, from ‘Content’ section you can stylize the widget. You will get the Logo section.
Then from ‘Logo’ section you can add logo, active-sticky-logo ( show / hide ) option and add custom-logo-link also respectively, that shown below.
After that, from ‘Logo Wrapper Style’ section you can add wrapper-width, wrapper-height, horizontal-alignment, vertical-alignment, margin, padding, border-type, border-radius, box-shadow and background-type respectively.
Then, from ‘Logo Style’ section you can add width, height, logo-image-margin, logo-image-padding, horizontal-alignment, border-type, border-radius, box-shadow and background-type respectively.
Step5
Firstly, select the Nav Search Widget from the menu bar on the left-hand side of your screen and drag and drop it in the selected area.
After that, from ‘Form Content’ section you can add / select search-type ( style1 or style2 ) option, add search-form-placeholder, width, height, logo-image-margin, logo-image-padding, horizontal-alignment, border-type, border-radius, box-shadow and background-type respectively.
Then, from ‘Style’ section you can stylize the widget. You will get the Nav Search Form Style, Search Modal Open Button Style, Modal Close Button Style and Search Modal Style section respectively.
After that, from ‘Nav Search Form Style‘ section in ‘Search Form Wrapper’, you can add width, height, horizontal-alignment, margin, padding, border-type, border-radius, box-shadow and background-type respectively.
Moreover, from this section in ‘INPUT FIELD’ tab, you can add search-input-text-color, search-input-placeholder-color, width, height, margin, padding, border-type, border-radius, box-shadow and background-type respectively.
Moreover Again, from this section in ‘SUBMIT BUTTON’ tab, you can add icon-size, width, height, margin, padding, border-radius, box-shadow, search-button-text-color and background-type respectively.
Then, from ‘Search Modal Open Button Style‘ section you can add icon-size, width, height, margin, padding, border-type, border-radius, box-shadow and background-type respectively in NORMAL view.
Moreover, from this section you can see HOVER view.
After that, from ‘Modal Close Button Style‘ section you can add icon-size, width, height, margin, padding, border-type, border-radius, box-shadow and background-type respectively in NORMAL view.
Moreover, from this section you can see HOVER view.
After that, from ‘Search Modal Style‘ section you can add border-type and background-type respectively.
Step6
Finally, after finishing all the editing, click update, and then click on ‘Preview > Preview in new tab’ to see your work live.