Website - Builder

Updated 

To edit the design of your website, you need to access your builder.

  1. Start by navigating to the Website section in the menu.

  2. From there, find the Menu and pages option and click on it.

  3. Look for the Edit button and select it.

This will take you to the editor, where you can make changes to your website's design.

  1. To switch between pages within the builder, locate the top navigation bar.

  2. In the navigation bar, you'll see a list of pages. Choose the page you want to work on by clicking on it.

By following these steps, you'll be able to access your builder, edit your website's design, and easily switch between different pages within the editor.

Website builder - basic info

The builder is organised into three main components:

Sections

A section is a block on the page that helps structure the layout of your website. It provides a container for arranging content.

Rows

Within a section, you'll find rows. Rows are horizontal divisions within a section and are used to further organise and align content.

Columns

Each row is divided into columns. Columns allow you to create different-sized content areas within a row.

When configuring your website using the builder, you'll notice this hierarchical structure. Sections contain rows, and rows contain columns.

To customise your website's content, you can add modules to the columns. Modules are pre-designed elements like buttons, images, and text boxes.

If you want to have multiple instances of a module on the same line, duplicate them. This creates exact copies within the same column.

If you want to place a module on a different line or in a separate row, copy it. This allows you to create new instances in different columns or rows.

By duplicating and copying modules, you can easily arrange and distribute your website's content according to your design preferences.

You can also further customise the columns:

  1. Round corners: you can give columns a softer look by rounding their corners.

  2. Set background: columns can have a background, which can be a colour, image, or video.

  3. Adjust margins: you can specify the spacing around columns by adjusting margins.

These customisation options allow you to enhance the visual appeal and layout of your website's columns.

Adding a new section

To add a new section to your website, follow these steps:

  1. Access your builder by going to Website > Menu and pages > Edit.

  2. In the editor, look for the option to add a section.

  3. Click on Add section to proceed.

4. Choose the option to add a blank section. This allows you to create a section from scratch, without any pre-designed content.

5. Select the desired layout or structure for your new section.

By following these steps, you can easily add a new section to your website using the builder. This gives you the freedom to customise and design sections according to your specific needs and preferences.

Header

To edit your website's header, follow these steps:

  1. Hover your mouse over the header section of your website.

  2. When you hover over the header, a dropdown menu will appear.

  3. Click on Options, Add section or Remove content, depending on what you’d like to do.

Header - Options

To choose the type of header you want for your website, follow these steps:

  1. Locate the Options button related to the header section.

  2. Click on the Options button to access the header customisation settings.

  3. Within the options, you will find different header types or styles to choose from.

  4. Select the desired header type by clicking on it.

Header - Add section

If you want to add a section to your header, follow these steps:

  1. Locate the option to add a section within your header editing settings.

  2. Click on the Add section button to proceed.

  3. A list of available section options will be displayed.

  4. Choose the desired section you want to add to your header by selecting it from the options provided.

Headers - customising

Additionally, there is an icon located next to the Header that you can use if you want to make changes only to the header on the current page you're editing. This allows you to have a specific header design or content for that particular page while keeping the header consistent across the rest of your website.

Footer

The footer is applied to all pages of your website. It provides consistency across your site. You have the flexibility to use the same footer for all pages of your website or customise it for specific pages.

To edit your website's footer, follow these steps:

  1. Hover your mouse over the footer section of your website.

  2. When you hover over the footer, a dropdown menu will appear.

  3. Click on Options, Add section or Remove content, depending on what you’d like to do.

Footer - Options

To choose the type of footer you want for your website, follow these steps:

  1. Locate the Options button related to the footer section.

  2. Click on the Options button to access the footer customisation settings.

  3. Select the desired footer type by clicking on it.

Footer - Add section

If you want to add a section to your footer, follow these steps:

  1. Locate the option to add a section within your footer editing settings.

  2. Click on the Add section button to proceed.

  3. A list of available section options will be displayed.

  4. Choose the desired section you want to add to your header by selecting it from the options provided.

Footers - customising

Additionally, there is an icon located next to the footer that you can use if you want to make changes only to the footer on the current page you're editing. This allows you to have a specific footer design or content for that particular page while keeping the footer consistent across the rest of your website.