Lesson 14. CS-Cart Design — Themes & Styles

Today we are going to take a closer look at themes and styles of CS-Cart business ecommerce solution.

Themes and styles are located at Design → Themes section of the php-based ecommerce software. In the Themes section you can choose, install, upload, delete, and customize themes and styles for your store. The page is divided into three parts: Current Theme of the complete shopping cart software at the top, Installed and available themes below, and general information to the right.

First, layouts and styles available for them. A layout determines the general structure of a storefront while style serves as a decoration for this structure. That’s why usually one layout has several styles attached to it. By the way the default Widget mode layout is used for built-in stores.

Next, there are two buttons on the Theme page: Theme editor, and Edit content on-site.The theme editor allows administrators to create unique styles for a storefront with just a few clicks, and content editing is used to change the names of interface elements, products, and pages on the go.

Below is the overview of the Theme editor sections.

General section. Change the favicon and choose whether to round the corners or not.

Logos. Change the theme, mail, and gift certificate logos.

Colors. Change the color of almost every element of the storefront.

Fonts. Tweak fonts for different storefront groups.

Backgrounds. Set a background color for the different parts of the e-commerce shop solution.

Custom CSS. Advanced style settings in CSS-format. We recommend to change this only if you know how to handle CSS.

It is important to note that the default layouts can not be changed.

As the name suggests Edit content on-site allows administrators to edit interface elements, product names, prices, etc. right on a storefront. To edit an element, hover the mouse pointer over it and click the appeared icon.

Other tabs are used to switch among themes and styles. The first tab is for the installed themes.

When we switch between styles, the theme this style belongs to is automatically applied. Styles can drastically change the look of the storefront with just one click. After that you can still proceed with your own customization.

The Browse all available themes tab, deleted and uploaded themes are found here. On the right side of the page there is the general information about the current theme — the theme name, directory, where the theme is placed, the number of layouts and styles, and the current theme developer.

The Rebuild cache automatically selector re-caches modified files on the fly. Besides all that use the Plus button to upload new themes, and the Gear button to clone existing themes. That was a detailed overview of themes and styles in CS-Cart easy web store builder.