Themes

 

Hypocrite replied on Oct 24, 2011 at 12:21 pm Permalink Reply

Of course.

You can make your own theme and set a background image with CSS which is positioned relative to your container div.

For example that site is using an image like this:
http://ianimate.net/templates/rt_quantive_j15/images/backgrounds/st...

It is just centered horizontally and not repeated. Then the container div is laying on top of it.

You can try something like this:

<style type=”text/css”>
<!–
body {
background-color: #ffffff;
background-image:url(bg.jpg);
background-repeat: no-repeat;
background-position: top center;
}
#container {
width: 940px;
margin: 0 auto;
}
–>
</style>

jmalaska replied on Oct 24, 2011 at 1:18 pm Permalink Reply

Thanks! This is awesome. Where would I put this code? In the main.css or elsewhere? (Sorry, I am really new to coding)

Thanks so much again for the help!

Hypocrite replied on Oct 24, 2011 at 1:36 pm Permalink Reply

To the top of your main CSS file.

Note: I fixed the CSS code a bit.

jmalaska replied on Oct 24, 2011 at 3:39 pm Permalink Reply

Thanks again! I dropped in the code to the main.css file at the top. Unfortunately my test image isn't showing up. I edited the code to make it tile horizontally too, but no dice. Any idea what the issue might be?

Thanks again! Sorry to be a bug.

Hypocrite replied on Oct 24, 2011 at 3:43 pm Permalink Reply

First guess would be that the path to the image is wrong. Try using an absolute path, for examplehttp://www.yourdomain.com/themes/themename/img/bg.jpg...

jmalaska replied on Oct 24, 2011 at 4:05 pm Permalink Reply

Thanks again. No dice still :(

Hypocrite replied on Oct 24, 2011 at 4:14 pm Permalink Reply

Do you have a link to your site?

jmalaska replied on Oct 24, 2011 at 4:23 pm Permalink Reply

sure:http://www.johnmalaska.com

Adreco replied on Oct 24, 2011 at 6:18 pm Permalink Reply

John,
Your background image URL seems to be incorrect. I'll look at it after dinner and see if I can suggest an alternative.

Steevb replied on Oct 24, 2011 at 6:27 pm Permalink Reply

Your path is wrong.

You dont need all that styling;

background-image:url(/concrete/themes/dark_chocolate/http://johnmalaska.com/files/4013/1914/8974/phils_head.jpg);
background-repeat: repeat-x;
background-position: top center;

Call the image from wherever you put it, for example:

body {background: #000 url(images/phils_head.jpg) no-repeat top center;}

hope that helps

Steev

Adreco replied on Oct 24, 2011 at 8:47 pm Permalink Reply

Steev's example is certainly the clean way to achieve what you want. Please note, you should place your image in Concrete-Themes-Dark_Chocolate-Images folder, not your file manager for best results.

jmalaska replied on Oct 24, 2011 at 9:34 pm Permalink Reply

Excellent, that did it thanks!

Special thanks to Hypocrite as well!!!