Introduction

Congratulations on your purchase of an OpenCart template! This documentation consists of several parts and describes the installation, configuration and setting up an OpenCart website process.

We did our best to make this manual information to be presented in a simple way. As an effective reference, the documentation below will provides all information you need, it has been restructured in different chapters, you can see in the left-side menu. You are able to navigate to any part of the documentation using the active content headers' links.

We recommend that you should start reading the documentation at the first section.

Support

What is OpenCart?

OpenCart — is an Open Source e-commerce application. OpenCart provides easy customization of your online store. OpenCart community includes a number of users starting from the experienced web developers looking for the user-friendly interface, ending with shopkeepers that start their online business for the first time. OpenCart provides a great amount of features that allow you to control your store. Using OpenCart tools you can easily uncover the store potential.

Document Opencart What`s new in Opencart 3

Note

Usually there is a vast of different settings that available with a new Template, and because this is an open source software, it isn't always the same for each developer. Make sure to read through this documentation available for the Template that you are installing so that you know what features are available for you.

System Requirements

System Requirements for Opencart:

Click here

FAQs Videos

In this article, we will guide you some instructions and tips in term of configuration on OpenCart Theme.

Click here

How to install OpenCart 3

You read user-guide to install default OpenCart:

Click here

How to install SO Theme for OpenCart 3

Video to view user-guide to install Theme

1. Extensions Installer

Go to Extensions › Installer › Click Upload and select the so3_emarket_template_oc3.0.0_v1.0.0.ocmod.zip file to upload. Then you will see the message Success: You have installed your extension!

Note:

If you get this error: file could not be uploaded, you can do these steps

Make sure your PHP value requirements look like:

			max_execution_time=3000
max_input_vars = 25000
post_max_size=350M
upload_max_filesize=200M
			

Important

Or you can try install the theme via FTP/Cpanel

Please upload the theme package to your root file
Use cpanel account to unzip it
Move all folders into ‘upload’ folder to Root folder
Go to Admin › Extensions › Extensions › filter Modules › Click install Theme control panel module
After that, go to Admin › Extensions › Modifications › click Refresh button
Try go to Admin › Systems › Users › User groups › Edit administrator › click Select All >> Save

2. Extensions Active

Go to Extensions › Extensions › Click Install button

3. Access Permission

Go to System › User › User Group › Click Edit button › Then you click Select All button

4. Rebuild your modification cache

Go to Extensions › Modifications › Click Refresh button to rebuild your modification cache

5. Theme Control Panel

Go to Extensions › Theme Control Panel and edit your store: General Tab, Layout Tab, Page Tab...

Install Language & Override Language

How to install language? (example: turkey)

1. Install Laguage

This time, you will learn how to make your OpenCart 3 store available in multiple languages.

You can read more information: Click here

2.How to manage content, products and categories translations

Note

When you install multi language the default language is arabic, it is not an error. Please You enter your content

Usually, Opencart top menu displays Categories. Navigate to Catalog › Categories, select the category you would like to translate, click the Edit icon and insert translation into corresponding language tab of the category:
Navigate to Catalog -> Products to start products translation. Select the product you would like to translate, click the Edit icon next to it and insert translations into the General tab of a product:
In case you would like to translate one of content pages on the site, open the Catalog -> Information tab, select the page required and insert translations into the corresponding language tab of content editor.
Navigate to Opencartworks -> So Themes Config to start translation, insert translations into the content:

Note

Because there are so many modules, Select the module you would like to translate. Insert translations into the content
Refresh the front-end with the Ctrl/Cmd+F5 hotkeys to check the changes.

3. How to use translate Language in Module

If the module has language files for English and you want to translate them for Spanish, then at the very first copy all the language files from English language directory and paste all of them in Spanish directory in the same structure as it was in English language.

Extract the language archive file which you downloaded into your PC: patch_language_v3.x
We filter out language files of theme and modules:
```
- patch_language_v3.x\admin\language\en-gb
- patch_language_v3.x\catalog\language\en-gb
```
To your language: replace "en-gb" with the name of the language (English, German...).
Upload admin and catalog folders you replaced into your OpenCart folder
Then please go to catalog => language => extension => you make translates language all files below

For example, there is a file in module directory for English language called foo.php then copy this into the module directory of Spanish language.

Suppose Enlish file has these keyword to be translated as below screenshot.
Refresh the front-end with the Ctrl/Cmd+F5 hotkeys to check the changes.

Install Simple Blog

Go to Admin › Simple Blog › articles . Missing Database Tables for this Extension, Click 'Install simple blog'
You must create a new author, new category, new article
Go to Admin › Simple Blog › Setting › General Setting. set values properties for for simple blog. Click Save
To view simple blogs outside you address type index.php?route=extension/simple_blog/article or Admin > Menu Simple blog > General Setting > Simple Blog Seo Keyword Heading (This name will be as seo keyword when simple blog is clicked)
Create page blogs : Design › Layouts › Create new blog layout › set route: extensions/simple_blog/%
add module for content postion (see Layout default)

Install Purpletree Multivendor

Install this theme successfully
Download Multivendor module from Click here.Install/configure it following their guide.
Please configure the multivendor : Go to Admin › Extensions › Module > Click 2 module (Purpletree Multivendor Settings, Purpletree Seller Panel )
Module Purpletree Multivendor Settings

Module Purpletree Seller Panel : config show enable
Go to Admin › Design › Layouts › Account › Column Right : add module Purpletree Seller Panel
Install the file so3_emarket_purpletree_multivendor_v108.ocmod.zip
Go to Admin > Extensions > Modification and click on the Blue Refresh button to apply changes..
Once done, clear the cache. Dashboard > Click gear icon to clear cache
Refresh your store's front page you should see the theme installed successfully.

Slider Revolution Responsive Opencart

Note

Download Slider Revolution Opencart form Click Here and Read Slider Revolution Documentation

Unzip the download package of Slider Revolution. Upload admin, catalog, image & system file in your root directory.(Note: If you are an existing revslider 2.3 user , please rename your system>config>revslider folder)
Navigate Extensions > Extensions , Select Modules on extension type.
Install Revolution Slider OpenCart & Revolution Slider Output This will take some time.please wait untill it finishes installation.
Navigate System > Users > User Groups, then click on Edit button of Administration.
Click on Select All both Access Permission and Modify Permission, then Save these settings.
Navigate Extensions > Modifications, then click on Refresh button.
Refresh the front-end with the Ctrl/Cmd+F5 hotkeys to check the changes.

Show The Slider on Home page

Navigate Extensions > Extensions > Revolution Slider Output : Edit

Set a Module Name and Slider

Navigate Opencartwork > So Page Builder: Home 1

Opencart Custom Product Designer

Note

Download Opencart Custom Product Designer form Click Here and Read Custom Product Designer Documentation

Installed vQmod. (How to install vQmod on Opencart?)
Extract the archive file on your machine that you’ve downloaded from CodeCanyon. We included install packet and document in this file. Please choose folder compatibility with version of Opencart.
Upload the 4 folders found inside (admin, catalog, tshirtecommerce, vqmod)

to your OpenCart root installation and merge them with the existing ones.
Navigate Extensions > Extensions , Select Modules on extension type.find T-Shirt eCommerce Module and click on the green Install button.
Navigate System > Users > User Groups, then click on Edit button of Administration.
Click on Select All both Access Permission and Modify Permission, then Save these settings.
Navigate Extensions > Modifications, then click on Refresh button.
Refresh the front-end with the Ctrl/Cmd+F5 hotkeys to check the changes.

How To Add New Product Design

Click here

Theme Feature

Video to How to add Featured product

Go to admin › OpenCartWorks › So Themes Config › Button Product Feature

Click on product to create features product. Any product added config features will have labels so feature

Main General Tabs

Tab General

Go to OpenCartWorks › So Themes Config › General Tab

1.Select Layout - Choose the layout that you like. Click button Apply Default Setting Choose the Layout

New Color - Set name color (do not uppercase letters) and fill color. Continue Click button Compile CSS.
Select Color - Select the color you just created › Click button Save

2.Sticky Menu on Top - When the user scrolls the page, Sticky Menu to the top of the browser window during scrolling

Status - Option (yes|no)
Select Block on header - Choose your parts you want to show on the sticky Menu

3.Top Bar

Telephone No - is the content of Telephone
Welcome Message - is the content of Welcome Message
Checkout Link - show the link checkout
Language/Currency - show the Language/Currency

View Frontend:

4.General

Preloader - want to show the Preloader
Preloader Animation - Choose the preloader that you like
Status Payment - want to show the Payment
Image (Payment block) - Choose a image path
Copyright - It is the content to Copyright

View Frontend:

Tab Header & Footer

Choose the type of Header that you like, to pair with home page

Tab Banner

Hover over image below to see effect.Choose the banner that you like

Layout Tab

Go to admin › OpenCartWorks › So Themes Config › Layout Tab › With the boxed layout you can choose additional options such as custom background images, patterns and solid colors

Layout Style - Select one in option (Default|Layout fluid|Layout boxed)
Body Background Color - Set background color for Mainbody
Overlay pattern - Set pattern image for Mainbody
Background Image: - Set background image for Mainbody
Background Image display mode - Set background image display mode
Background Image display Attachment - Set background image display attachment

View Frontend: Layout Style = boxed

Page Tab

Product Category

Go to admin › OpenCartWorks › So Themes Config › Page Tab › Product Category

1.Layout Category & Product

Display column position - Select one in option ( Outside content| Inside content)
Display column type - Add page content inside this div if you want the side nav to push page content to the right
Sticky Sidebar - Attach sidebar to the page when the user scrolls such that the element is always visible

2.Category Info

Display subcategory - You want to show the subcategory
Choose subcategory grid number - Quantity is displayed subcategory
Display category info - You want to show description category
Choose Product grid number - Column number display page category

3.Product Item

Show "Discount" - Options (yes/no)
Show countdown - Show countdown of Special Offer product
Show Ratings - Options (yes/no)
Show Orders - show order number of product
Show image gallery - Slider image gallery
Status use placeholder images - Options(yes/no)

4.Group Cart

Show position cart info - select align (Left|Right|Center|Bottom) position group cart
Show "QuickView" Button - Options (yes/no)
Show "Addtocart " Button - Options (yes/no)
Show "Wishlist " Button - Options (yes/no)
Show "Compare " Button - Options (yes/no)

View Frontend: The options on the create Menu features

Product Detail

Go to admin › OpenCartWorks › So Themes Config › Page Tab › Product Category › Product page

1.Options Styles

Option Checkbox and Radio Style - refreshing the default option is more beautiful

2.Product Page

Product gallery - Select one in option ( Gallery Bottom| Gallery Left| Gallery Grid | Gallery list | Gallery Slider)
Enable Product Zoom - Options (yes/no)
Enable Size Chart - add product image size chart
Tabs block - Select one in option(vertical|horizontal)
Enable Button Show More - Add button (show more) on product description, click button (show more) show full description
Show Shipping & Payment - Add new tabs Shipping & Payment

3.Social Share

Show Custom - Options (yes/no)
Custom Content - Write content to Custom

4.Social Share

Show Related - Options (yes/no)
Related product number per row - Column number display related product

View Frontend: The options on the create Menu features

Comming Soon

Go to admin › OpenCartWorks › So Themes Config › Page Tab › Coming Soon

Coming Soon Background - Set background image for Coming Soon
Coming Soon Title - is the heading of Coming Soon
Date - is the dates of coming soon
Content - is the content of coming soon

View Frontend:

Font tab

Go to admin › OpenCartWorks › So Themes Config › font Tab

Font Setting standard - It is the default fonts of the system
Font Setting Google Fonts - It is the Google fonts, fast, and open through great typography.
Google URL - Example: http://fonts.googleapis.com/css?family=Roboto:400,500,700 ⇒ View More
Google Family - Example: Roboto, sans-serif;
Add css selectors - is the css selectors of setting

Social Tab

Go to admin › OpenCartWorks › So Themes Config › social Tab

Show sidebar social - It is the default fonts of the system
Show Facebook - Options (yes/no)
Facebook ID - is the Account Facebook.
For example: Facebook ID = MagenTech (https://www.facebook.com/MagenTech)
Show Twitter - Options (yes/no)
Twitter username - is the Twitter username
Show Custom - Options (yes/no)
Custom block - is the content of custom block

Custom Tab

Go to admin › OpenCartWorks › So Themes Config › custom Tab

CSS Input - It is the css code direct
CSS File - add file css, Enter file path file css
JS File - add file js, Enter file path file js

Advanced Tab

Go to admin › OpenCartWorks › So Themes Config › Advanced Tab

SCSS Compile - Compile scss source for get css styles using
User Developer Compile Muti Color - Only user developer
Show Minify CSS - compress all css to only one file
Show Minify JS - compress all js to only one file

General Tab

Go to admin › OpenCartWorks › So Mobile › General

1.Select Layout - Choose the layout that you like. Click button Apply Default Setting Choose the Layout

New Color - Set name color (do not uppercase letters) and fill color. Continue Click button Compile CSS.
Select Color - Select the color you just created › Click button Save

2.Platforms

Mobile Status On - use layout mobile/ Off - use layout responsive
Logo Mobile - Choose a image path
Sticky Top Bar - Attach sidebar to top the page when the user scrolls
Copyright - It is the content to Copyright

Bottom Bar Tab

Go to admin › OpenCartWorks › So Mobile › Bottom Bar

Show Bottom Bar - Options (yes/no)
Show Menu More - Options (yes/no)

View Frontend:

Panel Left Tab

Go to admin › OpenCartWorks › So Mobile › Left Bar

Show Search - Options (yes/no)
Show Main Menu - Options (yes/no)
Show All Category - Options (yes/no)
Show Category - Options (yes/no)
Show Wistlist - Options (yes/no)
Show Compare - Options (yes/no)

View Frontend:

Category Page Tab

Go to admin › OpenCartWorks › So Mobile › Page

More Category Button - Options (yes/no)
Compare Button - Options (yes/no)
Wishlist Button - Options (yes/no)
Addtocart Button - Options (yes/no)

View Frontend:

Fonts Tab

Go to admin › OpenCartWorks › So Mobile › font Tab

Font Setting standard - It is the default fonts of the system
Font Setting Google Fonts - It is the Google fonts, fast, and open through great typography.
Google URL - Example: http://fonts.googleapis.com/css?family=Roboto:400,500,700 ⇒ View More
Google Family - Example: Roboto, sans-serif;
Add css selectors - is the css selectors of setting

Advanced Tab

Go to admin › OpenCartWorks › So Mobile › Advanced

SCSS Compile - Compile scss source for get css styles using
User Developer Compile Muti Color - Only user developer

Extension Configuration

There are two ways to configure Extensions of this Theme:

Option 1: Go to Admin Control Panel => OpenCartWorks => So Page Builder => Select the Layout you want.

Themes is using extensions:

So Page Builder: Click here to read user guide
So Mega Menu: Click here to read user guide
So Onepage Checkout: Click here to read user guide
So Search Pro: Click here to read user guide
So Home Slider: Click here to read user guide
So Category Slider: Click here to read user guide
So Listing Tabs: Click here to read user guide
So Extra Slider: Click here to read user guide
So Deals: Click here to read user guide
So Filter Shop By: Click here to read user guide
So Latest Blog: Click here to read user guide
So Newsletter Custom Popup: Click here to read user guide
So Social Login: Click here to read user guide
So Instagram Gallery: Click here to read user guide
So Quickview: Click here to read user guide

Option 2: Go to Admin Control Panel › Extensions › Extensions › Choose the extension type: Modules => And choose the module you want.

Page Builder Configuration

Go to Admin Control Panel => OpenCartWorks => So Page Builder => Select the Layout you want.

Note

Home 1 is made from So Page Builder (Home 1 + Footer 1), similar as other Home page

1.Example So Page Builder : Edit Home 1

It will list all modules in the home page 1, You want to edit the module then click edit it

2.Example So Page Builder : Edit Footer 1

It will list all modules in the Footer 1, You want to edit the module then click edit it

3.Example So Page Builder : Edit Mobile Page Builder - Home 1

Horizontal Menu

Frontend Appearance

Go to Admin › Opencartworks › SO Megamenu › So MegaMenu Tab › set values are adjusted for SO Megamenu

1.Config Menu - Shop

Config Menu item - categories:

Config Menu item - banner:

<div class="img-banner-w">
    <div class="img-banner"><a href="#"><img src="image/catalog/menu/megabanner/image-5.jpg" alt="banner"></a></div>
    <div class="img-banner"><a href="#"><img src="image/catalog/menu/megabanner/image-6.jpg" alt="banner"></a></div>
</div>

2.Config Menu - Page

Config Menu item - List pages:

<div class="row">
	<div class="col-sm-6">
		<ul class="row-list">
		   <li><a class="subcategory_item" href="index.php?route=information/information&amp;information_id=4">About Us</a></li>
		   <li><a class="subcategory_item" href="index.php?route=information/information&amp;information_id=6">Services</a></li>
 			<li><a class="subcategory_item" href="index.php?route=information/information&amp;information_id=3">FAQs</a></li>

		   <li><a class="subcategory_item" href="index.php?route=information/contact">Contact us</a></li>
		   <li><a class="subcategory_item" href="index.php?route=information/information&amp;information_id=7">Support 24/7 Page</a></li>  
		</ul>
	</div>
	<div class="col-sm-6">
		<ul class="row-list">
		  <li><a class="subcategory_item" href="index.php?route=information/information&amp;information_id=9">Typography</a></li>
		  <li><a class="subcategory_item" href="index.php?route=information/information&amp;information_id=5">Photo Gallery</a></li>
		  <li><a class="subcategory_item" href="index.php?route=information/sitemap">SiteMap</a></li>
		    <li><a class="subcategory_item" href="index.php?route=information">Page 404</a></li>
		  <li><a class="subcategory_item" href="index.php?route=information/information&amp;information_id=8">Coming Soon </a></li>
	</ul>
	</div>
</div>

Vertical Menu

Frontend Appearance

Go to Admin › Opencartworks › SO Megamenu › So Verticalmenu Tab › set values are adjusted for SO Megamenu

1.Translate text (All category)

2.Config Menu - Gifts & Toys

Config Menu item - Sub category:

Config Menu item - HTML Content:

<div class="img-vbanner">
    <a href="#"><img src="image/catalog/menu/megabanner/vbanner1.jpg" alt="banner"></a>  
</div>

3.Config Menu - Optimum Electronics

Config Menu item - Sub categories 1:

Note

Menu item after the working similar

4.Config Menu - Bathroom

Config Menu item - Sub menu:

Help & Support

If you have any question that is beyond the scope of this help file, please send us via: Submit a Ticket

Our working hours: Monday to Friday 8AM - 5PM GMT+8.

Thank you so much for purchasing this theme!

What do we support and do not support?

We Do Support:

Provide detailed documentation to help you install and configure the theme successfully by yourself.
Answer your enquiries about theme configuration and use.
Answer you how to edit and translate the language files.
Fix bugs of our themes ONLY if the source code are not modified.

We Do Not Support:

Upgrading the theme on your store if the source code was modified by any reasons.
Editing the theme's source code for your own requirements which the theme's current version is not supported. Except editing language files.

Note

Note: We have right to answer or not answer you how to edit the theme's source code.