slscart logo

Tips for Templates

Tips on creating slscart templates. For enhancing the store's looks, check out using css on the store's template.

1. Put %META_TAGS% before %TITLE_TAG%. Included in the meta tags include code is the character set designation which needs to be before the <title> tag.


2. For images, add the image's width and height in the specification. The web page will load faster since the browser does not have to calculate the actual image's width and height on-the-fly.

<img src="%SITE_URL%/images/Paypal.png" alt="payment methods" width="177" height="57">

3. For images, add an alt attribute with a good description of what the image represents.

If you add your own images to the template don't forget to use the alt attribute with the <img> tag. Here's why.

4. To go back to choosing a template via dropdown bar, clear the custom template and update it.

Ignore the warning about permissions.

5. How to choose a built-in template

When choosing a template via dropdown, choose template then click 'Apply'

6. Google recommends the following when it comes to font and responsive design:

7. Ability to use small font in the template

The small font size is set in Font & Colors in the storeadmin. The smfont class can be used to set text to the small font.

<div class="smfont">
Hosted by <a href="" target="_blank">My Hosting</a>

8. Note which fonts & colors affect insert codes.

Visit the fonts & colors page

9. How to center the page title

There are three classes: txtleft, txtcenter, txtright available. Put the <div> and </div> around %PAGE_TITLE%

<div class="txtcenter">%PAGE_TITLE%</div>

10. Add an ajatix menu to slscart

Adding the menu has advantages because it is compact and has dropdown capability.


View cart can't be used in the menu because it is dynamically assembled, depending on what page you are on.

Any time a new category is added, the menu needs to be updated.


* Create a menu folder

* Create horz menu in Expression Web or Dreamweaver in the menu folder

* Upload all the files except the menu in the menu folder

* Copy this to <head> area:

<link rel="stylesheet" href="%SITE_URL%/twm_menu/ajxmenu.css" type="text/css">
<script src="%SITE_URL%/twm_menu/ajxmenu.js" type="text/javascript"></script>

* Copy and paste menu code into slscart template under <sb_hpages>


* Made mods to horz menu

* Upload all files

* Copy and paste menu code into slscart template under <sb_hpages>