CubeCart uses the Smarty template engine, which means you can create stunning store designs with just HTML and CSS — no PHP experience required.

Getting Started

  1. Navigate to the skins/ directory in your CubeCart installation.
  2. Copy the foundation folder and rename it (e.g. my-custom-skin).
  3. In your CubeCart admin, go to Settings > Skin and select your new skin.

Skin Structure

skins/my-custom-skin/
  templates/       — HTML template files
  css/             — Stylesheets
  js/              — JavaScript files
  images/          — Skin images and icons
  config.xml       — Skin metadata

Editing Templates

Templates use Smarty syntax to display dynamic content:

  • Variables: {$product.name}
  • Conditionals: {if $logged_in}Welcome back!{/if}
  • Loops: {foreach from=$products item=product}...{/foreach}

The default foundation skin is built on the Foundation CSS framework and is fully responsive. It’s the best starting point for customisation.

Tips

  • Always work on a copy — never modify the original foundation skin, as it may be overwritten during upgrades.
  • Use your browser’s developer tools (F12) to inspect elements and find the corresponding template files.
  • See our article on CubeCart’s template system for more detail on Smarty syntax.
  • For custom functionality, use code hooks and plugins rather than editing core files.

Need Help?

If you don’t have HTML/CSS experience, consider hiring a freelancer from Upwork or contact our Technical Support team for design assistance.