V5: Templates

V5: Templates

v5 logo imageThis month marks the release of the long-awaited Version 5 for Associate-O-Matic. Two years of planning have culminated in this incredible upgrade. Gone are the bulky HTML tables, replaced by smooth CSS coding, allowing for unprecedented control over what appears on the page. After devoting the last two months discussing almost everything about this upgrade except the main feature,  it’s time to take the bull by the horns. But the details of the templating system are so vast we could not hope to cover it all in a single post. Instead, we’ll take a lofty overview which will hopefully allow the typical AOM user to understand what this change means for them.

To start with, the first thing many users will want to know is what will happen when they upgrade to v5; will it wipe out their settings? Do they have to learn a new way of doing things? How will it change the process of setting up a site? Most AOM store owners may not see any changes, other than the non-template features that have been discussed in a previous post. But like a turbo-charged Volkswagen, the real differences lie under the hood.

If your site has the standard setup of perhaps a header image, some unique colors, and (hopefully) original text in custom boxes, you may not see anything unusual when you upgrade. But if you view the Source Code in your browser, the difference is obvious:

Source code for typical v4.5 store
Source code for typical v4.5 store


Source code for typical v5 store
Source code for typical v5 store


By replacing the tables with CSS, the pages should load slightly faster and run more smoothly. Plus it’s much easier to find your way around. The basic upgrade process itself is unchanged from past versions. You download the zip file, unzip it, and upload it directly over your current installation. When the files and folders are uploaded, log into your AOM control panel and click on any Save button. As always, it’s recommended that you backup a copy of your cfg.saved.php file (located in the /aom directory folder).

The upgrade will add several new subfolders, such as colors, themes and tpl. Briefly, their functions are as follows:

  1. colors – this will contain the color scheme files, which allow you to change your site colors with a single click. Premade templates will include one or more color schemes, so you can choose the one you prefer. You can also override the schemes if you want to tweak one to your liking (depending on the template).
  2. themes – template files will be uploaded here (more on this in a moment).
  3. tpl – in this folder are the files that actually transform the template files into a usable format. It is strongly recommended that you do not attempt to change any of these files, as doing so may cause your AOM site to malfunction. Think of this area as the transmission of the template engine.

Once you’ve completed the upgrade, you will notice a new tab in your control panel: Themes.  Clicking this will give you a view similar to:

Themes tab view

At this point you will only have one theme, the default one. As new themes become available (such as those for sale here), you can install them directly from this page. AOM will upload and unzip the files for you, and make any associated color schemes available through the Colors tab. Here is an example of what an uploaded template theme looks like, installed and ready to select:

Themes tab with additional template

You simply click on the theme and save. Then go to the Colors tab and pick the color scheme you want to use. The theme and colors are applied to your site, which then displays the new layout. You can go back to the default, or add another new theme any time you wish. The beauty of this system is that you don’t have to suffer through picking colors or trying to apply HTML yourself. Someone will have already done that for you.

For those who are used to the current method of picking colors, etc., you don’t have to learn a new system. The control panel operations are almost unchanged, except for the new features. While v5 will come with only the default theme, there are a plethora of color schemes bundled with it that you can use as is, or modify in the ‘normal’ fashion. Meaning you can still pick your own main color, accent color, line color and so on.

If your current site uses a custom header (and/or footer) file, you may be able to use your custom file(s) at least with the default theme. Site customizations that operate on HTML tables will probably fail, since nearly all the table code will be removed in v5. Your customizations might need to be redone to operate in a nearly-pure CSS environment. Or you could change to a new theme entirely, and bypass the trouble of having to go back and change your existing code.

An important point to note however, is that a custom header/footer that uses table code within itself, will not be affected; only the table code in AOM will be removed. The tables in your custom header or footer files will not change.

Going forward, many customizations that were done with external header/footer files will probably now be incorporated directly into a theme. For anyone thinking of creating their own themes, the best way to proceed would be to copy the default template and make changes in the copy. This preserves the default as a fallback in case any changes made cause functionality problems.

Ultimately, v5 will do for Associate-O-Matic what themes have done for blogs – allow someone with no programming experience (or no confidence in their ability to match colors) to achieve a professional-looking site with just a few mouse clicks. Because the unzip and install process is handled within AOM, setting up a theme is even easier than installing the program itself. The user will still be responsible for some areas, such as installing the AWS keys, setting up the categories, and making various choices about what to display on their storefront; but make no mistake – v5 is nothing short of revolutionary in dealing with what many people see to be the burden of managing the overall look of their store. In a world where ‘improvement’ is synonymous with ‘increased complexity’, this is a change that really makes the end product easier to use.

Welcome to v5.

Latest posts

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.