Axle: Auto Parts Theme for OpenCart

Overview

Axle is a classic, conversion-first storefront theme for auto parts and accessories stores on OpenCart 4.x and 3.0.x by Kavio Labs. It is built for shops where the first question is "does it fit my car?": shoppers choose a vehicle once, see fitment on every part and can search by part number, OE number or tyre size.

What you get

• Garage finder. A band under the home hero and a My garage button in the header let shoppers pick make, model, year and engine from your own vehicle list. The vehicle is remembered in the browser and shown in the header. Two more tabs search by part or OE number and by tyre size.
• Fitment on every card. With a vehicle saved, each product card says Fits your Lumo 1.2 Petrol, May not fit your Lumo 1.2 Petrol or Universal fit. Without a vehicle it offers Check fit.
• Vehicle bar on categories. Parts for your Corvan Lumo 1.2 Petrol with one click to Show parts that fit (the category filtered to that vehicle) and back to all parts. System tiles and menu links open already filtered.
• Fit check on the product page. A green or amber verdict under the title, a Fitment tab with the table of vehicles (your vehicle highlighted), OE and cross-reference numbers as chips and the part number.
• Plate cards on steel wells. Part number in monospace, brand line, rating, price with saving tag, price per litre or gram, offer countdown, wish list heart and badges (sale %, New, OE quality, Kit, Low stock, Sold out).
• Home sections. Campaign hero with a countdown and brand deal tiles, garage finder, Shop by system image tiles, trust row, tabs (new in, best sellers, deals), Popular jobs tiles, a deals band with real countdowns, a quick fixes row under a price you choose, a Complete the job builder with one Add to cart, brand tiles, garage guide cards and reviews. Each can be switched off.
• Product page. Gallery with hover zoom, option chips (side, finish, length), delivery panel (delivery dates, fitment guarantee, returns), tabs for details, fitment, fitting tips, in the box, specifications and reviews, and Complete the job (frequently bought together).
• Four presets. Redline (cool garage grey, brake-light red), Pitlane (crisp white, navy, square corners), Overland (sand and olive, rounded) and Nightshift (graphite dark edition, amber). All text colours pass WCAG AA contrast.
• Self-hosted fonts. Archivo and IBM Plex Mono (SIL Open Font License 1.1). Axle makes no requests to font CDNs.
• Safe to install. No core file changes and no OCMOD. A licence problem never blocks the store or the admin panel.

On a phone the menu becomes a slide-in drawer, the garage button opens the finder as a sheet and the home page stacks into one column.

Works with

Other extensions keep working: Axle keeps the core ids of the product form and the mini cart. Extensions that add buttons to the product page appear under Add to cart. Parts catalogue extensions that store fitment in the standard product filters work out of the box.

Versions

Licence

One licence covers both packages. The first 14 days are a trial. Without a valid licence the store keeps working and the theme settings page shows a reminder.

Installation

OpenCart 4.x

1. Go to Extensions > Installer and upload kv_theme_axle.ocmod.zip. Click Install (the green + button) next to it.
2. Go to Extensions > Extensions, choose the type Themes, and click Install next to Axle Auto Parts Theme by Kavio Labs.
3. Click Edit, check that Status is on, choose a preset and save.
4. Go to System > Settings, edit your store, and on the General tab set Theme to Axle Auto Parts Theme by Kavio Labs. Save.

OpenCart 4 has no theme folders. Axle is a theme extension: it swaps in its own templates while it is the store theme and switched on. Switch the store back to Default to return to the stock look at any time. The settings page tells you whether Axle is the active theme.

OpenCart 3.0.x

1. Go to Extensions > Installer and upload kv_theme_axle-oc3.ocmod.zip.
2. Go to Extensions > Modifications and click Refresh (the blue button).
3. Go to Extensions > Extensions, choose Themes, click Install next to Axle Auto Parts Theme by Kavio Labs, then Edit, check Status and save.
4. Go to System > Settings, edit your store, open the Option tab and set Template to Axle Auto Parts Theme by Kavio Labs. Save.

On OpenCart 3 the image sizes and the number of products per page for the theme are on the Listing & images tab of the theme settings.

Set up your data

Axle reads your normal catalogue data. Before you start:

1. Vehicles. Add a filter group named "Fits vehicle" (Catalog > Filters). Add one filter per vehicle, named Make · Model · Engine · Years, for example Corvan · Lumo · 1.2 Petrol · 2016-2020 (a middle dot or a | between the parts; engine and years are optional; years can be 2018, 2016-2020 or 2016-present). On each product, open Links > Filters and add every vehicle it fits.
2. Part numbers. The product Model field is shown as the part number on cards and the product page. Put OE and cross-reference numbers in an attribute named "OE numbers" (comma separated) and mention them in the description if you want the search to find them.
3. Universal parts. Add an attribute "Universal fit" with any text (for example "Yes") to parts that fit every vehicle.
4. Brands. Add manufacturers and assign them to products. They fill the brand deal tiles, the brands row and the brand chips on category pages.
5. Notes and tabs. Attributes "Fitment note" (boxed notice under the title), "Fitting tips" and "In the box" (their own tabs), "Delivery time" ("Ships in 1-2 days") and "Label" (badges such as OE quality, Kit).
6. Unit price. An attribute "Volume" with a value such as 1 L, 500 mL or 200 g gives the price per litre, per 100 mL or per gram.
7. Options. Options named Side, Length, Size, Volume or Finish show as chips; options named Colour show as swatches.
8. Tyres. Write the size in the product name ("Gripline tourer all-season tyre 205/55 R16 91V"). The tyre tab of the finder searches for it.
9. Special prices. Give products a special price with an end date to get countdowns and the brand deal tiles with their end dates.
10. Related products. Add two products without required options as related products to get Complete the job.

