Knowledge Base

How To Use the Editor for Website Builder

Website Builder a platform that allows you to construct a website fast and easy. Using its drag and drop functions, you can build a professional-looking website without any help from a Website Developer, or having any background knowledge in Codes and Scripts.

Once you've purchased a Website Builder Plan, you will be able to access the Website Builder Dashboard, where all your website projects can be managed. From the dashboard, you will need to access the Website Builder Editor for a specific project to begin or continue building it.

Accessing the Website Builder Editor

You can access the Website Builder Editor using the following steps:

  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 top-right 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'd like to customise and click EDIT.

Congratulations! You just accessed the Website Builder Editor. Stay here to learn all about the controls and functions available for you within the Website Builder Editor.

Navigating through Website Builder Editor

Your Website Builder Editor will automatically open its corresponding website project with the Template you selected. Here you'll be able to add your own content and customise the Template to transform it into the website that matches your brand.

Navigate through all your editor's controls to get a grasp of all the amazing things that you can do with your website. Below is a description of each control, grouped according to their position on your Website Builder Editor:

Top-Left Controls

Account Manager Icon Click on this icon to return to your Website Builder Dashboard and select a different project to work on or create a new project.
Undo and Redo Icons Click on the corresponding icon to instantly Undo or Redo an action whenever needed.

Top-Left Sidebar Controls

Build Click on this icon to open your library of Features, then click the Blocks tab to open your library of Blocks.

These are elements or sections of a website page that you can easily drag and drop onto your website project. Learn more about Features and Blocks by clicking here.
Pages Click on this icon to view a list of your website Pages, manage them and add new ones. Learn more about managing Pages by clicking here.
Store Click on this icon to manage your Store's products, discounts, orders and other settings, including payment channels and shipping options to show on your site.

Learn how to start your online store in Website Builder by clicking here.

Note: This option is only available for the Website Builder eCommerce Plan and will not show for all other plans.

Theme Click on this icon to customise your Template's Theme. You can learn more about this by clicking here.
Settings Click on this icon to access the following options:
  • General - Customise your Favicon or browser icon, including Image Optimisation and Back-To-Top Button settings.
  • Domains - Manage the Domain Names for your website.
  • Marketing - Access the different Marketing Tools that you can use for your website.
  • Advanced - Click here to customise your website's 404 Error Page or delete your Site and Store.

Bottom-Left Sidebar Controls

Show/Hide Layout Click on this icon to break down your website page into placeholders - making it easy for you to view the available spaces on your page layout - then click again to hide it.
Lock/Unlock Sidebar Click on this icon to unlock and hide the sidebar giving you more space to work with. Then, hover your mouse pointer over the left side of your screen for the sidebar to re-appear, and click on the same icon to lock it back in place.

Top Center Controls

Editor Modes Click on the corresponding icon to switch the editor to Desktop, Laptop, Tablet, or Phone mode.

This will let you build your website in the mode that you choose, having full access to the editing options.

Note: If the browser you're using for the Website Builder Editor is not in full screen, the Desktop mode will not be available.

Top-Right Controls

Preview Link Click on this link to Preview your website.

You will also be able to switch between different Preview modes: Desktop, Laptop, Tablet, and Phone; however, editing options will be limited.

Note: If the browser you're using for the Website Builder Preview is not in full screen, the Desktop mode will not be available.

Publish Button Click on this button to Publish your website live, making it accessible to anyone using the Domain Name you choose.

Note: Every update or change that you make to your projects are automatically saved as soon as they are made - that is for as long as you are connected to a stable internet connection.

Congratulations! You just learned to navigate through the Website Builder Editor.

Did you find this article helpful?

* Your feedback is too short