Add a background image

[alan081954]

Instead of just a plain background,How do I add an image background?

[sanil]

Instead of just a plain background,How do I add an image background?

if you can add image into your background,you can change the style.css

background-color: #cccccc;

replace this css into this

background-image:
url('yourimage.gif')

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: #cccccc;
color: #222222;
margin: 0px;
padding: 0px;
}

[alan081954]

I tried the above and it does not work.

[grynmoors]

Make sure you have all your code correct and that you're pointing to the actual location of the image. This following is assuming that the image is located in the vshare/templates/images folder.

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: #cccccc;
background-image: url ('../images/YOURIMAGE.jpg');
color: #222222;
margin: 0px;
padding: 0px;
}

If that background-image directive doesn't work, try this one. I find that it works better with FF. Place inside the BODY class in your styles.css as you would above. It's the same code I use for skins that have back ground images such as this one http://webgeek-design.com/index.php?act ... oductId=71

background-image: url("../images/YOURIMAGE.jpg");background-repeat:repeat;background-attachment: fixed;

[pskill]

has anyone got this to work? I'm still having issues.

[grynmoors]

Please post the contents of your css file so we can have a look at it and also, verify that the image actually exists in that location on your server and that you're not experiencing a browser cache issue as well. The code I posted works, I use it all the time.

[EinfachClicken]

.
If you add something like this to the style.css file ... assuming that the name of your background image is stylebg.gif and that it is indeed located in your templates/images folder ....

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
background-image: url("../images/stylebg.gif");
color: #222222;
margin: 0px;
padding: 0px;
}

... then you will see that image around the outside perimeter of your video portal, i.e. to the left and the right of your page, and also above/below if you have a margin set for it. This background will NOT appear anywhere on your actual "working" screen or if you use your browser in less than full-screen mode it may also not show up if your browser margins are the same as the page being viewed. Like I said, this will show up OUTSIDE of your working page. On the other hand, if you add something like ....

<table cellspacing="0" cellpadding="0" BORDER="0" BACKGROUND="http://www.locationofyourvidportal.com/templates/images/bgimage.gif" width="100%">

... into the header.tpl file (located in templates) then you can coordinate that background at the top, with the background that you've already added to the outside of your pages (see above). Don't ask ... just use your imagination and some image software to do it. In this case we've designed a background image (bgimage.gif) that takes up the entire table of the header. But you can also make just a shading image which just keeps on repeating itself. That's what we had at first. The shading image is a lot easier since the whole background image for the table requires a little finesse, in order to make it work together with the exterior background.

A working sample can be seen on our german language portal which looks tremendous (now). :D
http://www.meineclipshow.einfachclicken.de/
.
Cheers

[grynmoors]

Adding the images code to the custom_doc class in the css makes the image appear in the main section of the site as well.

[EinfachClicken]

Adding the images code to the custom_doc class in the css makes the image appear in the main section of the site as well.

Hmmmm, now THAT sounds pretty interesting ...
Can you point us to a site where this can be seen in action? Thanks.
.

[grynmoors]

Certainly.

http://webgeek-design.com/index.php?act ... oductId=71

I am also in the process of doing a custom design for another site at

http://vshare-mods.com where I'm using this. Warning: site is a mess as I just got started, but you will get a good example of the background image which is used in the css.