In this guide, we help you to quickly get started with our Website Builder. We'll guide you through the basic steps for creating your new website and publishing it.
- Step 1 - Find Website Builder in the control panel
- Step 2 - Add basic information about your business or project
- Step 3 - Choose a template and colour theme
- Step 4 - Add, edit and remove components
- Step 5 - Edit text and images
- Step 6 - Add or rename pages
- Step 7 - Save
- Step 8 - Preview
- Step 9 - Publish
Step 1 - Find Website Builder in the control panel
You access your Website Builder from its own tile in the one.com control panel.
- Log in to the one.com control panel.
- Click Go to Website Builder.
Tip: Are you using the trial version of Website Builder? Then you need to log in through this link instead: Log in to the trial version of Website Builder.
If you haven't started working on your Website Builder site yet, you'll see the following screen. Click Let's do it! to get started.
Step 2 - Add basic information about your business or project
- Choose a name for your business or project. The name will be shown at the top of your website and in search engine results.
- Click Next after you've entered your name, or I'll add this later if you don't want to add your name right now.
- Add a logo. Simply drag and drop it into the blue highlighted box or click on Select a file to upload a file from your computer. We recommend using a file in the .png format with transparent background and a size of 200 KB.
- Click Next to continue, or I'll add this later if you don't want to add it now.
- Add your contact information, such as email, phone number and address. This will make it easier for your website visitors to reach out to you.
- Click Next to continue, or I'll add this later if you don't want to add this information now.
- Describe what your site is about in a few keywords. Based on those keywords you'll get template recommendations to choose from.
- Click Next to continue, or I'll add this later to skip this step.
Step 3 - Choose a template and colour theme
Based on the keywords you entered in the previous step, you'll now see a selection of recommended templates. The template determines the overall design of your site, like layout and fonts. All templates are fully customisable, so you can always change things later. Click the button below to browse all available Website Builder templates now:
Each template also comes with a suggested colour theme to ensure that colours of, for example, buttons and backgrounds fit together and that the same colours are used consistently across all pages of your website. Already when you preview a template, you can easily change to a different colour theme in the menu on the left, to make the colours fit your brand design.
- Look at the recommended templates, or select See all templates to browse the whole collection.
- Click Preview Template to see all pages of the template in full screen.
- Choose a different colour theme in the menu on the left (optional).
- Click Back to look at other templates, or Done inside the preview of the template that you want to use for your site.
Step 4 - Add, edit and remove components
Your Website Builder workspace is now set up with the template you chose, and you can start building your site. Each page in your Website Builder consists of a header, a footer and at least one section. The content that you place in the header and the footer will be shown on all pages of your website. You can, for example, use the header for your menu and your logo, and the footer for your contact information.
We recommend reading the following guide to learn more about header, footer and sections:
Add a component
All content on your site consists of components, for example, text, images, buttons, etc. All available components can be found in the menu to the left. You can easily add more components to your pages by dragging them from the menu over to your workspace.
- The thin red lines indicate how the component is aligned with other components.
- The red area indicates that you're placing the component on top of another component.
Edit a component
Double-click on a component to open the settings for this component. In these settings you can, for example, change the style and size of the component or have it link to another place. If you click outside the component, the settings menu disappears again.
Tip: Instead of changing the size of the component in the settings, you can also drag the orange handles on all corners and sides.
Remove a component
To remove a component, select it, and click delete on your keyboard. You can also click on the icon that looks like three dots in a circle and select Delete from the menu that appears.
Step 5 - Edit text and images
A lot of the content on your site will most likely be text and images. So let's pay a bit more attention to these components.
All texts in our templates are dummy texts. You can easily replace them with your own text. Simply double-click on a component to edit it.
The images in our templates are stock images that you are welcome to keep, but most likely you want to replace them with your own to best represent your business or project.
- Click on an image to select it.
- Click the Replace image button that appears above or below the component.
- Select the image you want to replace it with or click Upload in the top right corner to upload images from your computer or another location.
- Click Save.
Step 6 - Add or rename pages
You can always add more pages from the pages menu on the left in the top bar. It's highlighted with a blue background. Just click the + Add new page button and follow the instructions.
Note: Remember that the standard version of Website Builder only allows you to publish up to 5 pages. If you want to publish more pages, you need to upgrade to Premium.
You can also change the name of an existing page:
- Select the page in the pages menu in the top bar.
- Click on the circle icon with the three dots to open the page options.
- Select Settings.
- Here you can, among other things, edit the page name that is visible in the menu and browser tab.
- Click Save to save your changes.
Step 7 - Save
Remember to save your site often! That way, if something goes wrong, you won't lose all your changes. Are you not happy with the result? Use the arrows in the top bar to undo or redo your changes. The only thing you cannot undo is the deletion of a page.
Tip! If you've signed up for Premium, you have access to the built-in Backup and Restore function that allows you to load previously saved versions of your site. Every time your site is saved, a backup is created automatically.
Step 8 - Preview
It's a good idea to check a preview of your site, before you publish, to see how it will look for your visitors.
- Click the Preview button in the top bar.
- Navigate through the menu to see all pages of your site. Also, check the mobile version of your site.
- Click Back to editor to return and implement possible changes.
Step 9 - Publish
When you're ready to share your site with the world, it's time to publish.
- Click the Publish button in the top bar.
- Confirm your choice by clicking Publish again.
Well done! You've now created your website, and it is being published. Depending on your pages and content, this may take a couple of minutes.
Tip! Click your domain in the menu in the top right corner to check your site online. Don't see your site after publishing? Check if you have set your start page correctly.