Template selection

Step 0 - Project Selection >

Template selection

Previous pageReturn to chapter overviewNext page
Show/Hide hidden text

One of the keys to a successful website is an attractive appearance. First impressions count, and new visitors' opinions on your website will be largely influenced by its graphic layout, before they even start to look through the contents. A well thought-out and professional-looking design gives the impression of a good quality site that is worth looking at.

The first thing you do, after opening a new project in WebSite X5, is choose a template for it. You have several options here:

1. You can use one of the 500 ready-to-use default templates that come installed with the program, or you can buy one from WebSite X5's Marketplace.
2. You can use a custom template: this may be a template you have already created,  customizing one of the default templates or starting from an empty template skeleton.
3. You can use an empty template skeleton to create a completely new template.

It is in this Template selection window that you can browse through the template libraries and choose the best solution for your project.

You can speed up your search for the right template by using the View filter, which has a number of options:

Highlighted: only the templates that are most frequently used, or have been recently released, are shown.  
For sale: only the templates that are for sale in  WebSite X5's Marketplace are shown.
Bought: only the templates that have been bought from WebSite X5's Marketplace are shown.
Custom: only the custom templates, which have already been created and saved, are shown.
Empty: some basic template skeletons are shown, which can be used as a starting point for creating a new template.

You can also use filters for template categories: All the categories, Business, Food, Sport, etc.

Once you have made your choice of template, click on the OK button  to go to Step 1 - Settings where you can start to enter some general parameters for your project.

All the options for completing your template can be found in Step 2 - Template. Here, you can indicate how the template behaves on mobile devices (in the Resolutions and Responsive Design window), how you can actually create a brand new template from scratch (in the Template Structure window), how you can change the template (in the Change Template window) and how you can manage all the custom templates (in the Custom Template Management window).

Click to expand/collapseReference: The Default Templates

WebSite X5’s default library contains over 500 templates, all of which have been carefully designed so that you can create attractive and professional websites. Every template is optimized for responsive website creation.

Templates are available as either graphic templates only or as the dual option of graphic and full templates.

Graphic Templates are graphic layouts that define the structure and appearance of the pages, including the layouts of the header and footer. They can be easily applied to any project you have started, making them the ideal choice if you want to give your website a new look, without changing all the contents.

Full Templates, on the other hand, are more like mini-websites, with a complete graphic layout, styles and a certain number of pre-prepared pages. In fact, the full templates are really ready-to-use projects (.IWZIP files) and, as such, provide an excellent starting point from which to create a new website.

This library is constantly being updated with new templates, to give you even more choice. In some cases, the new templates must be purchased, but often they are free.

Once inside WebSite X5, you can display a preview of all the available default templates, but not all of them are actually installed with the program. Free templates can be downloaded immediately and those that are for sale can be downloaded when your purchase has been completed.  The latest additions to the library, free templates and those for sale can be easily recognized by the rosette shown next to them.

When you select a template from the list, a preview of it is shown in the preview window. If the selected template is for sale, the description includes its price and the Buy now button. You will need to have enough credits and be connected to the Internet to complete the purchase.

If you select a template from the list that is free of charge, or that you have already purchased but not installed, it will be downloaded automatically and applied to the current project.

You need to be connected to the Internet to:

Display previews of all the available templates. If Internet is not active, only the templates installed with the Program will be visible in the preview window.
Install a new, free-of-charge, template.
Buy and install a new template.

As already mentioned, all the default templates are optimized to support responsive website creation. This means that, if you decide to create a responsive website, some breakpoints are enabled automatically, according to the selected template: there is a ready-to-use version  of the template for each viewport determined by the breakpoints, in which the elements that are present are suitably re-arranged according to the available space. You can add/remove or change the existing breakpoints and modify the template structure and how objects are arranged in the header and footer for the various viewports.

It is important to remember that the template versions for the Desktop and intermediate viewports are set in pixels, whereas the Smartphone viewport is flexible so that it always occupies 100% of the available space.

You can change your project's template at any time, simply by selecting a different template from the default/custom library or starting a new one from scratch. The changes you made to the original template will not be saved. If you want to save the settings of the original template, you must first save the current template in the Custom Library before applying a different template to your project.

If you are creating a responsive website, the settings for how the template behaves are saved in the template file and not in the project file: if the graphic template is modified, there may be discrepancies between the settings for the current template and those of the selected one. In this case, a window is opened where you can choose whether to:

keep the breakpoints of the current template or replace them with those of the selected template,
keep the objects of the current template, replace them with or add them to those of the selected template.


Best practices:


How to work with the templates


Where to find new templates for WebSite X5


How to create a Responsive website in WebSite X5 | How to define the template