Stylo Opencart Theme

Thank you for Selecting our Stylo theme!

if you have any query feel free to contact us via the following mail-id

• Copy and paste the following folders code from the Stylo-Theme-Files folder inside the themesource-v-3.0.0.0,3.0.1.1,3.0.1.2,3.0.2.0,3.1.0.0_b to your project root folder!
• e.g your copy path will be
• Admin - overwrite this folder
• Catalog - overwrite this folder
• image - overwrite this folder
• vqmod - overwrite this folder

vqmod Installation:

Theme Installation:

To install Stylo theme login to your admin and go to Extensions -> Extensions, select "Themes" form dropdown then install the "Stylo Store Theme" by clicking the install button

Enable the theme & Setting the image's size

After installing the stylo theme enable it by clicking the corresponding edit button then select "stylo" from the theme directory and select "Enabled" from the status

Follow the instructions to set the image's size:

• Change the "Product Image Thumb Size (W x H)" from 228*228 to 350*350 width*height respectively.
• Change the "Product Image List Size (W x H)" from 228*228 to 200*200 width*height respectively.
• Change the "Related Product Image Size (W x H)" from 80*80 to 200*200 width*height respectively.

Activate the stylo theme:

To activate the stylo theme go to system -> settings and edit your store(Default) select the "Stylo Store Theme" from the theme dropdown and save the changes under the general tab!

The stylo theme is installed successfully!

To manage the home page Main slider size go to "extensions -> extensions -> select modules from dropdown-> edit the Home Page, under the slideshow module!."

Change the with => 1920 and height => 590 and save the module

We have handled the opencart default slider for the Stylo theme full width slider!

To manage the home page main slider go to "Design -> Banners -> Home Page Sideshow", edit and change the banners by required data's then save!

Slider have been modified successfully!

To get Our Features module go to "extensions-> extensions-> select modules from dropdown-> Install HTML Content module and add new module by clicking edit button"

• Module Name : Our Features
• Paste the following green color boxed code into the code view to the description box
• 

• Before Saving it, "click the code view again and see the resulted text like the above image then only the module will save on opencart version 3.x" the module have been created successfully!

• our code visibility will look like the following image
• 
• Status : Enabled
• Finally save all changes!

To get Products Tabs module go to "extensions-> extensions-> select modules from dropdown-> Install Products Tabs module and add new module by clicking plus symbol from admin panel"

• Module Name : Use required module name
• select the required modules under the tabs there are 4 modules called featured, latest, bestseller, special
• Featured products : select required products for the Featured products field
• Limit : 20
• width : 200, Height : 200
• Status : Enabled
• Finally save the module

Module have been created successfully!

To get Category Banners Module go to "extensions-> extensions -> select modules from dropdown, then Install Category Banners module by clicking the install button and add new module by clicking plus symbol from admin panel"

• Module Name : Use required module name
• Status : Enabled

• Under the status there are 5 banners, 1st banner size will be 800*800 with and height respectively, and all other banner size will be 500*500 with and height respectively!

• Under the categories column select the corresponding categories for the separate banner image

• After setting all save the module!

Module have been created successfully!

To get horizontal category module go to "extensions-> extensions-> select modules from dropdown-> Install horizontal category module and add new module by clicking plus symbol from admin panel"

• Module Name : Use your Heading text
• categories : select any one of category to list
• Limit: 20
• Product width : 200
• Product Height : 200
• Status : Enabled
• Finally save the module

Module have been created successfully!

Like this we can create multiple Horizontal Category modules and assign on the layouts

Create Banner:

To create horizontal banner go to "Design -> Banners -> Add New"

• Module Name : Horizontal Banner 1
• Status : Enabled
• Assign required banner as like as following image
• 
• add required url under link option if requied!

Now banner have created successfully!

To get Horizontal Banner module go to "extensions-> extensions -> select modules from dropdown, then go to banner module add new module by clicking edit symbol from admin panel"

Kindly use the banner size like 1200*200 width*height respectively!

• Module Name : Horizontal Banner 1
• select Horizontal Banner 1 from banner dropdown
• width : 1200, Height : 200
• Status : Enabled
• Finally save the module
• 

Module have been created successfully!

To get Brand module go to "extensions-> extensions-> select modules from dropdown-> Install Manufacturers module and enable it by edit the module and save"

To manage brands go to "catalog-> Manufacturers and Edit each brand"

Each brand has its own product list, each product under the module will list under the brands

To Integrate the Arabic Language go to "system-> Localisation-> Language-> and add new language by clicking the plus symbol"

Fill the form like the following data's

• Language Name : Arabic
• Code : ar
• Locale : arabic_YE (ar_YE.UTF8@euro, ar_YE.UTF8)
• Image : ae.png
• Directory : arabic
• Status: Enabled
• Sort Order: as per requirement
• Finally save the Language

To get Instagram Feed module go to "extensions-> extensions -> select modules from dropdown, then Install Instagram Module module by clicking the install button and add new module by clicking plus symbol from admin panel"

• Module Name : Instagram Feed
• User Id : Paste your instagram account User Id
• Access Token : Paste your instagram account Access Token
• Status : Enabled
• Finally save the module

with out the User Id, Access Token the module will not work!

Module have been created successfully!

To setting the home page layout go to "Design -> Layouts -> edit Home Layout by clicking the edit symbol from admin panel"

Home Page Layout

Home Page Layout have been Edited successfully!

To Change Our theme logo and fav images login the admin panel and go to system -> settings and edit your store(Default) -> select image tab

From here we can edit our store logo and fav icon!

To manage social icons url login to admin panel and go to "system-> settings-> and edit your store(Default) and click the Social Medias Tab

Fill the form like the following data's

• From here we can manage all our social media's url!