Page 1 of 2

Template

Posted: Sun Jan 05, 2014 7:14 pm
by johnfletchertt
I am new to cms made simple. I have successfully installed it locally on my laptop. On my laptop as well I have my own site, already created and validated by the w3c validator using XHTML 1.0 Strict. I now wish to power my site using cms made simple. Both are separate in the htdocs.

htdocs/cmsmadesimple
htdocs/mysite

I am under the impression that this means first creating a template, then a style sheet, then attach the style sheet to the template. I first tried to create a new template by copying and pasting all my code into the new template form field and just added the {title} - {sitename} and {content} tags. Made the default and set to all pages. But the site just did not show and I go the OOps' an error occurred page. My site uses several style sheets. I am not sure how to turn my site into a cms made simple template and I would like to know how is 'smarty' involved in all this? Not seeing much helpful video tutorials and a single good repository for literature is hard to find. Help!

Re: Template

Posted: Sun Jan 05, 2014 9:51 pm
by Jo Morg

Re: Template

Posted: Mon Jan 06, 2014 12:05 am
by johnfletchertt
I can't get past step 2. In step 2 you have to copy the content of your old page. Here is my content.

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/sub.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>KNOXTT.COM LIMITED</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<link href="css/global.css" rel="stylesheet" type="text/css" />
<__script__ type="text/javascript" src="js/slideshow2.js"></__script>
<__script__ type="text/javascript" src="js/slideshow.js"></__script>

<__script__ type="text/javascript">
$(function() {
	$('#mid-mid').cycle({ 
  fx: 'custom', 
  cssBefore: { top: 232 }, 
  animIn:  { top: 0 }, 
  animOut: { top: -650 } 
}); 
});
</__script>
<__script__ type="text/javascript">

function checkJavaScriptValidity()

{

document.getElementById("mid-mid").style.visibility = 'visible';

document.getElementById("mid-mid2").style.visibility = 'hidden';





}

</__script>
<!-- InstanceEndEditable -->
</head>

</__body>
<div id="main">

<div id="header">

<div id="knoxttLogo"><img src="images/knoxtt-Logo.jpg" width="172" height="43" alt="KNOXTT.COM LIMITED" /></div>

<div id="menu-text">
<div id="top-menu">
<ul>
<li><a href="portfolio.php">portfolio</a></li>
<li><a href="contact.php">contact</a></li>
<li><a href="about.php">about</a></li>
</ul>

</div><!--end of top-menu-->

<div id="menu">
<ul>
<li><a href="index.php">home</a></li>
<li><a href="web.php">websites</a></li>
<li><a href="graphics.php">graphics</a></li>
<li><a href="database.php">database</a></li>  
<li><a href="archives.php">archives</a></li>
</ul>

</div><!--end of menu -->
</div><!--end of menu-text-->


</div><!-- end of header-->
<div id="body">
<!-- InstanceBeginEditable name="content" -->
<div id="content">

<div id="sub-left-box"> 
<p>
<img src="images/title_Websites.jpg" width="250" height="50" alt="Website Design" />
</p>
<p class="sub_text">
Our Website Designs are built from the ground up, in alignment with your organization's vision and or objectives. We do not use pre-built websites also known as templates. So your site does not look like those "Other" sites.
Built by Knoxtt your site will stand out and truly reflect the nature of your business.
For more information please e-mail to:<br />
<img src="images/email.jpg" width="194" height="30" alt="Send us your request" />
</p>
</div><!--end of sub-left-box-->

<div id="sub-right-box">
<img src="images/sb_Websites_image.jpg" width="513" height="363" alt="KNOXTT.COM Builds Websites" />

</div><!--end of sub-right-box-->







</div><!--end of content-->

<!-- InstanceEndEditable -->

</div><!-- end of body -->
</div><!-- end of main -->


<div id="footer">
<div id="footer-text">copyright <b>&copy;</b> knoxtt.com limited 2012</div><!-- end of footer-text-->
</div><!-- end of footer -->

<__body>
<!-- InstanceEnd --></__html>

If I try to view this from the cmsms view html interface, I get nothing. I'll include a copy of the file just in someone wants to have a closer look. I have copied the images folder the root of the cmsms webroot folder. How else would the images show? I can understand the javascript not working and other stuff but absolutely nothing shows. I can't upload the file so to bad for me. Hoping someone could help here. I really like cmsms

Re: Template

Posted: Mon Jan 06, 2014 12:37 am
by johnfletchertt
Ok, things are working out somewhat. I realize I have to use plain old static html and then ass the css separately as a style sheet. One big question here. My style sheet references images from my images folder. Where to I dump those images so that the style sheet and the template page can pick them up?

