Templates: How Do I?
-
EsquireX
Templates: How Do I?
Hello all,
I am new to CMSMS and I'm in need of assistance. When I first saw this CMS I thought it looked ok and maybe would be a bit easier to configure. After joining the forum, I viewed some of the sites created with CMSMS and I was pleasantly surprised. Now, I've installed it and don't know what to do first to customize the site. I've read about others adapting HTML templates to suit their needs but I still don't see how to do this or even where to put it after I've adapted it. After I've chosen a template, what next?
I am new to CMSMS and I'm in need of assistance. When I first saw this CMS I thought it looked ok and maybe would be a bit easier to configure. After joining the forum, I viewed some of the sites created with CMSMS and I was pleasantly surprised. Now, I've installed it and don't know what to do first to customize the site. I've read about others adapting HTML templates to suit their needs but I still don't see how to do this or even where to put it after I've adapted it. After I've chosen a template, what next?
-
westis
Re: Templates: How Do I?
Hi EsquireX,
For each page you select what template to use, either when you add a new page or edit a page that's already there (Content > Pages in the Admin panel). The templates are found under Layout > Templates. You can edit any template that is there or add one of your own. You use HTML and CSS (stylesheets) to make it look the way you want and you place the different sections of the page where in the template you want them with Smarty tags, like {Content} for the content that you add for each page in Content > Pages or {bulletmenu} for a menu that is created from the page structure.
Please read these two threads to get a better idea of how this works. If you have more questions, feel free to ask.
http://forum.cmsmadesimple.org/index.ph ... 589.0.html
http://forum.cmsmadesimple.org/index.ph ... 708.0.html
I'd be willing to share the template I use at www.kisima.org/cmsmadesimple if you find it useful.
For each page you select what template to use, either when you add a new page or edit a page that's already there (Content > Pages in the Admin panel). The templates are found under Layout > Templates. You can edit any template that is there or add one of your own. You use HTML and CSS (stylesheets) to make it look the way you want and you place the different sections of the page where in the template you want them with Smarty tags, like {Content} for the content that you add for each page in Content > Pages or {bulletmenu} for a menu that is created from the page structure.
Please read these two threads to get a better idea of how this works. If you have more questions, feel free to ask.
http://forum.cmsmadesimple.org/index.ph ... 589.0.html
http://forum.cmsmadesimple.org/index.ph ... 708.0.html
I'd be willing to share the template I use at www.kisima.org/cmsmadesimple if you find it useful.
-
EsquireX
Re: Templates: How Do I?
Thank you, Westis!
I think I can work most of it out. My only problem is changing background colors for the page and things like that. I could probably use some help with creating a horizontal navigational menu below my banner image. My main problem is using CSS - I don't know it. Do you know if it is possible to NOT use CSS and only use HTML? This would be a lot easier for me.
I think I can work most of it out. My only problem is changing background colors for the page and things like that. I could probably use some help with creating a horizontal navigational menu below my banner image. My main problem is using CSS - I don't know it. Do you know if it is possible to NOT use CSS and only use HTML? This would be a lot easier for me.
-
westis
Re: Templates: How Do I?
Yes, you can use tables instead of div's, but I would recommend learning more about CSS instead. That makes your page much easier to customize, it is easier to make your page accessible and usable for people with disabilities, and it makes your page load faster. The problem is usually cross-browser issues, especially with IE.
But if you still would like to use tables instead, then just use a normal html layout and put the tags like {content} and {bulletmenu} where you want them.
For changing background with CSS, use background-color: #000000; for for body if you'd like to change the page background color, or in any css class that you'd like to change the background color for. Like this:
For horizontal menus, the best thing is to use lists and customize by CSS. Have a look at some good examples for both vertical and horizontal lists at http://css.maxdesign.com.au/listamatic/index.htm
For a general introduction to CSS, try for example http://www.w3schools.com/css/css_intro.asp or http://www.w3.org/MarkUp/Guide/Style. There's also a good forum at http://www.csscreator.com/css-forum/
Hope this helps.
But if you still would like to use tables instead, then just use a normal html layout and put the tags like {content} and {bulletmenu} where you want them.
For changing background with CSS, use background-color: #000000; for for body if you'd like to change the page background color, or in any css class that you'd like to change the background color for. Like this:
Code: Select all
body {
background-color: #000000;
}For a general introduction to CSS, try for example http://www.w3schools.com/css/css_intro.asp or http://www.w3.org/MarkUp/Guide/Style. There's also a good forum at http://www.csscreator.com/css-forum/
Hope this helps.
-
EsquireX
Re: Templates: How Do I?
Without getting too in-depth, can you use CSS within the HTML page or does it have to be a separate file?
This is where I see it as being more of a pain when it's using a separate file. Too difficult to customize having to switch to this page and switch to that page for editing. It may be faster but I don't see it. Maybe if there was an easier way to customize the CSS data.
This is where I see it as being more of a pain when it's using a separate file. Too difficult to customize having to switch to this page and switch to that page for editing. It may be faster but I don't see it. Maybe if there was an easier way to customize the CSS data.
-
westis
Re: Templates: How Do I?
Well, yes, you could use so-called inline CSS, having all the styles between the head tags or for each text directly in the html. But once you've done the html layout all you really need to touch is the css. Then it's good to have it in a separate file, so that you easily can overlook the html template.
Also, if you've looked at how the templates lookin the admin panel, there is one box for the html template and below it is the stylesheet. So they're both on the same page. You could still use external stylesheets though, as that might be easier for editing.
These things take some time to learn, but once you've learnt it you will be glad you spent that time!
Also, if you've looked at how the templates lookin the admin panel, there is one box for the html template and below it is the stylesheet. So they're both on the same page. You could still use external stylesheets though, as that might be easier for editing.
These things take some time to learn, but once you've learnt it you will be glad you spent that time!
-
EsquireX
Re: Templates: How Do I?
On your site, which directory do you upload your new HTML and CSS files and are their names index.css and index.html? Wouldn't there be a index.php?
-
westis
Re: Templates: How Do I?
You don't upload a new index.html, index.php or index.css. You simply edit the template in the web-based admin panel under Layout > Templates (where you also can change the stylesheet that is saved in the database). Then on Content > Pages you select what template to use for each page. You never need to touch index.php, that file is used for all your CMSMS pages. Actually, you can do all your editing in your browser, logging into your admin panel through www.yoursite.com/admin, and never have to touch any files if you don't want to.EsquireX wrote: On your site, which directory do you upload your new HTML and CSS files and are their names index.css and index.html? Wouldn't there be a index.php?
Hope that helps. The documentation is being written, hopefully these things willbe clearer by then. But feel free to ask again if I wasn't clear enough.
-
EsquireX
Re: Templates: How Do I?
That helped a great deal!
Now, I assume I upload the images used for my page using the Image Manager but, if so, how does the page know where to get the image to display?
Now, I assume I upload the images used for my page using the Image Manager but, if so, how does the page know where to get the image to display?
-
westis
Re: Templates: How Do I?
How much html do you know? Do you use an WYWIWYG editor to edit your pages?
There are several ways of anwering your question.
1. You can place an image tag in the html code for your page (Content > Pages > YourPage), with the relative path to your image. The images you upload through the Image Manager are put in the uploads/images folder or sub-folders to that if you have created sub-folders. An image tag would then look like this:
2. If you use a WYSIWYG editor you can select an image that you have already uploaded or even upload an image directly through the WYSIWYG. How to do that depends on what editor you are using. You select what WYSIWYG editor to use in Site Admin > User Preferences.
I hope that answers your question. If it doesn't, please let me know. That is good to know since I also write the documentation and it's good to have all these kind of questions answered as clearly as possible in the documentation.
There are several ways of anwering your question.
1. You can place an image tag in the html code for your page (Content > Pages > YourPage), with the relative path to your image. The images you upload through the Image Manager are put in the uploads/images folder or sub-folders to that if you have created sub-folders. An image tag would then look like this:
2. If you use a WYSIWYG editor you can select an image that you have already uploaded or even upload an image directly through the WYSIWYG. How to do that depends on what editor you are using. You select what WYSIWYG editor to use in Site Admin > User Preferences.
I hope that answers your question. If it doesn't, please let me know. That is good to know since I also write the documentation and it's good to have all these kind of questions answered as clearly as possible in the documentation.
-
EsquireX
Re: Templates: How Do I?
Westis,
It answered my questions and now I can finish my site. I'll be sure to post a link so I can show what I've been working on. Your software has been a great help. I've tried most CMS packages, minus php-nuke, and this one makes the most sense for me. I'm excited to finally be able to get my site up and working.
Once again, thank you!
It answered my questions and now I can finish my site. I'll be sure to post a link so I can show what I've been working on. Your software has been a great help. I've tried most CMS packages, minus php-nuke, and this one makes the most sense for me. I'm excited to finally be able to get my site up and working.
Once again, thank you!
-
westis
Re: Templates: How Do I?
You're welcome, I'm glad I could help. I'm actually quiet new to CMSMS myself, it's Wishy who is the guy behind it, although there is a growing community helping developing it further. 
Looking forward to see what you come up with!
Looking forward to see what you come up with!
