HostOnNet Blog

A complete guide to creating custom theme for OpenCart 3.x

In this tutorial I am going to create an OpenCart 3 custom theme named honcart.

STEP 1

Create a copy of theme folder at /catalog/view/theme/default and rename it to honcart

opencart theme developement

STEP 2

Make a copy of the following files

/admin/language/en-gb/extension/theme/default.php  
/admin/view/template/extension/theme/default.twig
/admin/controller/extension/theme/default.php

and then rename it to following

/admin/language/en-gb/extension/theme/honcart.php
/admin/view/template/extension/theme/honcart.twig
/admin/controller/extension/theme/honcart.php

opencart theme developement

STEP 3

Edit /admin/language/en-gb/extension/theme/honcart.php

Find

$_['heading_title']                    = 'Default Store Theme';

Replace

$_['heading_title']                    = 'Hon Cart Theme';

STEP 4

Open /admin/view/template/extension/theme/honcart.twig

Find

theme_default 

Replace

theme_honcart
opencart theme developement

STEP 5

Edit /admin/controller/extension/theme/honcart.php

Find

default

Replace

honcart
opencart theme developement

STEP 6

Change css link in header.twig file at /catalog/view/theme/honcart/template/common/

to

<link href="catalog/view/theme/honcart/stylesheet/stylesheet.css" rel="stylesheet">

STEP 7

Got to admin area > Extensions > Extensions > Choose the extension type > themes > install the theme

opencart theme developement

Then click the edit button and enable the theme > Status > Enable

opencart theme developement

STEP 8

Got to admin area > System > Settings > Edit store > Theme > Select Hon Cart theme > Save

opencart theme developement

About Sibi Antony

Bootstrap and Android LOVER. I've been creating things for the web for over 10 years, from the period of flash and table based layout web sites till mobile and tab friendly web sites.
Posted in OpenCart