WebSite X5 Evo and Pro
Everybody can easily create a website using WebSite X5, even with no programming or graphic design skills. It is enough to follow the intuitive guided procedure to turn your initial idea into a complete online website.
Do you want to find out how? Watch this video: 5 minutes are enough to learn the basic steps. Otherwise, you can keep reading.
With WebSite X5 you can then create your website in 5 steps:
Step 1- Set up your project
The first step to create a new website is to start a new project by defining some basic general configurations:
- Start WebSite X5 and choose Create a new Project in the Project selection window, then click on Next.
- You will find the Template Selection window. Check out the templates categories: by selecting the Preview button, you can browse though the pages of the template to see how it has been structured. Choose the template you like and click Ok.
- Now you will find yourself on Step 1-Website Settings: insert at least the Website Title.
#tip - Don't worry if you don't know how to fill out this part with the information required to set up the project: you can come back to this section later, when you have a clearer idea about your project.
Step 2 - Customize the template
As a matter of fact, templates are complete mini-sites with their own graphic layout, pages and contents. You can use the Live Preview to open them on the local browser and verify how they've been developed, as well as how they adapt to the different resolutions on tablets and smartphones.
All templates are fully customizable. There are many things you can do, such as adding your company logo in the header of the template:
- Go to Step 2 - Template > Template Content.
- Stay in the Header section. Select the icon for the Image Object, drag it into the work space and drop it. You can position and resize it thanks to the anchors or through the options in the toolbar.
- Double-click the Image Object you just added to access the settings window: import the file you want to use for your logo and confirm your choice.
- Select the Preview button to open your website on the local browser and verify the way it is taking shape.
#tip - With WebSite X5 you can decide to use and customize one of the available preset templates or to create an original one from scratch: you have total freedom to achieve the desired result.
Step 3 - Add pages
Now that you have defined the general layout for your pages you can move on to the next crucial aspect: setting up the tree structure for your website.
Let's assume you have chosen a blank template during the previous step, and that now you want to create a very simple website with a Home Page, a Products page with two sub-pages for Products A and B, the About and the Contact pages.
That's what you need to do:
- Go to Step 3 - Map: as you can see, some default pages are already present in the Map, but you can rename them and add more.
- Select the Home Page and select New Level: instead of "Level 1" type "Products". Confirm with the Enter key.
- Select the Products level you just added and select New Page: rename it "Product A". Do the same for the "Product B" page.
- Select Page 1: double-click it or select the Rename button to change its name into "About". Do the same for "Page 2" to rename it into "Contact".
- You don't need Page 3: select it and click on the Remove button.
- Now select the Preview: as you can see, the menu now reproduces the Map you have set up. The pages you need are there, but they are still empty.
#tip - You can go back to the Map and edit it at any time: the navigation menu will automatically update according to the changes you make.
Step 4 - Import your contents
It's now time to move on to the contents. You can take care of this aspect by working in a completely visual way: each page is represented by a grid which you can fill in by inserting the contents in each cell.
Let's recreate this Contact page:
There is an introductory text block, an image, a second "Send a message" text block and an e-mail form.
- On Step 3 - Map, double-click the Contact page or select the page on the Map and click on the Next button.
- You are now on Step 4 - Page Creation and you're ready to set up the Contact page.
- Select the Text Object from the list of the available Objects and drop it onto the grid, so it fits in the two cells on row 1.
- Double-click the Object you just added in the grid to open the editor: type and format the text as you are surely used to.
You can add the other contents in the same way:
- Select the Image Object from the list of the available Objects, drag and drop it so it fits into the 2 cells of row 2 in the grid.
- Double-click the Object to access the settings window and import the image file you want to use.
The procedure for the e-mail form is the same:
- Click on the button to add a new row into the grid.
- Select the Contact Form Object and drag and drop it onto the page.
- Double-click the Object you have inserted to access the settings window: here you find all the options so set up the fields list, configure the sending options and define the graphic style.
Remember: every time you need to, you open the Preview to check the result on the local browser.
#tip - As you probably have noticed, Objects are the blocks of content which are at the base of the page creation. With WebSite X5 you have all the necessary Object: from texts to images, from galleries to e-mail forms. Moreover, on the Marketplace you can find many Optional Objects to enrich your websites with cool functions: alternative galleries, maps, animated buttons and much more.
Step 5 - Export your website online
Now that you have inserted all the contents on your pages, your website is ready. You just need to export it online, so that everyone can see it.
- Go to Step 5 - Export and select Upload the Website to Internet.
- Insert the required Connection parameters: if you're not sure about them, get in touch with your Provider, i.e. the service which provides you with hosting and domain.
- Confirm and start the export process.
#tip - Remember that with WebSite X5 the web hosting service is included for you: find out all the details on the "Web Hosting" page of your Help Center account.