Setting width of entire template (so bkg will show at sides)

[shafee_howard]

Hi, I've just switched my experimentation to Purity II, that was good advice. My Joomla! experience is several years out of date!

I am trying to reproduce the visual appearance of my old J15 site http://ruhaniat.org/ (template was JA-Sanidine) on the 2.5 platform. As you may note the background is visible at both sides of the content.

In http://sufipaths.net/PurityII-test/ I have the template width set in Template Manager: Edit Style > Profiles at 930 -- but still almost everything is filling the width of my screen (1024): the grey block at the top that's behind the logo graphic -- I'd like to turn that off anyway, also don't need the header1/2/3 images at the top -- also top menu and content blocks need to be narrower. Is there a way to set the width of everything ??

Thanks -- Howard Ballinger

[swissa]

Hallo Howard. As it was my recommendation I feel some responsibility so if in any way I can be of assistance (es freut mich) to help.

I am a beginner in reality - i have such a short experience with Joomla and JA but Purity has taught me so much (and I still really like it!). I hope it helps you to regain and master your skills and a little of the black arts too!

Others with more experience can surely help you more than me but as a start and to show you just how good purity is to learn and hone(?) skills (please make sure you do a backup regularly of the site) here are some ideas.... Please take backup of files first. !important!!

template.css
line 1232

#ja-header {background: none;
position: relative;
z-index: 10;
}

line 190

#ja-container.ja-l1 {background: transparent;
}

line 1256

#ja-mainbody {background: white;
}

1434

#ja-topsl {background: none;
color: #CCC;
}

1261

#ja-mainnav {
line-height: 1;
position: relative;
z-index: 11;
}

1109

#ja-container {
position: relative;
z-index: 5;
border-bottom: 5px solid #CCC;
}

either new code in template.css or edit @ line 13 PurityII-test/templates/ja_purity_ii/css/menu/mega.css

.ja-megamenu {
margin: 0;
padding: 0;
background: #444;
}

I know this is a lot (and that there is more to do) so that is why I say take a Backup first!!

Maybe that does not work for you but on my Chrome it starts the way to make it look like your old site. I hope!! Or maybe it is time for me to get some sleep!

[shafee_howard]

Ich habe mich gefreut, wieder von dir zu hören, Swissa! You did it, the edits made a big difference. http://sufipaths.net/PurityII-test/ Someday I'll try to figure out what each of those changes actually does. Maybe I'll even learn to use Firebug. Do you recommend that?

For now there's one thing ... I don't think I want the container for the top menu to be transparent all the way across. I tried undoing some of the edits -- the #ja-container.ja-l1 and the one in mega.css -- but that had no visible effect I could tell so I'll go back and put them the way you suggest.

Anyway I have another issue adding items to a menu, I'll be making a new thread on that. Haben Sie vielen Dank! -- HB

[swissa]

Gern geschehen Howard!

You are absolutely right - it would have been more usefull as a change log! Sorry!

line 1232 was to remove the black header
line 190 was to set the whole container away from white so that the background was visible
line 1256 was to make the main content area background white to read articles etc
line 1434 was to again remove the white across the whole width in this position
line 1261 was to remove colour from the header
line 1109 was to remove the borders so that it flowed better


I think!!



Quickly to explain further - I added this code

.ja-megamenu {
margin: 0;
padding: 0;
background: #444;
}

to templates/ja_purity_ii/css/menu/mega.css to add a background colour back to the menu. I didn't see it in your code so you might want to do this.

Maybe I'll even learn to use Firebug. Do you recommend that?

Yes, yes and yes again. Use, play with and enjoy either Firebug or Chrome Developer Tools. Will aid you no end.


Also just to explain, between the header and the white content box you see the background. This is planned as there sits modules user1-5 - somewnere for you to put your slideshow as in your 1.5 version. Before you have done that I thought it best to leave the css alone!

Keep learning and keep doing those backups!!

schönes Wochenende!