Tutorial Smart Widget Menu

Smart Widget Menu

Note:  Button Function performs same functions as Smart Widget Menu

Home     About Us     Contact Us

Default Menu Display

 

smart widget menu

  • Select Add - Smart Widget - Menu for default menu display.
  • Palette - Pages Menu will display on right of screen.
  • Make your selections from drop down menus.

Mobile:

  • Website Builder's powerful mobile display software allows you to select mobile appearance.
  • If Convert to Button is selected, when webpage display on mobile devices, a Button labled Menu will display.  
  • Your menu selections will display in a drop down window.

See Mobile Devices

  • Select Edit Menu Styles to display Custom Menu.
  • To change names and URL reference, click on name.
  • Click Delete to remove link.
  • Select Add a Link to add more links.

adv_sw_menu_1.fw

adv_sw_menu_3.fw

  • In Link Text box, type in the word or phrase you want to appear on your webpage.
  • If linking to a web page on your website, select the page name from the Page drop down menu.
  • Entering an email address inEmail will directly access email.
  • Entering Phone number will allow mobile devices to dial that number.
  • Entering address in Map will access Google map.
  • Link opens in defaults to Same Window.
  • Click Apply to save your information.
  • Click Done to save and exit.
  • Adjust the size of your menu items as desired.

Horizontal or Vertical Menus

  • Select Horizontal or Vertical Menu.  (See examples below)
  • Select Add a Link.
  • Keep Adding links until completed.
  • If you will not be linking to a page, put the  #  character in External URL box.
  • Use arrows to indent menu items under heading.
  • Click Done to save and exit.

smart widget 3.fw

 

 

 

button_function_10.fw

 

Edit Styles Directions

button_function_4.fw

 

Basic Styles Tab:

  • Select  Text Color - You can select from the color wheel, or enter in a 6 digit color number.  Be sure to use # in front of color.
  • BG Color (Background Color) is the color that will display as default.
  • Hover Text and Hover BG Color is the color that displays when the cursor is placed on the button.
  • You can select to display  menu item as a button

button_function_5.fw

 

Advanced Tab:

  • Underline Links - use drop-down menu to select your choice.
  • Sub-menu BG - you can choose a different background for sub-menus.
  • You can choose to separate menus by a horizontal or vertical line, and choose the color of that line.

button_function_6.fw

 

Buttons Tab:

  • In our example, the border color for the button is black.
  • The Corner Radius is 10.
  • Add Drop Shadows and Add Gradient are selected.