Understanding Wrappers

A Wrapper is an HTML template that "wraps" itself around other pages within the content management system, and is a central point in how the Cartooga e-commerce platform "thinks". Wrappers are used to maintain a consistent look and feel throughout your site, simplify the process of creating new web pages, and allow you to update the look of your site without having to edit every page. All of the web pages you create can be assigned a wrapper, and when the page is accessed in a web browser the wrapper wraps around the content and generates the full page. For example, the HTML for a wrapper would look something like this: See the SmartTags embedded into the Wrapper?  These tell the system to dynamically insert content relevant to the page, logged in user, or other related data.  When you're editing pages that have a wrapper assigned, you'll see a field where you can enter the page title, description, and keywords for the page. These will automatically be inserted when the server renders the page using the wrapper.

Lets say the page we're creating is called /example-page.html, and contains the following HTML: Now whenever someone accesses /example-page.html in their web browser, the server will take the HTML code for the page and insert it into the wrapper where the !~SERVER_PAGE_CONTENT~! tag appears.

When the server generates the page, the output HTML would look like this: That's all there is to it! You can create as many wrappers as you want, and assign any wrapper you want to any page and it will wrap itself around whatever content is inside. Wrappers work on both managed pages like Category lists, products, and search results, and on custom pages you create yourself.

We also have a library of website themes which are ready-to-run layouts for your store that can be installed with a single click.