Page 1 of 1

Design Style sheet

Posted: Thu Jul 30, 2015 4:36 pm
by naurinjamil1
Hello all,
I am newly using CMS. I want to change the look and feel of a page. i understand I need to change/create the style-sheet associated with the template of that page. My problem is when I edit element in chrome, and try to save my changes made, it does not save the changes. I get the same state on reloading the page.
>How can I save changes made to the style element of my page?
>The template has three .css files associated with it. How can I know which .css is the one I am making the changes in?
>Is there any simpler way in which I can style a page associated with a default template.
I am really stuck and dont know how to proceed :(
I will be very very thankful for your suggestions and help.
Best regards,
Naurin

Re: Design Style sheet

Posted: Thu Jul 30, 2015 5:47 pm
by Dr.CSS
Making changes using chrome developer tools is nice to see what it may look like but it will never actually effect the style sheets...

Depending on which theme you are using will depend on which style sheets you need to change, look in the template for comments on what is where, then open the styles sheet to edit it in CMSMS...

Comments in template example...

CSSMenu top + 2 columns

{* Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet "Layout: Top menu + 2 columns" *}
<div id="header">

Re: Design Style sheet

Posted: Fri Jul 31, 2015 9:33 am
by naurinjamil1
Hello,
Thank you so much for your tip. Please tell me if I have understood you correctly. Locate the things I wish to change in the template, and then make corresponding changes in the style sheet?
My problem is that my default template has three style sheets associated with it :( And I am confused which style element belongs to which style sheet :( Can you please guide me through that.. or do you think its just better that I start to build a template and style sheet from scratch ?
Thanks a lot,
Naurin

Re: Design Style sheet

Posted: Thu Aug 06, 2015 10:52 am
by dondion
Hi Nauri,

The developer tool in chrome is just to see how it looks like, like Dr. Css said.

You should be able to see in what stylesheet the css is that you want to edit.
Any edit in a stylesheet that is associated with your template, should work in your website.

So in your admin, you go to:
Layout -> Stylesheets
Open the stylesheet you want to edit.
Change the css-code and save your changes.
Now check your website.

If you want to change excisting css-code: just Search for the id or class name in the stylesheet and edit as you like.