Re: Template

Posted: Mon Jan 06, 2014 1:51 am
by johnfletchertt
My custom template has 3 columns with a header row on top and the footer below. The middle column is the real changing content and the other 2 at the sides are small and carry some navigational content and some pure content. I am using the {content} for the middle column, but what do I use for the 2 outer columns?

Re: Template

Posted: Mon Jan 06, 2014 5:05 am
by rotezecke
check your template for { } curly brackets (javascript, css).
none-smarty syntax that includes curly brackets should be wrapped in {literal}{/literal} tags.

http://www.smarty.net/docsv2/en/languag ... on.literal

smarty3 is a bit more understanding, however, if unsure, use {literal}.

Re: Template

Posted: Mon Jan 06, 2014 6:07 am
by staartmees
It would be helpfull to post the OOPS-error you get.
Also keep your cmsms and modules up-to-date, so upgrade your cmsms to the latest version.

Re: Template

Posted: Mon Jan 06, 2014 9:50 am
by velden
I often ;D get 'Oops' errors without any other useful information.

Re: Template

Posted: Mon Jan 06, 2014 12:42 pm
by Jo Morg
johnfletchertt wrote:My custom template has 3 columns with a header row on top and the footer below. The middle column is the real changing content and the other 2 at the sides are small and carry some navigational content and some pure content. I am using the {content} for the middle column, but what do I use for the 2 outer columns?
There is some benefit from installing the sample content that comes with CMSMS. Most of it is in itself a tutorial, with templates and css samples well commented, and showing basic to not so basic Smarty and CMSMS techniques. It is well worth it to study them. You should also browse the docs link I posted before. All core functions, tags and modules have also a help link with detailed instructions.
There is a tag {menu} for navigation, and check {content block='another_block'} and see help on how to use this. You can have several content tags on a template (note you need at least one at all times per template). Lastly check the sample Stylesheets on how to set images, and image paths with CMSMS.
HTH

Re: Template

Posted: Mon Jan 06, 2014 6:27 pm
by johnfletchertt
While digging into those default stylesheets, I noticed the images are referenced from url([[root_url]]/uploads/ngrey/darknav.png). Is the [[root_url]] necessary or can I have uploads/images/myimage.png. Another thing, can my templates and stylesheets reference the same folder for images?

Re: Template

Posted: Tue Jan 07, 2014 8:52 am
by velden
[[root_url]]/uploads is good practice (though I prefer [[uploads_url]])

'uploads/' would probably be wrong as the browser will 'translate' those paths relative to css file location. Which is the cache folder so it can not find the images.

Of course template and stylesheet can reference the same folder. It's up to you.

Re: Template

Posted: Tue Jan 07, 2014 12:11 pm
by Jo Morg
velden wrote:[[root_url]]/uploads is good practice (though I prefer [[uploads_url]])
Not only good practice but needed, because of the way stylesheets are cached: http://docs.cmsmadesimple.org/layout/stylesheets

Re: Template

Posted: Mon Jan 13, 2014 3:09 pm
by johnfletchertt
so I've built my template, the css and re-edited the default home page and attached my template to it and I get the error page when viewing it. The one that says

Code: Select all

Sorry, it looks like something went wrong and an error has occurred. 
Don’t worry, it can happen to any of us.
Are there set steps to trouble shooting this kind of problem. It's annoying cause all I actually did is copy and paste. There is an existing site using cmsms and all I did was copy the template, the stylesheet and the images folder to the uploads. And I get this error. Where do I start?

Re: Template

Posted: Mon Jan 13, 2014 3:17 pm
by velden
Not sure. If it's an older version of CMSMS it is possible an older version of Smarty is used. The later versions is much more pickier about syntax errors.

Check all used Smarty tags in the template (assuming you did NOT change the PAGE content) and look for unclosed quotes, or unnecessary spaces at the beginning/end of tag.

You can also comment the tags by using two asterisks {* whatever *} to temporarily disable it. Note that you should at least have the {content} tag in the template.

Re: Template

Posted: Mon Jan 13, 2014 3:52 pm
by johnfletchertt
Ok, yes. It's an older version of cmsms, version 1.8.2 "Toliara". I did not check for those unclosed quotations etc cause as I mentioned before, it works fine as is right now on the older version and so I don't think there are syntax errors. I am testing on version, 1.11.9 “Bartolome”. Having said that, what do I need to re-check and double check?