Page 1 of 1

How to use two CSS files for a htm template

Posted: Mon Jul 15, 2019 2:38 pm
by rommellim
Hi, I am new to CMSimpleXH. I am attempting to create a CMSimpleXH template from a website generator and the CMSimple tags seem to work fine. My problem is that the html file generated has to CSS files: one for the global styling and one for specific elements. How can I can make CMsimpleXH detect both of my CSS files for my template?

Help is greatly appreciated...

Re: How to use two CSS files for a htm template

Posted: Mon Jul 15, 2019 3:09 pm
by frase
Several possibilities:
1.
You can pack both files into one and put them in the template folder with the name "styles.css".
CMSimple_XH will find the file automatically.
2.
You take the file with the global styling and put it in the template folder as "styles.css".
Put the second file under any name there as well.
In "template.htm" you call the second file in the header:

Code: Select all

<link href="<?=$pth['folder']['template']?>your-specific.css" rel="stylesheet">

Re: How to use two CSS files for a htm template

Posted: Mon Jul 15, 2019 3:35 pm
by rommellim
I will try option 2... thanks for the help.

Re: How to use two CSS files for a htm template

Posted: Mon Jul 15, 2019 5:25 pm
by Tata
Or one more way:
1. rename one of the generated styles (preferably the global styling) to stylesheet.css
2. rename the second style to whatever.css
3. include the whatever.css on the beginning stylesheet.css

Code: Select all

<!-- Including whatever.csscss filer -->
@import "whatever.css"; 
<!-- stylesheet.css -->
body{background: #fff;}
...
4. save both files under templates/your_template
The only consequence is that only the stylesheet file remain editable in admin modus. Advantage here is, that you don't need to call it in template (is is called by head() template tag).
However, keep in mind that if there are used any graphics in the template and if they are defined in CSS files
e.g.:

Code: Select all

body{background: url(images/background.jpg)....;}
the images must be saved in templates/your_template/images.