Your First E-Commerce Store with OpenCart, Part 1

This entry is part 1 of 2 in the series Your First E-Commerce Store with OpenCart

Your First E-Commerce Store with OpenCart

Creating an online shop is as easy as A, B, C with the availability of so many open-source e-commerce platforms. In less than five minutes, you can create your very own online storefront like Amazon and offer physical and digital products for sale.

OpenCart is a robust e-commerce solution for Internet merchants giving them the ability to create their own online presence and participate in e-commerce at a minimal cost.

In this two-part series I’ll explain all of the necessary steps to create your own e-commerce site with OpenCart. In this article I’ll start with its installation.

OpenCart Features

OpenCart is a powerful, open source shopping cart system that is designed to be feature rich and user friendly. Some of its features worth checking out include:

Open Source
The best thing about OpenCart is that it is free to download and use. There is no need for you to worry about licensing cost for using it. And if you ever make modifications to the OpenCart source code, you can share them back with the OpenCart developers so the community at large can benefit from them too.

Unlimited Categories/Products/Manufacturers
In an online store one would need to have unlimited Categories, products and manufacturers. In OpenCart you can create unlimited number of Categories for your products, add unlimited number of products to your store and add unlimited number of manufacturers.

Guest Shopping/Checkout
There are times you want to order a product online on an online store and don’t want to register before you can buy any goods. OpenCart allows guest shopping and checkout which enables a customer to add goods to their shopping cart, pay for the goods and checkout without them registering.

To learn more about OpenCart, be sure to visit their website at opencart.com.

Installing OpenCart

To install OpenCart, you first need to visit GitHub and download the latest version of the software. OpenCart comes as a ZIP archive, so afterwards you have to extract the archive’s contents into a folder of your choosing.

After extracting it, you’ll see a folder called upload and three text files named install.txt, license.txt, and upgrade.txt.

The install.txt file contains installation notes, license.txt contains the GNU General Public License under which OpenCart is released, and upgrade.txt contains instructions for upgrading an earlier version of OpenCart to the latest version if you’re already using it. The upload directory contains the files you need to upload to your web host.

Copy all the files and folders found in the upload folder to the public directory of your web host. The name of the public directory may vary depending on your host and configuration, but usually it’s named something like public_html.

After copying the files, you need to make sure the following files and directories are writable:

image/
image/cache/
image/data/
system/cache/
system/logs/
download/
config.php
admin/config.php

To make them writable, make sure the file’s permissions are 666 (rw-rw-rw) and directory permissions are 777 (rwxrwxrwx). You can do this with the chmod command if you have shell access, or easily through your host’s cPanel install.

To do this in cPanel, all you need to do is go the directory that you uploaded your OpenCart files to, right click on each of the file and folder choose “Change Permissions” for the pop up box.

Now create a MySQL database with a new user created and attached to it.

To create a MySQL database, you’ll need to login to your database backend. If it’s a shell, you can then use the CREATE DATABASE command and create a user with appropriate access privileges with GRANT.

If you’re using phpMyAdmin, under Create New Database enter the name of the database you want to create and click on the Create Button. Then to attach a new user to the newly created database, click on the Privileges tab at the top and then click on the the Add New User button. Enter the username, host (most likely “local”), and your chosen password twice. Under the Database then for the user select the None option. Under Global privileges click on the check all link.

After you have done all this, you should open the storefront in a browser to begin the installation wizard. The exact URL will depend on where you’ve uploaded the files; for example, if you’ve uploaded the files to public_html then you would open your domain, like www.example.com. If you’ve created public_files/store and uploaded the files there, then you would open www.example.com/store.

After you have visited the URL of where you uploaded your OpenCart files, you will be shown the first step which is “Step 1 – License”. All you need to do here is accept the GNU General Public License by ticking “I agree to the License” after which you click on the continue button.

The next step is “Step 2 – Pre-Installation”. The pre-installation screen displays all the installation requirements, and PHP settings and extensions. It would also check whether the correct permissions are set for the files and directories. If there are no errors, you can click on the continue button.

