Multi Products

Multi products is the main storefront tool: blocks with products on the home page and other pages. Instead of separate "New", "Bestsellers" and "Specials" modules, you choose a block design, fill it with product collections (from categories, hand-picked, bestsellers, new arrivals, specials or recently viewed) and, if the design provides for it, add banners.

Open Extensions → Extensions → Modules, find "Octemplates - Multi products" and add a new module (or edit an existing one). The editor consists of several steps that depend on the chosen design: unnecessary steps hide automatically.

General

At the top of the editor are the system name of the module (only you see it, it is how the module is called in the modules list and layouts) and the status. The "Create a copy" button makes a disabled copy of the module and opens it for editing: handy for making a similar block for another page.

Step 1. Block design

Choose how the block looks on the page. Under the choice a short instruction shows what to set up for this particular design. There are 8 designs:

Design	What it is	Collections
Grid	One collection, up to 5 products per row and a "Show more" button.	1
Tabs	Several collections in tabs: "Recommended", "Bestsellers", "New"… Up to 6 tabs.	up to 6
Carousel	One row of products, side scrolling and arrows, like the brands block.	1
Large + 6 small	The first product as a large card, 6 more as thumbnails, a "View all" button. The number of products is fixed — 7.	1
3 columns	Three collections side by side, 6 thumbnails each, for example "Viewed", "Bestsellers", "New". Empty columns are hidden.	3
Showcase with banners	A dark banner on the left, "large + 6 small" in the centre, 2 banners on the right.	1 + 3 banners
Two collections + tiles	Two "large + 6 small" collections at the sides and 2 banner tiles in the centre.	2 + 2 tiles
Promo with slider	Banner slides on the left and a product carousel with arrows on the right.	1 + slides

Step 2. Product collections

A collection is a set of products from one source. How many collections are needed is shown by the badge next to the step heading ("This design shows collections: 1"). Extra collections that the design doesn't use are struck through and will be ignored.

• Title — the block heading or tab label; separate for each language.
• "View all" link — where the button in the block heading leads; separate for each language.
• Product source — where products come from:
  • Products from categories — from the selected categories and their subcategories;
  • Hand-picked products — only those you add;
  • Bestsellers — the best-selling across all orders, can be limited by categories;
  • New arrivals — the most recently added products, can be limited by categories;
  • Specials — products with an active special price, can be limited by categories;
  • Recently viewed by the customer — what the visitor has already opened. If they haven't viewed anything yet, the collection is hidden.
• Show products from categories — category selection with a search and "Select all" / "Remove selection" buttons. For the "Products from categories" source pick at least one.
• Sort — by what and in which order: by name, price, model, quantity, rating, views, sort order or date; ascending or descending.
• Products limit in the module — how many products to show. For designs with a fixed number (for example "Large + 6 small") the value is set by the design.
• Display only special products — keeps only discounted products in the collection.

The "Add collection" button adds another one, "Remove" deletes the current one.

For the "Tabs" design each collection becomes a tab: the collection title is the tab label. To the left of the tabs you can specify a block heading (optional).

Step 3. Banners

This step appears only for designs with banners: "Showcase with banners", "Two collections + tiles" and "Promo with slider". The place of each banner is highlighted on the diagram to the left of its name.

• In "Showcase with banners" fill in 3 banners: a large one on the left and two on the right (top and bottom). The "Dark" colour suits the left one best.
• In "Two collections + tiles" fill in 2 tiles in the centre (top and bottom). A tile shows the image, title and description.
• In "Promo with slider" add one or more banner slides on the left with the "Add slide" button. Dots switch between slides.

Banner fields:

Field	Description
Colour	The banner style: "Light", "Dark" or "Accent".
Image	The banner picture.
Eyebrow	A small line above the title, for example "Samsung Galaxy".
Title and Description	The main banner text.
"From" price	For example 52 999 ₴. The word "from" is added automatically.
Button text and Link	The button label and the page the banner leads to.

Display

• Image width and Image height — the product photo size in pixels (required).
• Enable "Main characteristics" — a short list of attributes in the product card; Limit of attributes — how many attributes to show.
• Display items with 0 quantity — whether to show products that are out of stock.

Additional switches ("Show more" button, quantity selection, infinite scrolling) appear depending on the design: for example, "Show more" works in the "Grid" design.

Where to show

In the "Where to show" block you can limit the module to categories. Leave the list empty to show the block everywhere it is added to a layout. If you tick categories, the block appears only on pages of those categories.

Add the module to a layout

After saving, go to Design → Layouts, open the layout you need (for example "Home", "Category" or "Product") and add the module to the position you want. Blocks follow each other on the page in the order they stand in the layout. Without this step the block will not appear on the site.