Email-Icon Created with Sketch. Group 3 Created with Sketch. Domains-SVG-Box Created with Sketch. Domains-SVG-Box Created with Sketch. Domains-SVG-Box Created with Sketch. Hosting-SVG-Box Created with Sketch. Hosting-SVG-Box Created with Sketch. Icon-Internet Created with Sketch. Hosting-SVG-Box Created with Sketch. Icon-Internet Created with Sketch. Icon-Internet Created with Sketch. Hosting-SVG-Box Created with Sketch. Hosting-SVG-Box Created with Sketch. Trust Pilot Stars Created with Sketch. 1-5-million Created with Sketch. Control-panel-Icon Created with Sketch. WSB-Brush Created with Sketch. WSB-Brush Created with Sketch. WSB-Brush Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. icon-slider-next Created with Sketch. icon-slider-prev Created with Sketch. Webmail-icon Created with Sketch. heart Created with Sketch. Open-24-7 Created with Sketch. open24 Created with Sketch. 24 7 trusted Created with Sketch. Fill 1 Created with Sketch.

Getting started with Website Builder

1. Logging in to Website Builder
2. Choosing a template
3. Creating your first page
4. Adding more pages
5. Editing a page or template
6. Saving your changes
7. Previewing and Publishing your website

1. Logging in to Website Builder

Get started with building your website by logging into Website Builder. You can access Website Builder directly through your browser either from the One.com Control Panel, or from this page:

https://webeditor.one.com/

The user name is the email address, and the password is the same as the one you use for your One.com Control Panel.

Select Website Builder in the overview.

2. Choosing a template

After logging into Website Builder the first time, you will be asked to choose a template for you to build your webpage. You can select another template later, combine different templates or even build your own layout by choosing a blank template.

Select the template you want.

3. Creating your first page

When you have chosen a template, four pages will automatically be created. These pages will be called "Home", "About", "Photos" and "Contact". Enter new titles if you prefer, or keep the default titles. The page called "Home" will be used as your Start Page for the website you are creating.

Pages will automatically be created.

4. Adding more pages

Add a new page by clicking the New Page-button. If you want a different design on your page, you can create a page with another template. You can add a page with a different template, by selecting Use another template in the dropdown menu.

Click New page.

You can add subpages to a specific page by clicking on the arrow next to the page title, and choose Add subpage... in the menu that appears.

Select the page layout you want.

5. Editing a page or template

You can either edit a specific page, or the design template. When activating Edit Page changes will only affect the chosen page. When Edit template is activated, changes will be applied to the overall design for all pages based on this template. Make sure that you select the right edit mode, before you start editing.

Edit template is activated.

Your pages and templates are built with elements called Components. You can combine and customize these components and make up a unique look for your website.

To add a Component to your page, click and drag the specific component from the left menu to where you want to place it on the page. The arrow that appears, indicates where the component will be placed when you drop it on the workspace.

Add component to workspace.

The stripes appearing over components in the workspace, tells you that they cannot be edited in the edit mode you have chosen. You have to switch edit mode, to either Edit page or Edit template.


Each Component has different Properties that can be edited through the menu that appears under the workspace when you click the Component. Make sure that the component you want to edit is added to your workspace, and that you click the specific component you want to edit. By editing the Properties you can change the look and the behaviour of the selected component.

Each component has properties.

The different components you can add are:

Background: a container for other components.
Text: a box with text content.
Button: make a clear call-to-action
Gallery: an easy way to display several images
Image Slider: add a carousel of images that automatically shifts
Image: an image from your web space.
Menu: links your pages together and makes it possible to navigate between the different parts of your website.
Table: a table with rows and columns.
Document: display for example a Word file on your site
Video: a video from YouTube.
Facebook Page: a Like-button for your Website Builder pages.
Share Buttons: for Facebook, Google+, LinkedIn and Twitter.
Code: custom HTML- and JavaScript-code.
Contact Form: quick way for people to get in touch with you
Webshop: get started with selling products online

The Undo- and Redo-buttons placed in the upper right corner, make it possible for you to move back and forth through the changes you have made.

Undo and Redo buttons in workspace.

6. Saving your changes

Click the Save-button to make sure your changes are being saved. The Save-button is placed in the upper left corner.

Click Save to make sure you don't lose important changes.

7. Previewing and Publishing your website

You can preview the changes you just made to your page, before publishing the website by clicking the Preview-button. The Preview-mode lets you inspect your site, without making your changes visible to others. When you are satisfied with your website, click the Publish-button to update your live website with your changes. By clicking Publish, you will make your site visible to others, when they enter your domain name in the address field in their browser.


Preview your website.

Congratulations, you have now built your first website using Website Builder!