The next step is “Step 3 – Configuration”. This is where you enter the database host, the username and password of the MySQL user you created earlier, and the database name.

The next three options, Username, Password, and Email, are for the admin account. This is where you enter the username, password, and email address that you will be using to login to the administrative backend.

A screenshot of the “Step – 3 Configuration” screen is shown below.

After you click on the continue button, you’ll be shown the final step, “Step 4 – Finished”. Seeing this means that you have successfully installed OpenCart.

After the wizard is completed, you should delete the install directory from your server. This is the “installation directory” noted in the final wizard screen.

OpenCart installs a sample store during installation, and this is how the sample storefront looks:

But in this article I’m going to delete all of the products, categories, and attributes and do everything anew so that you can see how they are created.

Configuring Your Store

One of the joys of having your own online store is being able to add your own products and set their prices. To do all, first you need to login in to the administrative back-end and set up a few categories to keep things organized.

To access the administrative back-end, go to www.example.com/admin. Log in with the username and password you provided to the install wizard and you will be taken to the Administration Dashboard.

The Administration Dashboard shows a lot of useful information about your store. The overview pane shows a summary of your total sales, orders, number of customers, etc. The Statistics pane shows a graph of your orders and customers. The Latest 10 Orders pane shows you the 10 most recent orders from your store.

Let’s delete the existing categories, products, and attributes so you can start setting up your own inventory. The first piece of data to delete is the existing categories.

To delete all the categories, select Catalog > Categories from the top menu. A list of all of the defined categories will be displayed.

Tick the checkbox at the top left of the listing table next the Category Name label to select all of the categories at once, and then click the Delete button in the top left corner to delete them. A confirmation box will be displayed to confirm the action.

Then, repeat the process for the products list (Catalog > Products), attributes list (Catalog > Attributes > Attributes), attribute groups (Catalog > Attributes > Attribute Groups), and manufacturers list (Catalog > Manufacturers).

Now it’s time to start adding your own data into OpenCart!

Creating Your Own Categories

Categories are classification of related products. For example, the IPhone 5, Blackberry 9800, and Samsung S2 are all products that could be classified as SmartPhones. In OpenCart you can create an unlimited number of categories and sub-categories to organize your products how you see fit.

To create your own categories, navigate to Catalog > Categories. Click the Insert button on the categories page and you’ll see this form:

There are three different tabs available for you on the page.

Under the General tab is where you enter basic information about the category, such as the category’s name, meta tag description, keywords, and description.

Under the Data tab you have the option to select a parent category (useful for creating a hierarchy with sub categories), stores (if you’re running more than one store with the same installation of OpenCart), SEO keyword, category image, whether to display the category in the top menu bar, the number of columns, sorting order, and whether the category is enabled or not.

Under the Design tab is the option to choose the design layout. I won’t discuss this now; you can leave it set blank for now.

Try to enter a few categories of your own before continuing on.

Creating Your Own Manufacturers

Manufacturers are the makers and producers of your products. For example Apple, HP, Nike are all examples of manufacturers. Adding a new manufacturer is as easy as clicking Catalog > Manufacturers and then clicking the manufacturers page’s Insert button.

The manufacturer form provides a place for you to enter a manufacturer’s name, the stores it is applicable to, SEO keywords, a logo image, and sorting order.

Try entering a few manufacturers as well.

Summary

This is where I’ll end the first part of this tutorial. So far you’ve learned how to install OpenCart, log in to the administration section and create categories and manufacturers.

In the next article in this series I’ll dig deeper into OpenCart and talk about adding options, attributes, attribute groups, and most importantly products! Stay tuned.

Image via Fotolia

Your First E-Commerce Store with OpenCart