Update

Upload the new package the same way and refresh modifications on OpenCart 3. Your settings are kept in the store settings.

Uninstall

Switch the store theme back to Default, then uninstall Axle from Extensions > Extensions > Themes.

Configuration

Open Extensions > Extensions > Themes > Axle > Edit. Every storefront text you can change is on one of these tabs. A section that is switched off or has an empty title is not shown.

General

• Status and Preset (Redline, Pitlane, Overland, Nightshift). Text logo is shown beside or instead of the logo image; wrap one word in *stars* to set it in the accent colour (Partwell *Parts*).
• Studio wells put products on a cool steel well; off gives a plain white well. Hover zoom and Delivery panel switch product page features.

Garage & fitment

• Vehicle filter group: the name of the filter group from Catalog > Filters that holds your vehicles (default "Fits vehicle"). Name each filter Make · Model · Engine · Years. Empty hides the vehicle tab; the part number and tyre tabs stay.
• Home finder title and text; tyre finder lists (widths, profiles, rim sizes, separated by |). The tyre tab searches the catalogue for the size, for example 205/55 R16.
• Universal fit, OE numbers and Fitment note attribute names.

How the finder works: the vehicle list is embedded in the page and filtered in the browser, so choosing is instant. When make, model, year and engine point to exactly one vehicle, system tiles, menu links and the category vehicle bar open the category filtered to that vehicle (the standard product filter). A partial choice (for example make and model) still drives the fitment badges on cards and the product page.

Header & footer

Three top band messages, the label of the Brands menu item (empty hides the panel), the number of categories in the menu, the label of the Deals pill (links to the Specials page), an optional second link, the search placeholder, the account band, the footer text and help card, and the payment chips (plain text, no logos).

Home page

Campaign hero (label, title, text, button, product id, up to four brand ids), garage finder, shop by system, trust row, tabs, popular jobs, deals band, quick fixes row, job builder, brands row, garage guides and reviews.

• Product id fields take comma lists of product ids, for example 42, 57. Empty fields use an automatic source: the best discounted product for the hero, the brands with the biggest running discounts for the brand tiles, products on special for the deals band, orders then views for best sellers, the newest products under the maximum price for the quick fixes row.
• Link fields take a category id (20 or 20_27), an information page as i:<id> or a URL.
• Shop by system shows your top categories with their image and product count.
• Popular jobs tiles are separated by ;. Brake pads is a search for the words, Brake pads|20_27 or Brake pads|i:5 or Brake pads|https://... link to a category, page or URL. The icon follows the words (brake, oil, filter, battery, wiper, bulb, plug, tyre, shock).
• Reviews need real quotes. Write only real figures.

Product data

• Fitting tips and In the box attributes become their own tabs.
• Colour option names and Chip option names: options with these names get round colour swatches or chips. Swatch colour comes from the option value image, otherwise from the value name.
• Range and Colour attributes: sell each colour or finish as its own product and give them the same Range value to show swatches on cards.
• Volume attribute: a value like 1 L, 500 mL or 200 g produces the unit price on cards and the product page.
• Delivery time attribute, Label attribute (for example OE quality, Kit), New tag days, Low stock tag, the in-stock line, the fitment guarantee and returns lines, the wish list note, and Complete the job (frequently bought together).

Listing & images (OpenCart 3 only)

Products per page and the image sizes. On OpenCart 4 these are in System > Settings > Image. Axle shows products on square wells: 520 x 520 on cards and 800 x 800 on the product page work well.

Licence

Paste the licence key from your Kavio Labs account. Without a key the theme keeps working and the page shows a notice.

FAQ

Does Axle change core files or use OCMOD?

No. On OpenCart 4 it is a theme extension that uses events; on OpenCart 3 it is a normal theme directory plus events.

Where do my vehicles come from?

From a filter group (default name "Fits vehicle"). Each filter is a vehicle named Make · Model · Engine · Years, and each product carries the filters of the vehicles it fits. Nothing else is stored; Axle never writes to your database.

Why is the vehicle tab missing?

The filter group named on the Garage & fitment tab does not exist or has no filters. The part number and tyre tabs are still shown.

Why does "Show parts that fit" not appear?

It needs a unique vehicle: choose make, model, year and engine so that exactly one vehicle matches. With a partial choice the fitment badges work, but the filter link is hidden because OpenCart combines several filters with AND.

Why does a card show "Check fit" or nothing?

"Check fit" means the product lists vehicles and no vehicle is saved. Products with no vehicles and no "Universal fit" attribute show nothing.

Does the part number search find OE numbers?

The part tab searches names, models and descriptions. Put OE and cross-reference numbers in the description and the search finds them.

Why is the tyre search empty?

The tyre tab searches for a size such as 205/55 R16. Write the size that way in the product name.

Why do my cards show no colour swatches?

Swatches come from an option named in Colour option names, or from sibling products with the same Range attribute. Most auto parts do not need them.

Why do the brand deal tiles show "6 products" instead of a discount?

A brand shows "Up to N% off" while one of its products has a running special price. Otherwise the tile shows the product count.

Why does a card show no countdown?

The countdown needs a special price with an end date less than 60 days away.

How is the unit price calculated?

The price (with tax as your store shows it) divided by the number in the Volume attribute ("1 L"). It is a display line only.

Is the saved vehicle sent to the server?

No. It is stored in the visitor's browser (local storage) and only used to filter links and show badges.

Can I use it with a multi-store setup?

Yes. Settings are stored per store.

What if the licence is missing or expired?

The storefront and the admin panel keep working. The theme settings page shows a reminder.

Does it make external requests?

Only the licence check from the admin settings page. Fonts are served from your store.

How do I go back to the stock look?

Set the store theme to Default.