Website Backgrounds

Most of the page designs in Elements have two types of background. A wide Pasteboard background that extends across the background of the whole browser window when your site is exported. And on top of this sits the Page background with the various other elements that constitute the web page.  Further information can be found here.

 

By default Elements web templates have a Main variant and a Mobile variant contained within the same web document.

	Pasteboard/browser background
	Page background

Setting the Page and Pasteboard background colors

When you create a new blank document ("File" > "New") the page defaults to being transparent (no color) so you just see the pasteboard color behind it, which is white by default. This page area is where you place all the elements of your website. You will also see a faint rectangle guide outline which shows the boundary of the page against the pasteboard. You can turn this guide off should you wish - by right clicking on the page and de-selecting "Page background" > "Show Page Size".

If you drag a color from the Color Line over the pasteboard, and drop it, the entire background will be set to that color. This is because the page background in its default state is transparent, thus reflecting the underlying color of the pasteboard. And this is exactly what you will see in the web browser when you preview your page.

However you can also make the pasteboard one color, as described above, and then set the page background to a different color. Just drop a color onto the page background to set its color. Now when you preview your page you'll see the browser window background color is set to the pasteboard color and you can see the page background rectangle with its own color.

You can use the color editor to edit these colors. Right click on the page and choose Page Background > Edit page color to bring up the color editor, then you can edit the page color. To edit the pasteboard background color, right click on the pasteboard and choose "Pasteboard background" > "Edit pasteboard color".

To reset the pasteboard background back to its default white color right click on the pasteboard and choose "Pasteboard background" > "Reset". To reset the page background to its default clear or transparent state right click on the page background and choose "Page background" > "Reset".

If you have more than one page in your website document and you want to apply background and pasteboard colors globally, that is to every page in your website document, then you can do this easily. Right click on either the pasteboard or the page background and choose Copy Pasteboard background or Copy Page background and then choose Paste Pasteboard/Page background on all pages.

 

Video Backgrounds

It is also possible to set a video either as the background to a web block or as a background to the whole webpage, see How do I insert a video into my website? 

 

 

Copyright © Xara