Help

Tutorial

How to customize your category pages using the Store Designer

With the Auctiva Commerce Store Designer you can customize your category pages to create unique landing pages on per category basis. You can also create reusable templates for each category level and apply them to individual categories as desired. This tutorial will explain how to customize your category pages using the Store Designer. For the category pages a template is a page that can be applied to multiple individual categories - for example you may want to create a Level 1 template that you use for your Level 1 categories, and a different Level 2 template that you use for your Level 2 categories. By using templates you can create different looks for each of your category levels without having to fully customize each individual category page. However you can create completely custom pages on a per category basis if desired.

How to customize your category pages using the Store Designer - editing the default Category Grid page.

In the Store Designer select the Category Grid page from the page drop-down on the Edit Layout tab. This will load the default Category Grid page display. This page is a template that by default all your category pages will use. A secondary "Select page" menu will also load - you can use this control to select the type of edit you want to make - you may edit a category page template or an individual category page. We will first go over the process of editing the base Category Grid page display.

  • Once the Category Grid page loads edit the widgets on the page or add new ones as desired by dragging them onto the page. Note that all widget content is shared by all category pages referring to this template. If changes are made to the properties of shared widgets those changes will be reflected everywhere on your store that those widgets are presented. However, the HTML Widget and JavaScript Widgets may be customized on a per category page basis by editing the proper widget on each category page. Changes to the widgets, layout and widget content are automatically saved as they are made. Once you have completed your edits to the Category Grid page you may select an appropriate category page and then Preview the changes prior to publishing them live.

How to customize your category pages using the Store Designer - Creating a New Category Template.

In the Store Designer select the Category Grid page from the page drop-down on the Edit Layout tab. This will load the default Category Grid page display. The 'New Template' button will appear as well. Click on the 'New Template' button to create a new category page template.

  • A new category page template window will open - select the category page template level you are creating and click 'Create'; this will create a new category page template that you can then edit. By default it takes on the same properties and layout as the original Category Grid page.
  • Add, edit or remove widgets from the new category page template as desired. Changes to the widgets, layout and widget content are automatically saved as they are made.
  • The new category page template will now be available as a page that you can assign individual category pages to.
  • You may repeat the above process for additional category page templates as desired.

How to customize your category pages using the Store Designer - Editing a specific Category page.

In the Store Designer select the Category Grid page from the page drop-down on the Edit Layout tab. This will load the default Category Grid page display. From the secondary Select page drop-down select the Top Level of the category you want to edit. If there are subcategories to the selected category another drop-down will appear where you can select the next sub-category level. You may drill down in this fashion until you reach the actual category page you want to edit. For reference the title of the page being edited will be shown at the top of the Store Designer main panel edit pane. The level number will also be displayed in the corresponding drop-down control.

    Editing page template - By default, the category page is assigned to the 'Current Level' template. If you want to assign an individual category page to a template select the page template you want to assign the category to via the page template drop-down in the upper right area of the edit pane. You may select from the default Category Grid, any template levels you have previously created (ie: Level 1), Current level, or Custom page.

    • Category Grid: This is the base template. This template may not be deleted.
    • Level template: These templates are used for each category 'level' in the category tree.
    • Custom template: This is a custom template that can be named and customized any way you like
    • Current level: This is the default option for all category pages. This automatically tries to find a level template that matches the level of the category page. If a level template has not been created for this level, the Category Grid template will be used. Moving category pages around in the category tree will remap to whichever template page is appropriate.
    • Custom page: This is a totally custom page that you may add, edit and delete widget from. Any changes here will only be made to the current page.
    Editing page - Depending on the Template type selected, you may edit the following:

    • Template page: The page will reflect the widgets on the specified template. The only properties that may be edited are the HTML widget and the Javascript widget, with the default properties coming from the template. This allows you to create a template for each level of your category landing pages if desired but change out the individual images or textual content for each page
    • Custom page: The entire page is editable. You may add, edit and delete any of the widgets on this page.

Important Notes

  • Changes are saved automatically as they are made.
  • Changes can be Previewed prior to publishing them live - it is recommended that you Preview your changes prior to publication. Note that previewing templates may only be done by selecting a matching category page and previewing it.
  • If you do not assign an individual category to a specific template it will use the current category level template by default. If a current level template does not exist then the Category Grid template will be used instead.
  • The top level categories in Auctiva Commerce stores are defined as Level 1 categories. For example if your store has the following category tree structure, for purposes of the Store Designer the Levels would be as noted:
  • Tools and Accessories (Level 1)
  • Bikes (Level 1)
    • Road Bikes (Level 2)
    • Mountain Bikes (Level 2)
      • Front Suspension (Level 3)
      • Full Suspension (Level 3)
  • Bicycle Clothing (Level 1)

Updating your category display pages is not required. If you do not update your pages your category pages will continue to use the base Category Grid display.

This completes the task of editing your category pages using the Auctiva Commerce Store Designer. Customizing your store and its category pages can be a daunting task. There's a lot of ground to cover and depending on what kind of edits you desire you may have a lot of customizing to do. But, don't worry, are many more tutorials on the Help Section that you can use to make the process much easier. Also take a look at our community forums to network with other sellers and see how they're creating great stores.

Tags

◄ Back to Help

Customer Support

If you have been unable to find the answer you were looking for using our Help documentation, please file a customer support request. We have customer support professionals ready to help you 24 hours a day, Monday - Friday (excluding major holidays.)