- Docs
- Home page & design
- Slideshow +
Slideshow +
How to set up Slideshow + in the Trust theme for OpenCart 3: slide sets, "Text + image" and "Ready-made banner" styles, mini banners, sizes, adding the module to a layout.
Slideshow + is the main banner of the first screen: a large slider with up to two mini banners next to it and a column of catalogue categories. Slides come in two styles: with their own text, price and button, or a ready-made banner filling the whole slide.

The setup has two parts: a slide set (what to show) and a module (how and where to show it).
Slide set
Open Octemplates → Banners → SlideShow +. This is where slide and mini banner sets are stored. One set can be shown in several modules.

Click "Add" to create a set, or the pencil to edit an existing one.
General
- Slide name (set name) — only you see it: it is used to pick the set in the module settings. 3 to 64 characters.
- Status — a disabled set isn't shown on the site even if the module is enabled.
- Slide style — applies to all slides in the set (mini banners are not affected):
- "Text + image" — title, description, price and button on a coloured background, with a product image on the right. Colours are set per slide.
- "Ready-made banner" — a full-slide image with no text on top. Needs two versions: for desktop and for phones.
"Text + image" slides
On the "Slides" tab, on the left is the slide list with thumbnails, on the right the editor of the selected slide. The "Add slide" button creates a new one.

Slide content
Content is filled in separately for each language — switch languages with the tabs above the fields.
| Field | Description |
|---|---|
| Title | The large slide heading, 2 to 64 characters. Required. |
| Description | One or two lines under the title. HTML is allowed. |
| Price | Two fields: a prefix (for example "from") and the price itself. The large price sits next to the button. Leave empty if no price is needed. |
| Button text | In this style only the button is clickable: without its text the slide leads nowhere. |
| Link | Where the button leads: a product, category or promotion page. |
| Product image | Shown to the right of the text. PNG or WebP with a transparent background works best. A slide without an image is not shown. |
Colours
Match the colours to the image so the text stays readable:
- Slide background, Title and price, Description text;
- Button — background and text in the normal and hover states. Custom button colours work only when both background and text are set (separately for each state). Otherwise the theme's standard button is shown.
At the bottom of the editor are the sort order (lower number comes first) and the "Remove slide" button. Removal takes effect after saving.
"Ready-made banner" slides
In this style a slide consists only of a link and two images: "Desktop" (768 px and wider) and "Image for mobiles" (up to 767 px, a portrait or square image works best). A click anywhere on the banner follows the link.

Important. In the "Ready-made banner" style both images are required for every slide and every language. Otherwise the set will not be saved. If a language has no image, the slide is not shown in that language.
The size of ready-made banners is set in the module settings (see below).
Mini banners
The "Mini banners" tab holds small banners next to the slider. The Trust theme shows the first two by sort order, the rest are not displayed. Without mini banners the slider takes the full width. They are optional.

- Title, Subtitle and Price (with a prefix) — separate for each language;
- Link — the whole mini banner is clickable;
- Image — a square picture, 200×200 px on the site. A mini banner without an image is not shown;
- Background color and Text color — for all the banner text.
The module on the site
For a set to appear on the site, it has to be connected through a module. Open Extensions → Extensions → Modules, find "Octemplates - Slideshow +" and add a new module (or edit an existing one).

General
- Module name — only you see it, it is how the module is called in the modules list and layouts.
- Slide set — pick the set created above. Next to it is a "Manage slideshows" link.
- Status — a disabled module isn't shown on the site.
Image size
- Width × height — in the "Text + image" style the product image is scaled to this size. For ready-made banners everything depends on the setting below. The same size is used for preloading.
- Ready-made banner size — only for "Ready-made banner" slides:
- "Module size" — the banner is cropped to the width and height above; all slides are the same size;
- "Original size" — the banner is shown at the size of the uploaded file. Handy if banners are already made for the layout.
Behaviour
| Option | What it does |
|---|---|
| Autoplay | Slides switch on their own. |
| Arrows | "Back" and "forward" buttons. |
| Counter and progress | The slide number ("01 — 05") and a progress bar. |
| Catalogue menu alongside | A column with catalogue categories is shown to the left of the slider. For the module at the top of the home page. |
| Preload | The browser loads the first slide ahead of the rest. Enable it only for the first-screen slider: the page then appears faster. |
Add the module to a layout
After saving, go to Design → Layouts → Home and add the created module to the position you want. Without this step the slider will not appear on the site.
Tip. For the first-screen slider on the home page enable "Catalogue menu alongside" and "Preload": the page looks complete and displays faster.