JavaScript is a good way to add dynamic content to your site. JavaScript is an object-oriented computer programming language commonly used to create interactive effects within web browsers. So whether you want to add a Slider, Chat Addon feature, or spruce up your site with different modifications that require JavaScript, this will help you out within the PinnacleCart.

Applies to Version(s): 3.9.x series

In this article, you will learn:

How do I add JavaScript to my cart?

What is a literal Tag?



How do I add JavaScript to my cart?


Note: Pinnacle Cart uses Smarty templates engine to generate HTML pages. It requires some basic programming skills to edit these files. If you're unfamiliar with HTML, we STRONGLY DISCOURAGE changing any code on your cart as these changes could disable some functions on your live site. Our customer support team cannot support you on any customizations or code changes you make to the application.


There are a few different ways to add JavaScript into your cart. One, would be to add the JavaScript directly into HTML files. To do this, you would either access the files directly in your File Manager or FTP.


When adding JavaScript directly into HTML files, be sure to surround the code with literal tags, to ensure that it isn't falsely interpreted as Smarty. You can learn how to add Literal Tags below.


The other option would be to add a call to JavaScript in your HTML head file.


Using your favorite text editor, like Notepad++, create a new file and Save As element-custom-head.html. Add your call to the JavaScript file. An example would be;


<script type="text/javascript" src="{$skin_javascript}filename.js"></script>


As you can see above, {$skin_javascript} is referencing the javascript folder in your skin. The filename.js is referencing your actual JavaScript file. Obviously, your file name would be different. You can learn more about editing the head here.


Now, using FTP or your File Manager, navigate to content/skins/_custom/skin/javascript and upload your JavaScript file.


Lastly, go to Design > Cart Designer which will refresh your skin cache and allow your JavaScript call to go live.


What is a literal Tag?


You can learn more about literal tags in this article. The shopping cart requires any JavaScript code to be surrounded by {literal} tags for the JavaScript to work. The {literal} tag tells the smarty engine to ignore any functions between the tags.


Example:


{literal}
alert("Welcome!");
{/literal}


One place right away you can see these tags is in Google Tools under Marketing.

google tools

 

Once you enable Google Analytics conversions, here's an example of what you will see under Conversion Tracking Code.


literal sample


This last example is showing that full code in a Text Pad and how it looks all put together. 



Editing the Head of Your HTML

Adding Literal Tags To Your Site


If you didn't get your question answered, please contact the Pinnacle Cart Support Team. To submit a ticket, go to the My Account drop-down menu at the top right of the admin area and select Support.