Hello Website Builder offers a collection of ready-made Banners (outlined in pink below). Select a template Banner block, drag it from the library, drop it onto an available placeholder and then configure it to suit your needs.
To select a Banner block for your site:
- Click BUILD in the left-hand sidebar of the Hello Website Builder:
- Switch to the BLOCKS tab and click on Banners.
In the panel that appears, locate and click the Banner template you would like to use as a Banner for the website you are building:
- Drag and drop the selected Banner block onto an available placeholder when the placeholder is highlighted in red:
You can now resize the Banner and modify its look and feel to suit your needs.
To resize a Banner :
- hover over it to display the resizing control at the bottom of the block:
- click the resizing control, then drag it upwards or downwards to modify the height of the Banner. The resizing control displays the height of the padding on either side of the block, upper or lower. When done resizing, drop the resizing control to save the change and stop resizing.
To change the look and feel of the Banner, hover over it and click the Settings icon in the right-hand floating sidebar that appears:
The LAYOUT tab allows you to modify the layout of the Banner:
- set the number of columns (just drag and drop the COLUMNS AMOUNT control), and
- align the elements of the layout vertically (to place them in the center of the Banner block as shown below):
The BACKGROUND tab of the Settings dialog allows you to:
- upload the background photo for the Banner, and
- change the background/overlay color.
BACKGROUND COLOR: click the square to open the color picker and select the background color for the Banner to be displayed if the Banner has no background photo; click Apply to save the change and close the color picker.
Drag and drop the background image into the BACKGROUND PHOTO box.
You will immediately see the new background:
Alternatively, click the BACKGROUND PHOTO box to open the Upload Image dialog and locate the image on your computer:
- drag and drop the image into the DRAG & DROP frame,
- or click inside the DRAG & DROP frame to open the Upload from Your Computer dialog and select the image to upload.
OVERLAY: click the square to open the color picker and select the overlay color; then drag the control to set the opacity level for the background photo.
Select text inside a Text or Heading element to display the editing menu and be able to modify the item: