1. Start
  2. Manual Installation
  3. Setup The Template
  4. Layout
  5. Modules
  6. TG HoDeCo MegaMenu
  7. TG HoDeCo Revolution Slider
  8. TG HoDeCo Filter Product
  9. HTML Content
  10. News/Blog

HoDeCo - The Responsive Furniture OpenCart Template


Manual Installation


Before installing the HoDeCo theme, it is assumed that you have a working OpenCart installation.

We recommend to use this theme on a clean installation or existing shops without custom modifications.

IMPORTANT! Although HoDeCo doesn't overwrite any core files is a good practice to backup your files and sql database before making any upgrades or changes.


1Install VQMOD

This template requires VQMOD.

If you already have VQMOD skip this step. Otherwise, get the latest release here Download VQMOD.

Follow the instructions how to install VQMOD on OpenCart.

2Upload theme files

Unzip the "tg_hodeco_x.x.x.x_version_x.x.zip " you have downloaded from ThemeGlobal.com to a local folder on your computer. Enter the tg_hodeco_x.x.x.x_version_x.x folder.

Select the folder that matches to your OpenCart version and upload all the files from "OpenCart x.x.x.x" to the directory you have installed OpenCart in.

Setup The Template


The instruction how to configures the template to look like the DEMO SITE

We recommend to use this theme on a clean installation or existing shops without custom modifications.

IMPORTANT! Although HoDeCo doesn't overwrite any core files is a good practice to backup your files and sql database before making any upgrades or changes.


1Enable TG HODECO SETTINGS

Go to Admin > Extensions > Modules

Find a module name TG HODECO SETTINGS click on Install.

2 IMPORTANT! Install Template System Files

After installing the TG HODECO SETTINGS go to front page of your store or to this link http://yourdomain.com/themeinstall/index.php

You should see the message: "TEMPLATE HAS BEEN INSTALLED ON YOUR SYSTEM!" Otherwise please contact our support staff to get help.

3Activate default Skin and Install Sample Data

Go to Admin > Extensions > Modules > TG HODECO SETTINGS > Edit

You should see the image presented below:

Image Setting

From the list choose the skin hodeco_default and press the button Active skin.

After activating the skin you should see the image presented below:

Image Setting

Go to Install Data tab and Press install button for the module you want with the sample data or click install for All TG HoDeCo Modules to install all modules at once. After that click Save Button.

 

Congratulations! Installation is complete. Go back to your main store front to view the template installed on your site.

Layout

Image Setting

Modules

Image Setting

 

M1Logo Image

You can change the image from Admin > System > Settings > Edit your Store > tab Image > Click on Store Logo image > Upload your logo > Save

M2Custom Text

You can change the text from Admin > Extensions > Modules > TG HODECO SETTINGS > Edit > tab Custom Header > Insert text for each block: > Save

M3TG HoDeCo MegaMenu

This module allows you to manage your own header menu instead of the default menu very easily without coding knowlege required. When this module is disabled the Default Menu will show.

Here is the example how to create the category KITCHEN like in our demo site.

Image Setting

1. Go to Admin > Extensions > Modules > TG HoDeCo MegaMenu > Edit > Create new item

Item setting

Content item

This fields are only for Subcategories.

2. Creating a parent category Kitchen. Add informations as below and click save.

  • Name - Kitchen
  • Link - index.php?route=product/category&path=20
  • Status - enabled
  • Position - Left
  • Submenu width - 892px
  • Display submenu on - Hover

3. Creating a submenu Kitchen Submenu1 (Find your dream kitchen) . Add informations as below and click save.

  • Name - Kitchen Submenu1
  • Status - enabled
  • Position - Left
  • Submenu width - 100%
  • Display submenu on - Hover
  • Content width - 8/12
  • Content type - HTML

    You can also add Products or Categories. In this case we go with HTML.

  • Change the HTML filed to code view mode and add the information below:

    HTML -

4. Doing the same for submenu Kitchen Submenu2 (Kitchen Faucets), only with Content width - 2/12. Add informations as below and click save.

HTML -

5. Doing the same for submenu Kitchen Submenu3 (Kitchen Sinks) . Add informations as below and click save.

HTML -

6. Drag each submenu below the parent category like in the image below:

M4TG HoDeCo Revolution Slider

TG HoDeCo Revolution Slider is an all-purpose slide displaying solution that allows for showing almost any kind of content with highly customizable, transitions, effects and custom animations.

HOW TO SET SLIDERS:

1. Go to Admin > Extensions > Modules > TG HoDeCo Revolution Slider > Edit > tab Existing Modules > Create new slider

2. In general options set:

Recommended size for the slider is 1300(w) and 520(h).

3. Than click on plus icon to add slide.

4. Upload your image, set status to enabled, select transition effect and add your link.

You should see the image presented below:

Add as many sliders as you want.

ELEMENTS SETTINGS:

For each Slider you can add a sub text or image elements.

MODULE PLACEMENT:

After setting up Slider you need to add it in module placement.

1. Go to Admin > Extensions > Modules > TG HoDeCo Revolution Slider > Edit > tab Module placement > Add item

Adjust the settings with the following values and click Save.

M7 M11TG HoDeCo Filter Product

Allows you to create your own custom product sections and name them whatever you want. You can add any number of products to any of them and place unlimited modules with different sets of products on different pages.

HOW TO ADD:

1.Go to Admin > Extensions > Modules > TG HoDeCo Filter Product > Install or Edit > Add Module

MODULE TAB

2. Now you can add item as tab. For example in the demo site we added 3 items: Bestseller, User Choice and News Arrival. For each item you can choose where do you want to get product from: Latest Products, Special Products, Bestsellers Products, Manually choose any products or category with autocomplete suggestion

MODULE SETTING

M6 M7 M8 M9 M10 M12HTML Content

HTML Content is used to add any content (HTML) at any place on the webpage.

HOW TO ADD:

M6This is the example how to add the HTML Content Middle Left. Recommended size for the banner is 600(w) and 547(h).

Go to Admin > Extensions > Modules > HTML Content > Install or Edit

Adjust the settings with the following values and click Save.

Module Name - Middle Left Banner.

Description -

Status - Enabled

M7 For HTML Content Middle Right. Recommended size for the banner is 600(w) and 260(h).

Module Name - Middle Right Banner

Description -

Status - Enabled

M8 For HTML Content Middle Bottom Left. Recommended size for the banner is 578(w) and 520(h).

Module Name - Middle Bottom Banner 1

Description -

Status - Enabled

M9 For HTML Content Middle Bottom Right. Recommended size for the banner is 578(w) and 520(h).

Module Name - Middle Bottom Banner 2

Description -

Status - Enabled

M10 For HTML Content Column Right. Recommended size for the banner is 578(w) and 780(h).

Module Name - Column Right Banner

Description -

Status - Enabled

M12 For HTML Content Content Bottom. Recommended size for the banner is 1200(w) and 164(h).

Module Name - Home Bottom Banner

Description -

Status - Enabled

Add HTML MODULES to Home Layout

Go to Admin > System > Design > Layouts > Edit Home

Adjust the settings with the following values and click Save.

M13News/Blog

The news/blog module is not included in the template. If you want to use it on your webpage, you need to purchase the module below. It is just $12 and is one of the best blog module on the market.

http://shopencart.com/opencart-2.x-modules/news-blog-opencart-1.5

You don't have to modify the module to fit the template. Just follow the installation instruction included in the module and your blog will look exactly the same as in demo version.

M16Custom Footer Block

You can change the content from Admin > Extensions > Modules > TG HODECO SETTINGS > Edit > tab Custom Footer > Add information for Custom Footer 1 Block or Custom Footer 2 Block > Save

M18Social Media

You can change the content from Admin > Extensions > Modules > TG HODECO SETTINGS > Edit > tab Social Media > Add information and set status to ON > Save

M19Payment

You can change the content from Admin > Extensions > Modules > TG HODECO SETTINGS > Edit > tab Payment > Add item > Upload your payment image > Save