How To Add a Button in Website Builder

The template you choose for creating your website in Website Builder will have pre-added Button Features. You can easily customise it according to how you want it to appear on your actual website, or add a new one and customise it.

Add and customise the text and appearance of your website's Button Features in Website Builder using the steps below:

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. Access the editing options for the Button Feature using the applicable steps:
   
   If Button is in the Menu Block:
   
   The Menu Block is the top section of your website where the menu is located for most templates, and depending on the template, a Button is pre-added in this Block.
   
   To customise this Button, hover your mouse pointer over it and click the Edit option that shows. A pop-up box will appear where you can customise the following:

   Text	Specify the text that you would like to appear on the Button.
   Link To	Select where you would like to link the Button from the following options in the first drop-down list: Page - Select the Page from the second drop-down list. Anchor - Select the Page and Anchor from the second drop-down list. URL - Enter the specific URL in the space provided. File - Click Select your file then drag and drop the file or browse your computer's folders to upload it. If the file has already been uploaded in Website Builder, click on the My Documents tab at the top to select it. If the file is on another online service, click on the Clouds tab at the top to connect to the service and locate the file. Email address - Enter the specific Email address in the space provided. Phone number - Enter the specific Phone number in the space provided.
   Type	Select the type of Button formatting from the drop-down list, then select a preferred shape below it and adjust the Border Size if needed.
   Background	Customise the Button's background colour.
   Letter Spacing	Click and drag within the bar to adjust.
   Font Size	Click and drag within the bar to adjust.
   Font	Select the font type to use from the drop-down list.
   Style	Select the font style to use from the drop-down list.
   Format	Select the font formatting to use from the drop-down list.
   Empty Box or Icon	Click on the Empty Box, or the preset icon if any, to select and add an icon in your Button.
   Colour & Alignment	Customise your icon's Colour and Alignment.
   Open Link In New Tab	Enable or disable according to preference.

   Other Actions:
   Hover your mouse pointer over the Menu Block and click the Layout icon that appears on the right side to open a pop-up box, then proceed with any of the actions below:

   • Delete a Button Feature from the Menu Block - Hover your mouse pointer over the Button bar and click the [x] icon that appears.
   • Change the Placement of the Button Feature in the Menu Block - Click on the Button bar and drag to change the order of the items.
   
   If Button is NOT in the Menu Block:
   
   If the Button is in a different Block or section, or you would like to add a new one, follow the steps below:
   1. Click on the Button to show the editing options above it.
      Or, add a new Button Feature first: click Build from the left-side menu, drag and drop the Button icon onto a placeholder on your website page, then click on it to show editing options.
   2. Select the text on the Button to edit then use the editing options above it to customise the following:

      B / I	Click to set the text to Bold or Italic font style.
      Align	Click to set the Alignment of the Button on your website page.
      Link	Click to select where you would like to Link the Button. Description is similar to instructions given under Link To in the table above.
      Font	Click to customise the Font Type, Style, and Format.
      Size	Click to set the Font Size and Font Letter Spacing.
      Colour	Click to set the Text Colour.
      Icon	Click to select an Icon, then customise the Icon's Colour and Alignment.
      Settings	Click to select the type of Button format from the drop-down list, then select a preferred Button Shape below it, adjust the Border Size if needed, and select a Background Colour.

Congratulations! You just added and customised a Button in Website Builder.