what you can do is to override the width of the ES sidebar.

.es-container .es-sidebar {width: 220px;}

H n00bster

Could you tell me where I need to input the above code?

I am guessing, com_easysocial/themes or similar?

thanks

Paul

Put it in your template css file. Your template will read the code. This will also prevent you from having to change any files when upgrading ES. However if you upgrade your template, the code might disappear.

take a look at the docs from stackideas ES:
http://docs.stackideas.com/administrators/templating/template_overrides

or copy this in your template custom,css file (it depends what theme provider you have).

Thanks for sharing guys

Hi guys

thanks to you all. Will apply the fix over the weekend.

best

Paul

Thanks for updating Paul

Hello Support

Maybe some one could help me with this. Pretty sure that it is some simple stupid mistake that I am making here: http://docs.stackideas.com/administrators/templating/template_overrides

(thanks n00bster)

I am still using JSN Corsa

So put a file called “Style.css” in the folder called “Styles” as instructed at the link above.

i.e. in my case: templates/jsn_corsa_pro/html/com_easysocial/styles

In this file “Style.css” I enter the text from n00bster

i.e. .es-container .es-sidebar {width: 220px;}

Nothing more. Nothing less.

And it messes up the formating. Please see screen shot…

I have renamed the file for the moment from “Style.css” to “StyleX.css” as it is breaking stuff!

Any body got any ideas what I am missing!?!

best

Paul

hey paul,
of course you messed the style up

here's a simple explanation what happens when you use the template override: instead of using the original style.css file the easysocial theme is now using YOUR style.css file. and as you only have that one single line in it all other styles are missing and therefore of course the layout has to break, makes sense right?
so if you're using template override make sure that you also have the basic styles in it and THEN at the end add your own styling.

alternatively if you only have some lines of customizations instead of template overrides you can put them to your custom css file of your joomla template, that would do the trick as well.

hope that helps and have a nice day

Hi Alex

Thank you for the explanation. It all kind of makes sense. So I need to copy the style file that is responsible for the template into the folder as described in the instruction and add the code. Thing is that I do not know what style file to take. I am here:

templates/jsn_corsa_pro/css/styles/

and see the following:

business.css
custom.css
news.css
personal.css


thanks in advance

Paul

hey paul,
the file custom.css is the one to go with

Hi Alex

I am really sorry about this. I am missing something really easy. I take the "custom.css" file from here:

templates/jsn_corsa_pro/css/styles/

and put it here:

templates/jsn_corsa_pro/html/com_easysocial/styles

renamed it too "style.css"

It breaks the formatting again. Please advise where I am going wrong!?!

thanks

Paul

hey paul,
no worries - we'll get you there ^^

if you use the custom.css file of your template you don't have to move it anywhere. you just open it and paste in the codes you want to style. that's it.
no copying to the easysocial template override folder or anything else. just edit the file, save it and you're good to go

hey Alex

OK, not breaking anything any more

This is weird! Every time I paste the above code and save it here:

templates/jsn_corsa_pro/css/styles/

The added code disappears. I can confirm this twice. I see the date at which the file is saved being updated in my FTP program and when I pull the edited, newly saved file to my desktop I no longer see my saved changes.

Am wondering if there is some kind of tidying up going on.

I am doing this in textwrangler, using Captain FTP

thanks

Paul

/* Set font style for body */

body {

	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;

	font-size: 75%;

}



/* Set font style for heading */

h1,

h2,

h3,

h4,

h5,

h6,

#jsn-gotoplink,

.page-header,

.subheading-category,

.componentheading,

.contentheading {

	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;

}



/* Set font style for menu */

body #jsn-menu ul.menu-mainmenu a,

body #jsn-menu ul.menu-mainmenu li a span {

	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;

}

.es-container .es-sidebar {width: 220px;}

just to make sure I haven't read this wrong...:
you edit the file, save it but after some time the edited file goes back to an older stage / the new code you entered is not there anymore??

I can't speak for your current template but I'm writing my own joomla templates all the time and that's for sure not the default behaviour at my end

if I really understood it right then you might want to get in touch with the jsn guys and ask what's going on there, they should know their templates best

this is what I am doing:

A) find file in FTP program
B) right click and select edit in Text Wrangler
C) Add the code
D) Press Save.
E) I can see that the file gets updated in my FTP program i.e. date changes
F) Select now updated file in FTP program and select edit in Text Wrangler
G) I see some thing disappear (the line I added) and the file looks as it did before the edit and save

I really think that I am still making some really stupid mistake. Wrong syntax or something, that is being "cleaned up" !?!

okay paul,
I had a quick look into your filesystem and template and have an idea what's going on. turns out you have a custom.css file at jsn_corsa_pro/css/styles and another one - that you specified in the template settings at jsn_corsa_pro/css

I think the first one that always gets reverted inside the additional /styles folder is treated as a system file and jsn sets it back - don't ask why ^^

the other file directly at jsn_corsa_pro/css I can see works correctly, my overrides from yesterday for example are in it and it's still working as expected. so I would advise you use this one as it's obviously the right one and ignore the stuff in their styles folder.

hope that helps

hi Alex

It is possible that I am responsible for the double custom.css file.

I have done as you suggested. Posting the code in here:

jsn_corsa_pro/css

into

"custom.css"

I guess these are your changes from yesterday that I see below. Down at the very bottom is the code that I added!

But nothing seems to be changing!?! Any ideas?

Have cleared my browser history...

#jsn-pos-topbar {



text-align: center;

}



div#fd.es .es-login-box .btn-register {

  width: 180px !important;

  font-size: xx-small !important;

}



div#fd.es .btn-es-facebook {

  width: 180px !important;

  font-size: xx-small !important;

}

.es-container .es-sidebar {width: 220px;}



body div#fd.es .es-login-box:before {

width: 0px !important;

}



.es.mod-es-logbox.module-logbox .col-md-6 {

	width: 100% !important;

}



.es-container .es-sidebar {width: 220px;}

hey paul,
well nothing's changing because when you take a closer look at your file you already added the same thing (.es-container .es-sidebar............) some lines above already

just a note - the 220px you added aren't helping you at all because that's already the default width. change it to something else and you should see a difference.

hey Alex

I appreciate you walking me through this and not making me look like a complete fool in the process

The below makes no difference!!!

I am trying to get the width of the side bar on the community page to have the same width as the side bar on the blog pages!

#jsn-pos-topbar {



text-align: center;

}



div#fd.es .es-login-box .btn-register {

  width: 180px !important;

  font-size: xx-small !important;

}



div#fd.es .btn-es-facebook {

  width: 180px !important;

  font-size: xx-small !important;

}

.es-container .es-sidebar {width: 1000px;}



body div#fd.es .es-login-box:before {

width: 0px !important;

}



.es.mod-es-logbox.module-logbox .col-md-6 {

	width: 100% !important;

}

Hi Alex

I think I am getting it now. To complicate issues I was entering 500x and not 500px

thanks for your patience

Paul

you're welcome.
good to hear that everything's working fine now