Joomla Templates Club 406,261 posts

[dion77 Friend dion77Join date: May 2011Posts: 34Downloads:3Uploads:3 Thanks: 12]

#167153

I use the thyme ja social and I would like to :

1/. change the background of the default theme to white
2/. Reduce the distance a/. between the modules and b/. the columns (left, write, main) !

my website is http://www.petie.gr

Thank you

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#404825

It would be very helpful, and much quicker, if you would turn off the CSS Compression in the template’s administrator panel.
Doing so will allow us to give you exact line numbers of CSS modifications that need to be made. Thanks!

In the interim:
The THEME background can be changed in the Template’s administrator parameters.

[FONT=”Arial Black”]TO REDUCE THE (vertical) DISTANCE BETWEEN MODULES:[/FONT]
Open your template.css and locate the following code and adjust the line in red.


div.ja-moduletable, div.moduletable {
background: none repeat scroll 0 0 #FFFFFF;
margin-bottom: 15px;
margin-top: 0;
padding: 0;
}

Again, when CSS Compression is turned off, we can tell you the exact line number on which the find this bit of code.

As for [FONT=”Arial Black”]REDUCING THE DISTANCE BETWEEN COLUMNS[/FONT]…we need to know…what do you want to make larger? For instance, the total width of the template is 980. To reduce the space between the columns…something has to become larger…the width of the left column, the main column, the right column, etc.

Thanks!
John.

1 user says Thank You to John Wesley Brett for this useful post

1. phicts

[dion77 Friend dion77Join date: May 2011Posts: 34Downloads:3Uploads:3 Thanks: 12]

#404828

Thanks for the answer.

1/. Template background : I want to keep the default theme and change the background to white (it is light blue). You can not do that in the administrator panel unless you change the theme !
2/. I want to reduce the space between each column and of the main body. There is a distance 2-3 cm and I would like to make it 1 cm.

Dionysis

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#404829

I’m sorry, Dion.
Please turn off CSS Compression. We cannot direct you accurately where to make the changes you are requesting.
Either that or PM me with an Admin login,

Thanks!

1 user says Thank You to John Wesley Brett for this useful post

1. dion77

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#404841

Awesome!

For the WHITE BACKGROUND:
Goto: [FONT=”Arial Black”]templates/ja_social/css/template.css[/FONT] – line 308

Change to this:


#ja-container {
background: none repeat scroll 0 0 #FFFFFF;
padding-bottom: 0;
}


As for CLOSING THE DISTANCE between modules and main areas:
We begin by extending the MAIN area closer to the RIGHT
Goto: [FONT=”Arial Black”]templates/ja_social/css/layout.css[/FONT] – line 19
Change to read as follows:


.main .inner {
padding-left: 10px;
padding-right: 0;
}

Then extending the LEFT area closer to the MAIN
Goto: [FONT=”Arial Black”]templates/ja_social/css/layout.css[/FONT] – line 49
Change to read as follows:


.ja-inset1 div.ja-moduletable, .ja-inset1 .div.moduletable, .ja-inset1 div.ja-module, .ja-inset1 div.module {
margin-left: 0;
margin-right: 0;
}


Have fun!
John.

[phicts Friend phictsJoin date: June 2011Posts: 85Downloads:0Uploads:10 Thanks: 26 Thanked: 3 times in 1 posts]

#421402

Where and what will be the edits when I want to decrease the margins between the main, left and right to half of the default margins between them, then add the gained space to the left and right area?

The current distance between the three is about to 20px (or 40px for the two). I want it to be 6px only (12px-total) and distribute 14px each to the left and right area.

My site is on Joomla 1.7.2 with JA Social 1.2 template at http://chat.com.ph/index.php (please use the index.php because the default page is index.html which contains Filipino chat rooms. Thanks in advance.

[phicts Friend phictsJoin date: June 2011Posts: 85Downloads:0Uploads:10 Thanks: 26 Thanked: 3 times in 1 posts]

#422885

up for this. i don’t know what files to edit. i wish to keep the width of the main contents but widen the left and right columns by reducing the margins between main contents, left and right areas.
thanks in advance.

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#422942

Again, I would be happy to help…but NOT with your CSS Compression turned on.
Please turn it off so that I may give you complete and accurate instructions.

Thank you. Please turn off CSS Compression every time you request support and leave it off until support is complete.

John.

[phicts Friend phictsJoin date: June 2011Posts: 85Downloads:0Uploads:10 Thanks: 26 Thanked: 3 times in 1 posts]

#423176

Sorry John. I needed to turn on CSS Compression for some settings. Now I’ve turned it off again. Like I said, I want to keep the current width of the main content as is. I just want to decrease the margins between the main content, the left and the right areas (or whatever it is called) tthen distribute the space to the left and right areas to widen the modules there.

Thanks in advance.

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#423267

Perfect!

For the LEFT module area (inset2)
Goto: templates/ja_social/css/layout.css – line 34
And adjust the area in Red to your liking (margin-left: 10px; looks good)

.ja-inset2 div.ja-moduletable, .ja-inset2 .div.moduletable, .ja-inset2 div.ja-module, .ja-inset2 div.module {
margin-left: 20px;
margin-right: 0;
}


And then for the RIGHT module area (right2)
Goto: templates/ja_social/css/layout.css – line 28
And adjust the area in Red to your liking…
(margin-left: 0px;
margin-right: 0px; looks good)


.column div.ja-moduletable, .column div.moduletable, .column div.ja-module, .column div.module {
margin-left: 10px;
margin-right: 10px;
}

Have fun!
John.

2 users say Thank You to John Wesley Brett for this useful post

1. phicts
2. dallacosta

[phicts Friend phictsJoin date: June 2011Posts: 85Downloads:0Uploads:10 Thanks: 26 Thanked: 3 times in 1 posts]

#423280

thank you very much John. it worked all right in the default color theme and layout of main-left-right. I decided to set to 10px the margin-right of of the right module area to make the left and right spaces equal. thanks a lot.

however, i noticed that the margin settings doesn’t apply when i choose other available layout like left-main-right and left-right-main. for now, i’ll just remove that option/link to change layout in the main menu.

thank you very much.

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#423554

That is correct.
For every layout you choose, you will have to reconfigure the CSS if you want that effect.

Have fun!
John.

[phicts Friend phictsJoin date: June 2011Posts: 85Downloads:0Uploads:10 Thanks: 26 Thanked: 3 times in 1 posts]

#424134

Thanks for the confirmation. 🙂

[Author]

Posts