Blog
Customising the design and layout
8th January 2009 by René Lasseron 5 comments
If you know some basic HTML and CSS, it's quite simple customise the design and layout of your site. Here's how:
- Log in to your website.
- Choose Properties > Site Design from the toolbar above the page. Mouse-over the design package you like, choose Download and save the package .zip file to your computer.
Unpack the downloaded .zip file which would create a folder called something like “sauropol_greatdesign”. Inside, you will find files like:
style.css the .css files define the text sizes, fonts, colours, background images and other visual styles of the page. Read more about CSS from www.w3schools.com/css. index.html .html files contain the page layout, menus and some of the behaviour. These files are mix of two type of code:
- HTML is the tag language for defining web pages and is written between angle brackets like <body>. Read more about HTML from www.w3schools.com/html.
- Saurus API is the language that pulls your website content like menus and articles from database where it is stored and displays it inside the HTML page layout. These calls are written between curly brackets like {print_content}. Learn about Saurus API from www.saurus.info/sapi.
- Once you have made the desired changes, pack the whole folder using ZIP compression and upload from the same place you downloaded it: there is an Upload button in Properties > Site Design page. Refresh the page to see your changes.
When uploading, it does not matter what is the name of the .zip file or whether you compressed it within the folder or one level up. Just make sure to include all the files.
Tip: The easiest way to change the header image is to look inside the package folder and search for the image file that appears in your site header. Once found, replace it with your own graphic file with same file format and pixel size.
whenever I try to upload the zip, sends error, said the extension is wrong, but it is not.