Opencart 3 Template Installation for Ultramodern

Thank you for purchasing Ultramodern Opencart 3x Theme. Select from the right menu to view the step-by-step instruction on how to install and configure this theme.

PLEASE READ:

Please not that this theme will NOT automatically be configured with the same settings as our demo… but with Opencart’s demo products and settings. But go though the links on the right and the settings will be identical.

So don’t be alarmed if the homepage doesn’t look like our demo. You will have to add your own banner and slider images.

Follow our steps and it will. And contact us if you have any questions.

Note: this theme is is set up to have the left or right columns as the pull out menu. So have have the burger click button, you must add modules to the left or right column.

Installing your template

Go under the “extensions” and click on “installer“.

Click “upload” next to “upload file”.

Find the zip file “upload-aura.ocmod.zip” and choose this file for the upload.

The loader will automatically appear showing installation process. Do not click away. Stay on this page till the theme files are uploaded.

Now click on “extensions > modifications” and click the “refresh” button at the top of the page just under your username

Now that the files have been uploaded, you now have to switch the theme on.

Click on “extensions” and click “extensions” again… then under “Choose the extension type”, select “themes”.

Click the blue edit icon next to your store name

Under “theme directory” select “Aura” (one of the color options)

Click “save” at the top right of the page.

Also in this section you can select how many products per page and list description limit. And image sizes which are described below. Since this is an endless scrolling theme, it works best to select around 4 products per page.

The theme is installed.

Image Sizes

Since your still in this section, lets get your image sizes sorted.

Click on “extensions” and click “extensions” again… then select “themes”

Click the blue edit icon next to your store name

Add the sizes below for the width. The height of the images (highlighted in red) are optional.

If you prefer to make the image height automatic, add a 1 for the height only.

Adding your logo

Go under the “system” and select “settings”. Now click on “edit” for your store.

Click on the “image” tab. Click on the first box where you see the “opencart” logo.

A pop up will appear. Click on the “upload” button and find your logo you just created on your hard drive. Once you do this, it will be added in the list inside the pop up box. Double click on the logo. It’s now saved and you’re done.

Creating your home page slider

First you need to create banner images. In my example I have created them to the size of:1500px wide by 600px tall.

“if you want a high resolution images for your slider, make your images 1900 wide by 1056 tall.”

Create several images to the size above and save on your hard drive. Make sure they are all the same size.

In your admin, go to Design > banners

Click “+” (plus box) at the top right of the page

Name the banner something like “homepage banners”.

Now click the “+” (plus box) to add a new banner

Add the title (this will be visible) Make it something simple and snappy. No more than a few word or less.

Click on the image box, click on the pencil box, click the upload icon at the top and select one of your banners you have created which are located on your hard drive

Add the link you want the page to link to. You might want to come back to this if you don’t have products yet.

Once uploaded into the system, select the banner which will be visible in the display.

Repeat for each banner that you have

When you’re done adding banners, click the save icon at the top right of the page.

Go to extensions > extensions then select “modules” from the drop down – next to slideshow click the pencil to edit

Click on add module “+” (plus icon).

Add the name of the module (something like “homepage slider”

Now select from the banner group you have just created (homepage banners)

Now add the height and width which need to mirror the size of your images.
Our example size: 1500px wide by 600px tall.

Set the status to enabled.

Now we need to make sure the slider is in your homepage layout

Go to System > Design > Layouts – click pencil icon next to the “Home” layout.

If this is a new install, you already have a slideshow from the demo in this area. Switch it to the slide show you have just created “homepage slider”

Make sure you attach the slideshow to content top

Click save (disc icon) at the top right of the page.

Add featured products to home page

When you have products, you’ll want to add a few featured products to your homepage.

By default, featured products is already set to your home page. But in case that didn’t happen or you’re not starting from scratch.

You can also set special and latest or featured products. We’ll use featured images for the instructions.

Go to extensions > extensions then select “modules” from the drop down

Next to featured you will see 2 buttons. If it’s not installed, and the left button is green, click install.

Now click to the pencil button to edit.

Add the name of the featured module. We used “Featured Products – Home Page” in our example

Manually type in the name of the products you want to show as featured in the top input box.

Add the limit of products (our example we have 4 products)

Make the image width 500px and set the height to either 1 for auto height or a ratio for your images.

Then save (top right corner of page)

Now make sure it’s in the layout of your home page.

Go to Design > Layouts – click pencil icon next to the “Home” layout.

Now click to add module “+” button

Select featured, put it the position “content bottom”.

Opencart Homepage Layout

Creating banners

Create a banner images to the size of:

500 pixels wide x any height (if you are putting the banner in a column)

1200 pixels wide around 250 pixels height (if you are putting the banner in a header or footer position)

In your admin, go to Design > banners

Click “+” (plus box) at the top right of the page

Name the banner something like “Side Banner Ads” or “Bottom Banner Ads”. Depending on position.

Now click the “+” (plus box) to add a new banner

Add the title (this will show up as an alt tag which is important for good SEO)

Click on the image box, click on the pencil box, click the upload icon at the top and select one of your banners you have created which are located on your hard drive

Add the link you want the page to link to. You might want to come back to this if you don’t have products yet.

Once uploaded into the system, select the banner which will be visible in the display.

Repeat for each banner that you have if you have more than 1. Make sure they are all the same size as they rotate automatically if you have more then 1 banner.

When you’re done adding banners, click the save icon at the top right of the page.

Now go to extensions > extensions then select “modules” from the drop down – next to “banner” click the pencil to edit (or install button if you haven’t installed it yet).

Click on add module “+” (plus icon).

Now add the module name. We used “Side Banner Ads”

Select in the dropdown the name of your banner “Side Banner Ads”. Or what you have called it.

Make the width 500 and height 1. (adding a height of 1 will allow it to auto height)

Save (disk icon) at the top right of the page

Now we need to make sure the banner are in your homepage layout

Go to Design > Layouts – click pencil icon next to the layout you want the banner to appear. In our example we have it showing in the categories page.

Change the position to where you want to banners to appear. So if you made a landscape size banner, you can place it in the content top or bottom.

Add social media icons

Sadly Opencart doesn’t come with social media icons within the system. But you can search Opencart modules to see if you find any modules that you like and can install and skip this part. http://www.opencart.com/index.php?route=extension/extension Otherwise, you can manually install them onto this theme by following these steps. If you need help with this section, contact us on info@eshopalot.com and we’ll do this for you.

Step 1 – Social Media:

Go into your admin and click on extensions > extensions then select “modules” from the drop down and scroll to where you see “html content”