The Web Designer extension enables you to customize the appearance of contents by using alternative templates and to manage the online store's files by using an FTP connection.

Contents

Read also the general instructions for installing and deploying extensions.

Extensions are not available in MyCashflow Free plan.

Pricing

Using the extension is free of charge.

1) Template selector

After you've enabled the Web Designer extension, you will see the Template section in certain admin panel forms. In the section, you will be able to select an alternative template for the edited content.

Templates are HTML files included in your online store's theme that define the design and content of different pages. For example, you can use custom templates to define separate layouts for different product categories, as well as to change the product listings that should be displayed on their pages.

With the extension enabled, the template selector becomes available in the forms of the following types of content:

  • products
  • product categories
  • brands
  • content pages
  • news
  • campaigns

Creating and enabling custom templates

To create a new custom template for the desired type of content (e.g. products):

  1. When necessary, create a new template folder for the desired type of content:

    All templates intended for a particular type of content (e.g. products or product categories) must be located in the same folder.

    In this example, we create a /themes/shop/THEME/product folder for templates that can be used on product pages.

    You can find template folders in the enabled theme's folder (e.g. /files/themes/shop/THEME or /files/THEME)

    Learn also how to use the file browser and how to locate all custom templates in a theme.

  2. Create a new custom template file with the .html extension in the folder:

    E.g. alternative-product-template.html

  3. Type the file's contents in the file browser's editor or any of your own tools.

    To add your online store's contents to the file, use Interface tags and the dictionary.

    To create an entirely new template, you must be familiar with the HTML and CSS languages, so that the new template matches the rest of your online store's design.

    When necessary, contact the designer of your theme or our customer service.

    You can use the relevant template from your own theme as the basis for the new template. You can find, for example, the basic template for product pages in the theme file product.html

    For more information on how to create templates, see our Designer's Guide.

  4. Save the file.
  5. Open the desired content for editing.

    At the bottom of the form, in the Template file menu, you'll see the newly created template.

    New custom templates may be displayed with delay in the template menu due to cache.

  6. Select the desired template and save the form.

The locations of custom templates

Additional templates must be added to correctly named folders in the theme's root directory to become visible in content setting forms. The names of content folders are as follows:
  • Products: themes/shop/THEME/product/
  • Product categories: themes/shop/THEME/category/
  • Brands: themes/shop/THEME/brand/
  • Campaigns: themes/shop/THEME/campaign
  • Content pages: themes/shop/THEME/infopage
  • News: themes/shop/THEME/news