Page 1 of 1

I know it's been asked...{literal}

Posted: Tue Dec 22, 2015 1:13 am
by DaUrge
I have the latest download installed of CMSMS on my server. I've gone through and read how to use my templates and am successfully seeing my css show the page properly.

The problem is with the javascript for my menu and slideshow. I've added the {literal}{/literal} but the menu and slideshow are not working at all. I've also tried it without the {literal} tags.

Here is the code I put inside my <head> tags. It obviously works perfectly in dreamweaver and on my test site (non-cmsms).

{cms_stylesheet}<link href="p7-synergy.css" rel="stylesheet" type="text/css">
{cms_stylesheet}<link href="p7-synergy-theme.css" rel="stylesheet" type="text/css">
{cms_stylesheet}<link href="custom.css" rel="stylesheet" type="text/css">
{cms_stylesheet}<link href="p7SOM-Core.css" rel="stylesheet" type="text/css" media="all">
{cms_stylesheet}<link href="p7SOM-05.css" rel="stylesheet" type="text/css" media="all">
{literal}<__script__ type="text/javascript" src="/uploads/js/p7SOMscripts.js"></__script>{/literal}
{cms_stylesheet}<link href="p7IR2-01.css" rel="stylesheet" type="text/css" media="all">
{literal}<__script__ type="text/javascript" src="/uploads/js/p7IR2scripts.js"></__script>{/literal}
{cms_stylesheet}<link href="p7TM3-01.css" rel="stylesheet" type="text/css" media="all">
{literal}<__script__ type="text/javascript" src="/uploads/js/p7TM3scripts.js"></__script>{/literal}
{cms_stylesheet}<link href="p7STT-01.css" rel="stylesheet" type="text/css" media="all">
{literal}<__script__ type="text/javascript" src="/uploads/js/p7STTscripts.js"></__script>{/literal}

None of the scripts are working. I've verified that the location of the javascript files is correct.

Appreciate the help.

Re: I know it's been asked...{literal}

Posted: Tue Dec 22, 2015 1:38 pm
by paulbaker
The {literal}... tag is only needed if you have "raw" javascript in the template which includes curly brackets { ... } - this prevents Smarty trying to interpret javascript (and failing). So take them out as you are simply linking to external files (which is fine).

{cms_stylesheet} makes CMSMS insert the CSS file(s) associated with that template. There should only ever be 1 or 0 of these. You don't need them as you have inserted them, so remove them too. You are just linking to external static CSS, which is fine if you want to do it that way.

Suggest perhaps posting the whole of your template?

Re: I know it's been asked...{literal}

Posted: Wed Dec 23, 2015 12:05 am
by webguru
Appreciate the response and I understand.

When I removed all the {cms_stylesheet} the CSS broke. I did put one back in and it showed up fine again.

The javascript is not being found. I agree with another post I read somewhere about having a module to link the external javascript files like it does the CSS. That would be great.

I am using an off-canvas menu that is not working at all. The UL is at the bottom of the template. I believe it is because the JS is not being found, although I did verify it is in the path indicated.

Could it be that the CMSMS is in a sub-directory for testing purposes?

Here is the entire template:

<!doctype html>
<__html>
<head>
<meta name="viewport" content="width=device-width">
<meta charset="utf-8">
<!-- TemplateBeginEditable name="doctitle" -->
<title>{title} | {sitename}</title>
<!-- TemplateEndEditable -->
<meta name="robots" content="index,follow" />
<meta name="description" content=" " />
<meta name="keywords" content=" " />
<meta name="copyright" content=" " />
<meta name="author" content=" " />
<meta name="revisit-after" content="7 days" />
<link href='http://fonts.googleapis.com/css?family=Life+Savers' rel='stylesheet' type='text/css'>
<link href="http://fonts.googleapis.com/css?family=Federo" rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Limelight" rel="stylesheet" type="text/css">
{cms_stylesheet}<link href="p7-synergy.css" rel="stylesheet" type="text/css">
<link href="p7-synergy-theme.css" rel="stylesheet" type="text/css">
<link href="custom.css" rel="stylesheet" type="text/css">
<link href="p7SOM-Core.css" rel="stylesheet" type="text/css" media="all">
<link href="p7SOM-05.css" rel="stylesheet" type="text/css" media="all">
<__script__ type="text/javascript" src="/uploads/js/p7SOMscripts.js"></__script>
<link href="p7IR2-01.css" rel="stylesheet" type="text/css" media="all">
<__script__ type="text/javascript" src="/uploads/js/p7IR2scripts.js"></__script>
<link href="p7TM3-01.css" rel="stylesheet" type="text/css" media="all">
<__script__ type="text/javascript" src="/uploads/js/p7TM3scripts.js"></__script>
<link href="p7STT-01.css" rel="stylesheet" type="text/css" media="all">
<__script__ type="text/javascript" src="/uploads/js/p7STTscripts.js"></__script>
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
</head>
</__body>
<div id="fb-root"></div>
{literal}<__script__>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</__script>{/literal}
<div id="p7STT_1" class="p7STT right light"> <a id="p7STTa_1" class="p7STT-anchor" href="#"><i></i><span>Scroll To Top</span></a>
<__script__ type="text/javascript">P7_STTop('p7STT_1',300,1,450)</__script>
</div>
<div class="synergy-row borderBottom fillBlackish">
<div class="column-group max-100">
<div class="synergy-column column-20 padded fillRed centerAlignText"> <img src="{uploads_url}/images/logo.png" width="195" height="78" class="scalable" alt=""/> </div>
<div class="synergy-column column-60 centerAlignText"> <img src="{uploads_url}/images/welcome.png" width="600" height="100" class="scalable" alt=""/></div>
<div class="synergy-column column-20 padded rightAlignText topPadding"></div>
</div>
</div>
<!-- TemplateBeginEditable name="body" -->{content}
<div id="section-2" class="synergy-row">
<div class="column-group max-100 synergy-color-1">
<div class="synergy-column column-100">

