Note: Theme modification involves any change to the default values in the HTML or CSS of any theme or widget. Support can direct you to the correct page to make changes or to reset the widget, page HTML or CSS to its default value. This will undo any customization that may be in place. Before you create or modify a theme using HTML and CSS it is suggested to have a backup handy.

While theme modification is outside what support is allowed to assist with, if you need assistance with making modification to the theme, our implementation department is available to make these modification at an hour rate. If the service is ever needed please let us know and we will get that process started for you. Or check out our new Theme Store to find a theme that suits your needs.

Examples of Widgets available on the Home Page

Deja Vu theme displaying available widgets.

Home Page Admin Console

Navigate to your Theme > open Theme > Open Home Page > Open Widgets

How do I add widgets to my homepage?

The default theme has 3 widgetareas, Top, Bottom, and HomePageHeaderWidgets

HomePageHeaderWidgets display above the left, right, and center content. The width is 100% of the layout.

Widgets can be added to a widgetarea by clicking the Add Widget button on the right of each widgetarea. An overlay will open with all the available widgets, click Add to select a new widget.

How do I organize my widgets?

The new widget will be added to the bottom of the widget list.

A widget can be moved in the line up by placing you mouse on the widget you would like to move, hold down the left button on your mouse, drag and drop in the correct order.

The first icon on the left is to edit the widget.

The trash can is to delete the widget

How do I Add a widgetarea

If you would like to add a widgetarea, open the HTML Editor under the Home Page. On the default layout, the Bottom is empty. ( see the screen shot below ). To add a new widgetarea, you will add the code to the HTML layout.

The example, Middle, will fall between Top and Bottom.

The code would be:

<ac:widgetarea id="Middle">
</ac:widgetarea>

The new widgetarea will need to be placed after the last (example: top) and before the beginning (example: bottom).

To help you know where to add the widgetarea, if you highlight the widgetarea opening tag, the closing widgetarea tag will highlight for you.

This examples below, I highlighted the opening widgetarea for "Top" and the closing widgetarea highlighted.

Place the code after the last and before the next.

<ac:widgetarea id="Middle">
</ac:widgetarea>

Now, there is an additional widgetarea to help keep your widgets organized. (see screen shot below)

How do I move the Slide Show?

By default, the slide show is set above the left and right column, running 100% of the layout. The slide show can appear between the left and right column by dragging and dropping the widget from HomePageHeaderWidgets area to Top area.

How do I change the controls for the Slide Show?

These are the default settings for the slide show. You can display either or numbers or arrows. The screen shot below shows the default, the second screen shot shows the next and previous arrows.

Detailed instructions on adding slides, How to set up the slide show widget

How do I edit the HTML Widget?

The HTML widget is very versatile.

The first screen shot shows the widget as displayed on the home page.

The second screen shots shows the html view.

The third screen shots shows the WYSIWYG mode which allows users without HTML expertise to add or edit text on the homepage.

Storefront View

HTML View

WYSIWYG View

Category List

A new widget allowing the store to display a text link for each category. The widget can display the entire list of categories or you can make several lists of specific categories. The screen shot below shows the admin view of the Category List. The Main Category will display all categories or you can select a specific category.

How do I select and edit Product Displays?

Product Display Widgets pull products from the catalog in several ways, store owner selection, new products added to the catalog, and catalog sells.

How can I add and edit the products in the New Items, Featured Items, Spotlight Items, Hot Sellers, Sale Items Widgets

The Settings page for each of the Product Displays will be the same. You will need to expand the drop down menu for Product Display Type to view the available widgets.

The example is Featured Items.

The Deja vu theme default for total of number of products shown is 4. Only 4 products from your catalog will be selected, even if you have checked the Featured Items box on more than 4 products. If you set the # of Products to Display to 12, as the page refreshes, the widget will shuffle the 12 products.

Products Per Line limits the number of products shown on the grid at one time. Deja vu default is 4 products on the grid. Each time the page refreshes, the products are shuffled giving the shopper a new version each time.

Redirect to Checkout on Add to Cart takes shopper to the cart instead of the product. Once in the cart, they do have an opportunity to continue shopping.

Display & Layout

Example from Deja vu theme.

Widget Name, if populated, will appear on the widget label on widget admin ( as seen in first screen shot above ).

If you have a widget which you do not need at the time, but you would like to activate at a later date, you would hide the widget instead of deleting.

Header Text can be changed from the default text by adding a new name to the Header Text box. Example, default on each product widget is the name of the widget, Featured Items, New Items, etc. If you would like the Featured Items to be Staff Picks, you would add the new name to Header Text.

If you would like a Bullet Image, you would either drag and drop an image into the box or select the location of the image in the drop down.

If you would like a graphic instead of text for the header, you would add the graphic in Header Image.

You can create your own Merge Code by enabling the widget check box. By creating a Merge Code of this widget, can be placed inside an HTML widget to display the Product Display in a custom location.

How do I add products to Featured Items or Spotlight Items?

The product flags for Featured and Spotlight Items are generated from the product editor.

You can navigate to your catalog > product and open the Edit icon. On the Product Edit General tab, there are 2 boxes on Product Flags, Spotlight and Featured Item. Check the box for the items you would like to show in the Product Display.