A Web.com Partner
Sign Up / Log In
Online Support Website Builder

How to Customise a Menu Block in Website Builder

Website Builder Blocks are ready-made sections of a website layout, which are already preconfigured to include the basic Features that you need in each section. You can easily customise each Block's Layout and Background to match the design that you want for your actual website.

Customising a Menu Block is slightly different from all the other Blocks because of the Menu element within it.

Follow the instructions below to customise the Menu Block in Website Builder:

  1. Click Sign Up / Log In at the top of this page.
  2. Select Account Manager from the drop-down menu.
  3. Enter your username and password then, click Log In.
  4. Click the Visit My Account button.
  5. Click Website Builder from the menu at the top of the page.
  6. Click on the Website Builder plan that you wish to manage.
    If you only have one Website Builder plan, you will automatically be redirected to its management page.
  7. Hover your mouse pointer over the [+] Icon at the upper right-hand section of the page and click Build Now.
  8. On the Sites page of your Website Builder Dashboard, hover your mouse pointer over the project/website that you would like to customise and click EDIT.
  9. Hover your mouse pointer over the Menu Block, then click the Layout Icon that appears on its far-right side.
  10. Under the Layout tab on the pop-up box, manage your Menu Block items as follows:

    Add a Menu Item - Click Add Feature and select the item to add it to your Menu Block.

    Note: The items that you can add to the Menu Block are a Logo, a Navigation Panel, Buttons, and Social Buttons. You can only add a maximum of 4 items onto the Menu Block.

    Edit a Menu Item - Hover your mouse pointer over a Menu Item and click the Edit link on its right, then follow the respective instructions below to customise each item:
    Logo Follow steps 10 and 11 on this guide.
    Navigation Panel Follow the steps below to configure the following:
    Font Size & Padding Click on the bar under each to adjust the Font Size and distance between Navigation Panel items.
    Font type, Style, & Format Select a setting from their respective drop-down lists.
    Text & Active Click the box to the right of each option to select a Text colour for the inactive and Active items on the Navigation Panel, then click Apply to use it.
    Revert Submenu Colours Click to enable/disable option.
    Menu Style Click on the box and select the desired Menu Style to change it.
    Button Follow step 9 on this guide.
    Social Buttons Follow step 10 on this guide.

    Note: Click the [←] Back Icon to go back and edit other items.

    Delete a Menu Item - Hover your mouse pointer over the Menu Item and click the [x] Icon on its right.

    Reorder Menu Items - Click and drag the Menu Item to move and reorder items.

  11. Click on the Design tab on the pop-up box to customise the following:
    Background Colour Click the box on its right to select a Colour and click Apply to use it.
    Alignment Select the corresponding icons to align Menu Items to left, center, or right of website page.
    Top & Bottom Borders Click the box on its right to select a Colour and click Apply to use it, then click on the bar below it to adjust the border's intensity.
    Hamburger Menu Option Click to enable this option and compress all the Menu Items into a single clickable three-dashed icon.
    Fixed Menu Option Click to enable this option and freeze the Menu Block at the top of the browser, while you scroll down to the bottom of the page - giving website visitors quick navigation access.

Congratulations! You just learned how to customise the Menu Block in Website Builder.

Was this helpful? Yes No 37% of people found this helpful.
{"message":""}