</div>
</div>
</div>

<!-- TemplateEndEditable -->
<div id="footer" class="synergy-row synergy-color-2">
<div class="synergy-row">
<div class="column-group max-1200">
<div class="synergy-column column-33 padded leftAlignText">
<h2>Quick Menu</h2>
<div id="p7TM3_1" class="p7TM3-01 p7TM3">
<ul class="p7TM3">
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
</ul>
<__script__ type="text/javascript">
<!--
P7_TM3op('p7TM3_1',1,0,0,0,1,1,0,1,-1,300,1);
//-->
</__script>
</div>
<p>&nbsp;</p>
</div>
<div class="synergy-column column-33 padded leftAlignText">
<h2>Follow Us...</h2>
<div class="fb-page" data-href="https://www.facebook.com/xxxxx/?ref=ts" data-tabs="timeline" data-height="300" data-small-header="true" data-adapt-container-width="true" data-hide-cover="true" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/xxxxxx/?ref=ts"><a href="https://www.facebook.com/xxxxxx/?ref=ts">San Luis Obispo Car Free</a></blockquote></div></div>
</div>
<div class="synergy-column column-33 padded leftAlignText">
<h2>Email Us</h2>
<form name="form1" method="post" action="">
<input name="textfield" type="text" id="textfield" title="Name">
Name*<br>
<input name="textfield" type="text" id="textfield" title="Email Address">
Email Address*
<textarea rows="5"></textarea>
<br>
</form>
<p>&nbsp;</p>
</div>
</div>
</div>
</div>
<div id="footer2" class="synergy-row synergy-color-2">
<div class="column-group max-1200">
<div class="synergy-column column-100 padded">
<div class="synergy-row borderBottom">
<div class="column-group max-1024">
<div class="synergy-column column-50 padded">
<img src="{uploads_url}/themes/slo/facebookRound.png" width="200" height="200" alt=""/> </div>
<div class="synergy-column column-50 padded">
<img src="{uploads_url}/themes/slo/twitterRound.png" alt="" width="200" height="200"/> </div>
</div>
</div>
<p>
<__script__ type="text/javascript">document.write("- "+new Date().getFullYear());</__script>
&copy; San Luis Obispo Car Free Program | All rights reserved | Website by: <a href="http://www.xxxxxx.com" title="" target="_blank" class="blackText">Ad Agency</a></p>
</div>
</div>
</div>
{menu}
</div>
<__body>
</__html>

Re: I know it's been asked...{literal}

Posted: Wed Dec 23, 2015 2:37 pm
by Jo Morg
Either use {metadata} tag on the head section of the template, or a correct html base tag, or even use absolute paths on the script and link tags. You need, at least, one of those options correctly implemented...

Re: I know it's been asked...{literal}

Posted: Thu Dec 24, 2015 9:04 am
by velden
Like JoMorg says.

Use {root_url} (or {uploads_url}) to get the absolute url to either root or uploads.

Regarding {literal}: it's not likely you need it nowadays. Recent versions of Smarty allow the use of the curly brackets when you put a space or newline behind it. This is pretty convenient for generating cleaner code and for using Smarty tags/variables inside e.g. javascript.

Code: Select all

{$MySmartyVariableContainingMessage='proof of concept'}
<__script__ type="text/javascript">
  function foo(bar){ alert(bar)}; // <-- note the space after opening curly bracket
  foo("{$MySmartyVariableContainingMessage}");
</__script>

Re: I know it's been asked...{literal}

Posted: Thu Dec 24, 2015 9:24 am
by paulbaker
@velden: Thanks for the clarification on literal.

Re: I know it's been asked...{literal}

Posted: Thu Jan 14, 2016 1:05 am
by webguru
Thanks everyone for replying. Apologies for not getting back sooner. Had heart attack on 12/27. Doing fine now.

I did get it all working. Figured things out and CMSMS is much easier to use than other CMS programs.

My only suggestion with the extensions, for new people using CMSMS, is to categorize them. Would be much easier to find the extensions I might be looking for instead of having to read all the descriptions.

I am trying to figure out how to implement the "More" button so the reader can see the entire story. Isn't that a feature of CMSMS or just a simple link to another page?