Joomla Templates Club 406,261 posts

[2domedia Friend 2domediaJoin date: December 2007Posts: 31Downloads:0Uploads:5 Thanks: 3]

#155346

Hello Support,
I’m changed the background from using color code to a image –

background: #fff url(../images/bg-red.jpg) repeat-x scroll center top;

The problem is that I had to create the background image to be 3500px in length. Is there a way to shorten the images and update the code to extend the length of the site?

Thanks :confused:

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#359268

Please show us the image you are trying to fit.

The normal methose are to tile an image or fade am image at the sides and bottom to a single background colour. A link to the page to the page (with the image included) will help us advise what is best.

1 user says Thank You to Phill for this useful post

1. sjisaacs

[2domedia Friend 2domediaJoin date: December 2007Posts: 31Downloads:0Uploads:5 Thanks: 3]

#359277

The website URL is http://www.collincountybuzz.com. The image URL is http://www.collincountybuzz.com/templates/ja_teline_ii/images/bg-red.jpg

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#359281

Hmm, will require a couple of adjustments.
Lets start by finding template.css line 541

#ja-wrapper {
padding: 0;
}

Replace with


#ja-wrapper {
background:none repeat scroll 0 0 white;
margin-left:auto;
margin-right:auto;
width:980px;

}

Then replace your image with the one attached

The find


body#bd {
background:url("../images/bg-red.jpg") repeat-x scroll center top #FFFFFF;
color:#333333;

}

and replace with


body#bd {
background:url("../images/bg-red.jpg") repeat scroll 0 0 #FFFFFF;
color:#333333;

}

I’ve not tested it so if you have any problems just ask.

---

Attachments:

1. 

1 user says Thank You to Phill for this useful post

1. sjisaacs

[2domedia Friend 2domediaJoin date: December 2007Posts: 31Downloads:0Uploads:5 Thanks: 3]

#359284

It worked… I just had to adjust the width from 980px to 1250px and it looked perfect.

Thanks

[Author]

Posts