Joomla Templates Club 406,261 posts

[ollyjk Friend ollyjkJoin date: June 2008Posts: 77Downloads:0Uploads:26 Thanks: 7]

#130894

Is it possible to make the sides grey on the teline II template as shown in the attached document? Or…will any other template function with the same capabilities e.g. the frontpage thigy working etc? e.g. look at http://www.economist.com and timesonline.co.uk the sides are all grey and the main content in the middle is the white text? surely this is simple to do no?

Many thanks for help in advance, much appreciated

Ol

---

Attachments:

1. 

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

#260096

hi
you must work so much to have it
We only can support at first:template.css (line 524)

#ja-wrapper {
background:grey none repeat scroll 0% 0%;-->add this line
padding:0pt;
}

[Menalto Friend MenaltoJoin date: May 2007Posts: 4736Downloads:0Uploads:43 Thanks: 2 Thanked: 531 times in 361 posts]

#260115

This is only in template.css file, add what i have marked in red, change what i have marked in blue:
line 786:


#ja-headerwrap {
background: #333;
}
line 876:


#ja-mainnavwrap {
border-bottom:5px solid #666666;
background: #333;
}
line 528:


#ja-header, #ja-mainnav, #ja-subnav, #ja-container, #ja-footer {
clear:both;
margin:0 auto;
width:970px;
background: #fff;
}
line 630:


#ja-containerwrap, #ja-containerwrap-c, #ja-containerwrap-cm, #ja-containerwrap-f, #ja-containerwrap-m {
clear:both;
margin:20px 0; <---CHANGE TO padding: 20px 0;
background: #333;
}
line 546:


#ja-container {
background:#fff url(../images/vline.gif) repeat-y 65% 0;
}
line 1045:


#ja-footerwrap {
background:#fff;
clear:both;
}

1 user says Thank You to Menalto for this useful post

1. sanjiovani

[ollyjk Friend ollyjkJoin date: June 2008Posts: 77Downloads:0Uploads:26 Thanks: 7]

#260123

OMG that nearly had it – it leaves the following problems however as shown in the screenshots attached…It seems to have a problem at the top and the bottom i.e. it breaks up the white and then when using docman as shown and the events calendar all the background comes back again…anyway to fix?

This has been a great help!

---

Attachments:

1. 
2. 
3. 
4. 

[ollyjk Friend ollyjkJoin date: June 2008Posts: 77Downloads:0Uploads:26 Thanks: 7]

#260125

Thank you – but needed just the grey sides – the post below was close to it – dunno if that helps – have attached the screenshots…

[Menalto Friend MenaltoJoin date: May 2007Posts: 4736Downloads:0Uploads:43 Thanks: 2 Thanked: 531 times in 361 posts]

#260137

Without having your site url, its hard to say what you have done and not.
For the footer and header image,did you do this in blue:

#ja-containerwrap, #ja-containerwrap-c, #ja-containerwrap-cm, #ja-containerwrap-f, #ja-containerwrap-m {
clear:both;
margin:20px 0; <---CHANGE TO padding: 20px 0;
background: #333;
}

1 user says Thank You to Menalto for this useful post

1. sanjiovani

[ollyjk Friend ollyjkJoin date: June 2008Posts: 77Downloads:0Uploads:26 Thanks: 7]

#260191

Hiya …yeh i changed that (I think correctly..). I have attached my template.css file so you can see perhaps bit better than me what i have done. The site url is http://www.oliverjamesenterprise.com/fourshiresmag

you’ll see what i mean you click that theres a space at the top and the bottom and on the events and downloads (subscriptions etc) the background floods in and doesnt keep the white down the middle….Many thanks again in advance

[ollyjk Friend ollyjkJoin date: June 2008Posts: 77Downloads:0Uploads:26 Thanks: 7]

#260192

The other thing is as well if you click this link http://www.oliverjamesenterprise.com/fourshiresmag/index.php?option=com_content&view=section&layout=blog&id=36&Itemid=243 you’ll notice that the text in the article and the image are right on the edge of the changed background colour – is there anyway to indent that slightly so there’s like a white border to the left of it?

Thanks again…

[ollyjk Friend ollyjkJoin date: June 2008Posts: 77Downloads:0Uploads:26 Thanks: 7]

#260234

Sorry forgot to zip the template.css file…

---

Attachments:

1. template.zip

[sanjiovani Friend sanjiovaniJoin date: September 2006Posts: 217Downloads:0Uploads:32 Thanks: 15 Thanked: 1 times in 1 posts]

#260262

made the changes and their are still some areas that need to be fixed – attached is the screen shot

please advise as to how to fix the top and bottom areas

---

Attachments:

1. 

[sanjiovani Friend sanjiovaniJoin date: September 2006Posts: 217Downloads:0Uploads:32 Thanks: 15 Thanked: 1 times in 1 posts]

#260267

also the the mod positions on the left and right sides look “cut off” ideally their should be a border for those mod positions.

images also extend to the far right and left with that “cut off” look – their needs a to a border and padding between the images and the grey background

[Menalto Friend MenaltoJoin date: May 2007Posts: 4736Downloads:0Uploads:43 Thanks: 2 Thanked: 531 times in 361 posts]

#260272

I didnt do any changes with that yet. Going to post an update soon about this.

[ollyjk Friend ollyjkJoin date: June 2008Posts: 77Downloads:0Uploads:26 Thanks: 7]

#260278

Thanks for all your help on this! Are you going to upload the ‘re-designed’ template.css when you think its done?

Many thanks

Ol

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

#260619

You open template.css file in templates/ja_teline_ii folder , find following code section at about line 632 :


#ja-containerwrap, #ja-containerwrap-c, #ja-containerwrap-cm, #ja-containerwrap-f, #ja-containerwrap-m {
background:#333333 none repeat scroll 0% 0%;
clear:both;
margin:20px 0pt;
}


change to :


#ja-containerwrap, #ja-containerwrap-c, #ja-containerwrap-cm, #ja-containerwrap-f, #ja-containerwrap-m {
background:#333333 none repeat scroll 0% 0%;
clear:both;
margin:0px 0pt;
}


then continue find following code section at about line 1099 :


#ja-footerwrap {
background:#FFFFF none repeat scroll 0% 0%;
clear:both;
}


change to :


#ja-footerwrap {
background:#333333 none repeat scroll 0% 0%;
clear:both;
}


1 user says Thank You to Sherlock for this useful post

1. sanjiovani

[sanjiovani Friend sanjiovaniJoin date: September 2006Posts: 217Downloads:0Uploads:32 Thanks: 15 Thanked: 1 times in 1 posts]

#260621

thanks their is still two problems and that is the borders for the mods are cut off
for instance on the right side the right border is cut off for the blog mod, member activity mod, video mods, etc
their should also be some padding between the right border and the background.

A good example would be this forum site – you see the right border, padding then blue background

second is the thick line below the menu which extends across the page – the width needs to be reduced to the size of the template

[Author]

Posts