Your First E-Commerce Store with OpenCart, Part 2 >>

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • hengtheany

    please show me in details about how to create new project. thanks in advance

    • https://plus.google.com/103966073084080446469 Tunbosun Ayinla

      What do you mean by creating a new project?

      • http://webguidebd.com/ Benjir

        New project means “Create a site as like mockup or clone from other site” not only dashboard discussion,but also backend code modification.
        Thanks

  • http://okeowoaderemi.com Okeowo Aderemi

    OpenCart is cool and fun to see but what grinds me the most is the issue of documentation, which is why i still stick to WooCommerce, there’s no Developer Guide of any sort around. but nice work and keep it up. E-commerce is now a biggie in Nigeria Space

    • https://plus.google.com/103966073084080446469 Tunbosun Ayinla

      Thats definitely cool. Opencart is a cool E-commerce platform. But as you said the main problem is the lack of developer’s guide. Presently there is an E-commerce bubble in Nigeria, a lot of e-commerce sites are just springing up left and right. This is definitely good for the tech/developer ecosystem.

  • http://e-commsolution.com Chris

    This is a wonderful guide but I think it is missing some important server settings like that you should not run this on a server with out an SSL cert and you cannot use a shared SSL (out of the box), not saying that you should walk us through but letting the reader know that this is something to look into. other than that this is really helpful.

  • TimB

    What about working with sales tax collection services like avalara? Without that the cart is useless, or, at best, leaves an incredible burden on the site owner.

    • http://www.q8marketz.com/ Mans abbas

      Already supported may tax system in opencart… even you can’t find really what you need there, but don’t be worried, their large free/commercial extension gallery for YOU….. :p

  • Justino

    How secure is OpenCart?

    • http://www.q8marketz.com/ Mans abbas

      It’s secure, for more about this you can visit their module/extension gallery…

  • Steven

    I use Opecart with Joomla using Mijoshop. When you combine the two programs (opencart & joomla) Mijoshop takes care of a lot of the problems with having no developer’s guide. The support at Mijoshop (Mijosoft) is excellent and I recoment it highly.

  • http://www.julie-jackson.com Julie Jackson

    Thanks for this – just about to create my first ecommerce site with Opencart and will use this as my guide.
    At the end of the day, no ecommerce platform is perfect – you’ve just got to choose which you think is best for you.

  • jason mcphee

    I thought no-one used opencart because of its horrendous structure (same folders copied to create the admin). How about Prestashop or Magento tutorials instead… you know, the open sources that actually matter?

    • Peter

      I agree with Jason. If you won’t need to make any changes, I think it’s a decent alternative with quite some nice features. But if you need to dive into the code, the architecture is terrible.

  • http://www.doubleplusmarketing.com Johnny

    OpenCart is an outstanding CSM for e-commerce. I’ve built 2 already and am in the process of building another 2. OpenCart has a lot of room and options for expansion and customization plus Google REALLY likes OpenCart websites (the products on the websites I have built show up on page 1 of Google). OpenCart is an investment of time to learn and admin, but it is incredibly worth it if you have a sound e-commerce business model.

  • PaulC

    I’ve lately been working with Opencart for the first time, re-theming it with a custom responsive/touch framework built on Zurb Foundation and modding it fairly extensively. I’m staying current with the github development version at the moment but I’ll freeze my source code version soon – before deploying the store into active service. I can confirm that the lack of developer documentation can make it difficult to get your feet on the ground to do anything other than simple theme development… PHP, MySQL, JSON, and Ajax skills could be necessary to get the total customization you are looking for. The most difficult thing for me to grasp has been the MVC model itself. I have never worked with it before, although I am an accomplished programmer and web coder. What I can tell you, though, is that once you get familiar with how things work in OpenCart it is elegant and easy to modify. There are free extensions/mods, paid extensions/mods at very reasonable prices, a paid developer community that can help you customize your store any way that you like, and a friendly and active support forum.

  • http://www.myphptutorials.com ellyxc

    which one is easier to develop openCart extension or magento extension?

  • Nik$

    in opencart how we change position of module………

  • http://www.dadesigner.net Ali

    hi,
    my question is that it says I have to have a MySQL should have a user attached to it and that my root password or username should not be used. I have no idea what this means. I am new to this so any links where I can get help from or if you could help me out.

    Thanks and Regards,
    Ali Pirani
    ali@dadesigner.net