• English
  • Nederlands

User Tools

Site Tools


en:faq:header

Some examples of headers from usersof the template

Q&A

:?: Is it possible to add a banner in the header (instead of the title)?
:?: Is it possible to add google adds in the header ?

Yes, as you can see on the examples above.

The scripts wsHeader1 and wsHeader2 can be adapted if one has some basic PHP knowledge.

But it is also possible to add photos to the background of a header by adapting the CSS files.

If you want to use the same photo for all headers

  1. modify styleMain20.css and add a background-image: url to the #header specification.
    #header {
    	margin: 5px 5px 0px 5px;
    	background-image: url(img/YOUR PHOTO NAME GOES HERE.jpg);
    	border-radius: 5px;	
    	color: black;
    	background-color: transparent;
    	border: 1px solid grey;
    	border-bottom: 3px solid grey; 
    	}
  2. modify styleMood20.css and remove the two background-image: url('s already there.
    /* css mood switch definitions version 2.00B  removed nearly all back-ground images from #header */
    /* 
             Clouds by day 
    */
    .clouds #pagina  	{border-color: #B4D3ED; background-color: rgba(205,218,224, 0.6);}
    .clouds	#header		{color: black;		background-image: url(img/headClouds.jpg);}
    #
    .thunder #header	{color:  black;		background-image: url(img/headThunder.jpg);}

If you want to add a different photo depending on the weather-mood or color you could modify weather27/styleMood20.css and use the two background-image: url settings as a starting point.

In the template-download there are more photos for headers available in the weather27/img/ folder. The name-code is head??.jpg were ?? is the mood name (f.i. mist or sun).

If you are modifying a standard CSS file you should give it a new name f.i. myStyleMood.css and change the setting in wsSettings.php so that your CSS is loaded and not the download version. This makes upgrading to a new release less complex.

en/faq/header.txt · Last modified: 2015/05/27 15:51 (external edit)