nightfox_pc_asst
21-Aug-2004, 11:49 PM
This is for all those working on making skins and know little about the IPB 2.0PF version or how to create things in it...
I call this changing the background image in v2.0 using the Advanced CSS option...
This is for all us noobs out there...I experimented with this and it worked...lol
Laterz.
NF
_____________________________
First you must make an image for use with the background, I did a tiled effect as you can see here (http://www.nightfoxpcforums.net/index.php) on my board.
Lets begin shall we...
A ) Save your image to where you save images for your custom skins, lets say the default skin in folder 1 located on your IPB Server in the directory www/style_images/1
B ) Lets say the file name is bg_tile_main.gif, give it permissions of 644 or U:R,W G:R W:R
Okay now do this;
1) Goto your Admin Panel (ACP)
2) Goto Skins and Templates
3) Choose Skin Manager
4) LEFT click on your skin and choose Edit Root Skin Template (Advanced CSS Option)
5) At the top of the HTML code add this under the list seen here: (written in bold text)
html
{
overflow-x: auto;
background-color: #FFFFFF;
background-image: url(<#IMG_DIR#>/bg_tile_main.gif);
background-repeat: repeat;
}
6) Next line down change this:
body
{
background-color: transparent;
color: #000;
font-family: Verdana, Tahoma, Arial, Trebuchet MS, Sans-Serif, Georgia, Courier, Times New Roman, Serif;
font-size: 11px;
margin: 0px;
padding: 0px;
text-align: center;
}
7) Now goto Save and Reload and when you refresh the internet browser window, you should see your new background image appear behind your boards.
NOTE: Remember an image will repeat itself on a screen each time, lets say you have an image of 800x600 and the user uses a screen size of 1024x768, when the image reaches it size, it repeats itself over again creating a tiled effect.
The best way is to create an image larger than what a user might use...default size for most users is 1024x768 so create an image of 1280x1024 and choose the option of No-Repeat as seen above.
I call this changing the background image in v2.0 using the Advanced CSS option...
This is for all us noobs out there...I experimented with this and it worked...lol
Laterz.
NF
_____________________________
First you must make an image for use with the background, I did a tiled effect as you can see here (http://www.nightfoxpcforums.net/index.php) on my board.
Lets begin shall we...
A ) Save your image to where you save images for your custom skins, lets say the default skin in folder 1 located on your IPB Server in the directory www/style_images/1
B ) Lets say the file name is bg_tile_main.gif, give it permissions of 644 or U:R,W G:R W:R
Okay now do this;
1) Goto your Admin Panel (ACP)
2) Goto Skins and Templates
3) Choose Skin Manager
4) LEFT click on your skin and choose Edit Root Skin Template (Advanced CSS Option)
5) At the top of the HTML code add this under the list seen here: (written in bold text)
html
{
overflow-x: auto;
background-color: #FFFFFF;
background-image: url(<#IMG_DIR#>/bg_tile_main.gif);
background-repeat: repeat;
}
6) Next line down change this:
body
{
background-color: transparent;
color: #000;
font-family: Verdana, Tahoma, Arial, Trebuchet MS, Sans-Serif, Georgia, Courier, Times New Roman, Serif;
font-size: 11px;
margin: 0px;
padding: 0px;
text-align: center;
}
7) Now goto Save and Reload and when you refresh the internet browser window, you should see your new background image appear behind your boards.
NOTE: Remember an image will repeat itself on a screen each time, lets say you have an image of 800x600 and the user uses a screen size of 1024x768, when the image reaches it size, it repeats itself over again creating a tiled effect.
The best way is to create an image larger than what a user might use...default size for most users is 1024x768 so create an image of 1280x1024 and choose the option of No-Repeat as seen above.