2. PHPRunner General questions
  3. [SOLVED]  Background Image By Default
This topic is locked
[SOLVED]

 Background Image By Default

 		6/8/2012 10:27:30 AM
PHPRunner General questions
S
 sradforth author

Is there a recommended way to put a background image in that should be behind everything by default?
My current approach feels like a hack and not very maintable as needs to be done on every set of page... I'm using the OnLoad javascript to update the DOM with the appropriate image like this.

document.body.style.backgroundImage="url('images/sky2.jpg')";


I'd like to actually create a new templated style and assign that ideally but not sure if this is round peg/square hole sort of thing I'm trying to do.
C
 		cgphp 6/8/2012

You can load your stylesheet globally from the header: http://xlinesoft.com/phprunner/docs/how_to_add_external_files.htm
S
 		sradforth author 6/8/2012



You can load your stylesheet globally from the header: http://xlinesoft.com/phprunner/docs/how_to_add_external_files.htm



Thank you!! That was just the missing bit I needed and t believe it or not it actually worked first run! I was entering the world of modifying templates only to find there wasn't an obvious way there since it seems like a custom parsed file that generates the css files... whilst it does look like PHPRunner could be extended to support textures here I'm not sure if it was a world of pain I was about to enter and your solution is the cleanest and easiest approach to achieve this.
Should it help others here are the exact lines I've used.
I created a new directory in my project's source folder named customcssand then created a new css file named bodycss.css in notepad so have the file

MYPROJECT\source\customcss\bodycss.css
I added the following lines to bodycss.css



body{

background-color: #00F000;

background-image:url('../images/sky.jpg');

margin-left: 0px;

margin-top: 5px;

margin-right: 0px;

margin-bottom: 5px;

}


next I added sky.jpgto the directory MYPROJECT\\source\images
Now in PHPRunner in the Editor tab->Header section I added Cristian's suggested line.

<link REL="stylesheet" href="customcss/bodycss.css" type="text/css">


.. clicked build and ta-dah, a beautiful subtle background is added to all the pages.