Liens du Vin - Using a simple GPC template Black or White

The Background Problem

Most of the GPC templates use picture to define the background
In the default CSS we can find :

background:
url(/-/includes/style/x1/x2/x3.gif) position;

To change the color of background we need to change these pictures. To download a picture, use this address :

http://YOURSITE.googlepages.com/-/includes/style/x1/x2/x3.gif

With a graphical tool, we can change the picture, and upload the new one into GPC. To use it in CSS, we use then this address :

background:
url(http://YOURSITE.googlepages.com/new_x3.gif) position;

Note : Some template, use by mistake /include/ as subdirectory (without s)

Changing the color

For this example, I use the simplest template of GPC : Simple, which doesn't use picture as background

I define the new background for the following part of the template :

html
body
#container
#main-content

I also change the color of the text for the following :

h1
p, li

I use a halfton color for the border and the separator :

hr {color: #c0c0c0;}

The Result

Discover the Black Template or the White Template

Loading the Style Sheet

Add this to the first section of the page (after the header) :

<script language="Javascript" type="text/javascript">
var cssNode = document.createElement('link');
cssNode.type = 'text/css';cssNode.rel = 'stylesheet';
cssNode.href = 'http://SITENAME.googlepages.com/CUSTOM_SHEET.css';
cssNode.media = 'screen';
cssNode.title = 'change background';
document.getElementsByTagName("head")
[0].appendChild(cssNode);
</script>

Other example

Simple Template with a picture as background, using attachment fixed

More Informations

One Day - One Label - One Wine

Other Tests