General settings

This page covers the general storefront settings: font, site width, light and dark theme, colors, phone masks and speed optimization.

Open Octemplates → Trust OCTemplates - template settings in the left admin menu (or Extensions → Extensions → Themes → Trust OCTemplates → Edit). You need the “Settings” → “General” tab. It contains three more tabs: “Settings”, “Optimization” and “Color settings”.

Storefront look

Setting	What it does
Status	Enables the template. A disabled template doesn’t work on the storefront.
Font	Font for the whole site, 10 options: Onest + Geologica, Golos Text, Manrope, Montserrat, Rubik, Nunito Sans, Commissioner, Inter, Exo 2, Geologica. Only the selected one is loaded.
Container width	Maximum content width on screens from 1400px: 1320, 1680 or full width.
Corner radius	How rounded the corners of buttons, cards and fields are: 0, small, medium, large.
Card style	How product cards and blocks stand out: shadow, border or no border.
Light stand under product photos	Product photos sit on a soft light stand, and the white background of the photo blends into it. Off — photos without a background, full width of the block.
Dim the page while loading	While adding to cart, wishlist or compare and opening popups, the page is dimmed and a loader is shown. Off — only the loader.
Customization panel for visitors	A “Settings” button on the storefront where visitors can change the header, footer, font, colors, theme, width, radius and card style. The choice is saved only in their browser. Useful for a demo site — turn it off on a live store.

Light and dark theme

Setting	What it does
Enable dark theme?	Shows a light/dark theme switch in the header. The visitor’s choice is remembered across pages.
Default theme	The theme a new visitor sees: light, dark or “Auto” — following their device settings.

Buttons and behavior

Setting	What it does
Enable OpenGraph?	Adds og:title, og:description and og:image tags for rich link previews in Facebook, Telegram and Viber.
Dim products that are out of stock	Product cards with zero stock are shown dimmed.
Display “Compare” and “Wishlist”	Show or hide these features on the storefront.
Popup options when adding to cart	If a product has required options, the shopper picks them in a popup without going to the product page.
Button interactivity	After adding to cart, wishlist or compare, the button changes its look so the shopper sees the action worked.
Increase quantity in multiples of the minimum	If a product has a minimum quantity (for example, 6), the “+” and “−” buttons change the quantity by 6. Works on the product page, in the popup cart, quick view and checkout.

Phone masks

A mask shows the shopper the number format and prevents extra characters in the template forms.

1. Add a mask

   In the “Phone masks by country” block click “Add example for Ukraine” — or add a row manually.

2. Fill in the fields

   • Country Code (ISO 2) — two letters: ua, pl, us.
   • Phone Mask — 9 stands for a digit, other characters are formatting. For example: +38 (099) 999-99-99.
   • Regex validation — optional, for additional number validation.

3. Select the default country

   Mark it in the “Default” column and save.

   

Bought together

The “Bought together” block on the product page shows products most often bought with it. Links between products are calculated from orders once a day.

1. Enable it and set a password

   Turn on “Bought together”, come up with a password in the “Enter CRON password” field and save the settings.

2. Add a CRON job

   After saving, the “Your link for the CRON task” field appears with a ready-made command. Copy it and add it as a CRON job on your hosting to run once a day. The command looks like this:

   /usr/bin/wget -O - -q -t 1 'https://your-site/index.php?route=octemplates/events/helper/octMassGenerateBoughtTogether&cron_pass=PASSWORD'

3. First run

   To avoid waiting a day, click “Generate” — the links are calculated right away.

   

Admin appearance

How OCTemplates module pages look in the admin. Applies to all stores.

• Module colours — Trust (brand teal) or Classic (OpenCart blue).
• Admin theme — light, dark or Auto following the system theme.

Optimization

The “Optimization” tab affects page loading speed. After changes, click “Clear template cache” at the top of the page.

Setting	What it does
Enable optimization CSS & JS	Combines and compresses theme styles and scripts — fewer requests and faster loading.
Enable WebP	Images are served as WebP to browsers that support it. Requires WebP support in PHP GD on the server.
Moving scripts to the footer	Scripts load at the end of the page and don’t block rendering.
Preload for images	The browser loads key images (logo, product photo, article cover) first — this improves LCP in PageSpeed.

Colors

Color scheme

On the “Color settings” tab choose a ready-made site palette. Each scheme sets the primary color, accent, backgrounds, text and footer color. There are 15 schemes: Trust, Neutral, Dark, Blue tech, Green eco, Warm, Black & gold, Fashion, Pastel, Ocean, Burgundy, Sunny, Sport, Mint, Indigo.

Schemes marked “Always dark” (Dark, Black & gold) make the site dark regardless of the theme settings.

Custom colors

If a ready-made scheme almost fits, turn on “Change scheme colors” and set only the colors you want to change. An empty field means the scheme color is used (shown on the right).

• Primary color
• Accent color
• Page background
• Cards and header background
• Text
• Footer background
• Sale price

Colors are set separately for the light and dark theme. Hover shades, button backgrounds and text on buttons are calculated automatically.