Site builder has versatile options to change the layout of your website. The changes you make can be instantly seen in the interface. From the ‘Design’ section you can edit colors, edges, background pictures and also add sidebars to your site.


From the toolbar choose ‘Design’.

ulkoasu1

Now we will show how you can add sidebars to your site and change their width and height.

From the right side ‘Sidebars’, choose 1 or 2 sidebars. In the example we will choose 1. In addition we will change the width of the sidebar to 150 and height to 200.

sivupalkki2

The added sidebar will show instantly in your website. You can change the content of the sidebar by clicking it.

sivupalkki

You can also choose ‘Stretch the sidebars and the content area down to the footer’. In that case the sidebar stretches to the footer even when there is more lines in the content page than in sidebar.

You can change the header and footer to be 100% width by clicking them in the picture. In the example picture below, mouse cursor is on top of the header (and the header turns green) and by clicking it the header will change to 100% width.

100prosenttia_a

By clicking the same spot again, you can set the width to the same as it was before.

100prosenttia

Here is a picture demonstrating the 100% width header.

100prosenttiab

From the bottom of the ‘Design’ page you can choose a fixed width for the website or a liquid state. Choosing liquid changes the width of the elements depending on screen size of the users’ browser. In the example picture, we’re choosing fixed width of 960 pixels.

sivupalkki3

For both content part and sidebar, you can choose both top- and bottom margins. In the picture we chose vertical margin 30 and horizontal margin 10.

marginaalit

Changes you make are instantly visible in the website background. Here is an example picture that shows the margins we put in the last section.

marginaalit2

15.05.2014