Joomla Templates Club 406,261 posts

[Sam Friend SamJoin date: September 2014Posts: 40Downloads:0Uploads:5 Thanks: 2 Thanked: 1 times in 1 posts]

#275931

<em>@hainn84 86524 wrote:</em><blockquote>Hi sgudek !
you can change background color of teline following way below :
Open template.css file in templates/ja_teline_ii/css folder, find following code section at about line 532 :


#ja-wrapper {
padding:0;
}


change to :


#ja-wrapper {
background:#CCC;
padding:0;
}

</blockquote>

Hello hainn,

Thanks for reply, but this is does change ALL background. Please see the attachment:

As I am trying to explain, I do not want the center and sides to be the same color. I want the middle, main body to be light, and sides of the main body to be dark, so the center stands out.

This is what it needs to look like:

How can i do that? Is there a way to ONLY change colors of sides, or the main body? They need to be assigned two different colors. (example given in last attachmenet.

---

Attachments:

1. 

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#275955

Hi sgudek !
to only change background of side , you must create a background image with side is background and center is white color then using code below :


#ja-wrapper {
background:url(images/[background image name]);
padding:0;
}


[alioztr Friend alioztrJoin date: September 2008Posts: 197Downloads:0Uploads:21 Thanks: 44 Thanked: 3 times in 1 posts]

#276124

<em>@hainn84 86693 wrote:</em><blockquote>Hi sgudek !
to only change background of side , you must create a background image with side is background and center is white color then using code below :


#ja-wrapper {
background:url(images/[background image name]);
padding:0;
}

</blockquote>

i did try with
background:url(images/);
background:url(images/example.jpg);

the page did not work. what should i do
Thanks

[bossies Friend bossiesJoin date: September 2006Posts: 172Downloads:39Uploads:15 Thanks: 16 Thanked: 16 times in 2 posts]

#276796

I first copied the image to the image folder of the template – templates/ja_teline_ii/images

then i change the template.css around line 532 – ja_wrapper – as per hainn84

background: url(../images/free-online-ads-background1.jpg) no-repeat;

attached is the file i use to upload to the images folder of the template

hope this helps…

---

Attachments:

1. 

[bossies Friend bossiesJoin date: September 2006Posts: 172Downloads:39Uploads:15 Thanks: 16 Thanked: 16 times in 2 posts]

#276797

just tested on a different screen size as my laptop and it does not display correct…. will have to look again…

[bossies Friend bossiesJoin date: September 2006Posts: 172Downloads:39Uploads:15 Thanks: 16 Thanked: 16 times in 2 posts]

#277269

background: url(../images/free-online-ads-background1.jpg) no-repeat top center;

all i had to do was to add “top” and “center” at the back of the line and now it’s all sorted for different screen sizes…

[Sam Friend SamJoin date: September 2014Posts: 40Downloads:0Uploads:5 Thanks: 2 Thanked: 1 times in 1 posts]

#277557

After looking into the css files, i figured out a solution:

1) Open up template.css
2) Edit background colors of:

mainnavwrap
mainnav
header
headerwrap
containerwrap
subnavwrap
subnav

this is the outcome:

The other option is to use a background image, as hainn pointed out.

It took me hours to finally make these changes. Hope you save time.

Regards

---

Attachments:

1. 

1 user says Thank You to Sam for this useful post

1. skewered

[Author]

Posts