[Tutorial] Getting Started with OpenCart v1.5.x
Posted: Thu Aug 11, 2011 5:04 am
Welcome to OpenCart v1.5.x!
This guide is aimed at people who are both new to OpenCart and for those coming from OpenCart 1.4.x
What's Different?
OpenCart 1.5.x has changed from 1.4.x quite a bit.
- New default theme
- New Global product options design
- New url class
- New Module system
- Tedious changes to all the code which makes almost all 1.4.x mods and addons incompatible with 1.5.x
Change isn't normally a bad thing, as it means progress. Some good, some bad.. but progress
Fresh Install
Installing OpenCart isn't much different than installing any other web based script (blog, forum, cms, etc)
1. Download the latest version of OpenCart
2. Read the "install.txt" file for details on each step. Create the database, upload the files, run the install, etc
3. Once installed , click the catalog first to see what it looks like and verify no immediate issues.
4. Now log into your admin and verify that is working.
Where do I begin?!?
The first thing you will want to do is get familiar with the admin menus. The main menu headings give a rough estimate of what each section contains. Then try a simple test order on the front end. Get to know your cart.
Main System Settings
The system settings are the main control area for your store settings. Go through them carefully.
1. Goto the System->Settings area and carefully read through each option. If you don't understand an option, ask about it in the forum. Adjust your settings and save. Be sure you see the successfully saved message.
Design Layouts
A new feature in 1.5.x is the layout designer. This is a very powerful feature and can be very granulated so it can get confusing fast. It is beneficial to click edit on the default layouts that come with the new install so that you can better understand how they work. Layouts refer to how the modules are laid out on the page. More info on that in the module section.
1. Goto System->Design->Layouts and edit the "Account" layout.
2. Note that it shows the Store "default" which is used for multistore and the route is "account/"
This means that for any page that has the "index.php?route=account/xxx" it will use this layout for that.
You can add additional routes to this to use the same layout as well if you like
You could even use an empty route value to make ALL routes use this layout (as long as you don't have the route listed in another layout).
3. So you could either keep all these individual routes OR get rid of them and keep only a few like "Default", "Home", and "Checkout".
If you only keep those 3, it makes it act a bit more like 1.4.x until you get more used to the new system. This way, any page aside from home or checkout will use the default layout so you can simply set modules one time to show on all pages.
The pros and cons to the Design system are that the new module system correlates to the layouts. If you have 10 layouts and want to have the same module on 8 of the layouts.. you have to add the module 8 times, and set the different layout for each. Some improvements with the ability to multiselect multiple layouts to a single module are planned for the future.
Adding Modules
This is another new feature that is related to the layout system so I'll cover it next.
Modules are "sideboxes" or "blocks" on the pages. Anytime you see a box like "Latest" or "Bestsellers", that is a module. Modules can be placed left/right/content-top/content-bottom, with "content" referring to the current page's own content.
1. Goto Extensions->Modules and you see the core modules that come with opencart. Edit a few of them to see all the fields and understand how they are populated.
2. Modules can be similar in features or completely different.
Compare the "Latest" module to the "Special" module and they look the same as they use the same structured data for the input. Now edit the welcome module and see how different that is.
3. As stated in the Design paragraph, Each module has a layout selection. You can assign the same module a different position on each layout if you want. So "latest" could be on the left side on the home page and the right side on the account page, etc. Again, this is a very powerful yet tedious feature depending on your layout setup.
You can always start simple with just one layout and have all the same modules on every page. This is what OpenCart v1.4.x did and many people were happy with it. As you find yourself getting more creative, you can add additional layouts assigned to routes, and then add those. So don't get too overwhelmed by the large quantity of default layouts.. They are just for example use. Delete all but the default and keep it simple.
Adding Categories
Now it is time to start adding your categories for your store to separate your products. OpenCart's category system is more of a "labelling" design, rather than a "folder" design. This means instead of creating a folder and then creating a product inside the folder, you create them both separately, and "link" them together. Products can be linked multiple categories and a linked product will show when that category is clicked on the store.
1. Click on Catalog->Category and you may see the demo categories that come with the default install. Edit one of them to see all the fields and understand how they are populated.
2. Now go back and click "Insert" from the list. Create your own category
--- a. The first tab has the name, description, and meta data
--- b. The second tab controls all the parent categories, properties, etc
--- c. The third tab is the design layout tab so you can choose which layout this category has. Again, start simple for now and expand later
Adding Products
1. Click on Catalog->Product and you may see the demo products that come with the default install. Edit one of them to see all the fields and understand how they are populated.
2. Now go back and click "Insert" from the list. Create your own product
--- a. The first tab has the name, description, and meta data
--- b. The second tab controls all the pricing, properties, etc
--- c. The third tab is how you link the product to other parts of the store. You can link your product to multiple categories, downloadable files, related products, and manufacturers. You will need to adjust these other areas first to have them listed here.
--- d. The fourth tab is for product attributes, used for common attributes among products. You create the attributes in the Catalog->Attribute menu. These are mainly used for the Compare system to do a side-by-side compare like you'd see on computer stores, etc.
--- e. The fifth tab is the product option tab. Product options are variants of the main product. For example:
Product: iPod
Color: Red/Green/Blue
Size: 16GB/32GB/64GB
The options system in 1.5.x is vastly different than the previous 1.x version of options. You first need to create option types in the Catalog->Options area. Then come to the product page and start typing the name of the option in the autosuggest box to associate it with the product. From there you fine tune the option with pricing, weight, etc specific to this particular product. For example.
Create an option in the Catalog->Option for a Select Box named "Color" and 2 values named "Blue" and "Red"
Now you can have Tshirt that associates the color option and the 2 colors with Red costing +1.00 and blue +2.00
You can also have a Had that associates the color option with the Red costing +3.00 and the Blue at +4.00
--- f. The next few tabs are for special pricing based on date and customer group, reward points, and finally the design override if you want a custom layout for this product.
More to come...
This guide is aimed at people who are both new to OpenCart and for those coming from OpenCart 1.4.x
What's Different?
OpenCart 1.5.x has changed from 1.4.x quite a bit.
- New default theme
- New Global product options design
- New url class
- New Module system
- Tedious changes to all the code which makes almost all 1.4.x mods and addons incompatible with 1.5.x
Change isn't normally a bad thing, as it means progress. Some good, some bad.. but progress
Fresh Install
Installing OpenCart isn't much different than installing any other web based script (blog, forum, cms, etc)
1. Download the latest version of OpenCart
2. Read the "install.txt" file for details on each step. Create the database, upload the files, run the install, etc
3. Once installed , click the catalog first to see what it looks like and verify no immediate issues.
4. Now log into your admin and verify that is working.
Where do I begin?!?
The first thing you will want to do is get familiar with the admin menus. The main menu headings give a rough estimate of what each section contains. Then try a simple test order on the front end. Get to know your cart.
Main System Settings
The system settings are the main control area for your store settings. Go through them carefully.
1. Goto the System->Settings area and carefully read through each option. If you don't understand an option, ask about it in the forum. Adjust your settings and save. Be sure you see the successfully saved message.
Design Layouts
A new feature in 1.5.x is the layout designer. This is a very powerful feature and can be very granulated so it can get confusing fast. It is beneficial to click edit on the default layouts that come with the new install so that you can better understand how they work. Layouts refer to how the modules are laid out on the page. More info on that in the module section.
1. Goto System->Design->Layouts and edit the "Account" layout.
2. Note that it shows the Store "default" which is used for multistore and the route is "account/"
This means that for any page that has the "index.php?route=account/xxx" it will use this layout for that.
You can add additional routes to this to use the same layout as well if you like
You could even use an empty route value to make ALL routes use this layout (as long as you don't have the route listed in another layout).
3. So you could either keep all these individual routes OR get rid of them and keep only a few like "Default", "Home", and "Checkout".
If you only keep those 3, it makes it act a bit more like 1.4.x until you get more used to the new system. This way, any page aside from home or checkout will use the default layout so you can simply set modules one time to show on all pages.
The pros and cons to the Design system are that the new module system correlates to the layouts. If you have 10 layouts and want to have the same module on 8 of the layouts.. you have to add the module 8 times, and set the different layout for each. Some improvements with the ability to multiselect multiple layouts to a single module are planned for the future.
Adding Modules
This is another new feature that is related to the layout system so I'll cover it next.
Modules are "sideboxes" or "blocks" on the pages. Anytime you see a box like "Latest" or "Bestsellers", that is a module. Modules can be placed left/right/content-top/content-bottom, with "content" referring to the current page's own content.
1. Goto Extensions->Modules and you see the core modules that come with opencart. Edit a few of them to see all the fields and understand how they are populated.
2. Modules can be similar in features or completely different.
Compare the "Latest" module to the "Special" module and they look the same as they use the same structured data for the input. Now edit the welcome module and see how different that is.
3. As stated in the Design paragraph, Each module has a layout selection. You can assign the same module a different position on each layout if you want. So "latest" could be on the left side on the home page and the right side on the account page, etc. Again, this is a very powerful yet tedious feature depending on your layout setup.
You can always start simple with just one layout and have all the same modules on every page. This is what OpenCart v1.4.x did and many people were happy with it. As you find yourself getting more creative, you can add additional layouts assigned to routes, and then add those. So don't get too overwhelmed by the large quantity of default layouts.. They are just for example use. Delete all but the default and keep it simple.
Adding Categories
Now it is time to start adding your categories for your store to separate your products. OpenCart's category system is more of a "labelling" design, rather than a "folder" design. This means instead of creating a folder and then creating a product inside the folder, you create them both separately, and "link" them together. Products can be linked multiple categories and a linked product will show when that category is clicked on the store.
1. Click on Catalog->Category and you may see the demo categories that come with the default install. Edit one of them to see all the fields and understand how they are populated.
2. Now go back and click "Insert" from the list. Create your own category
--- a. The first tab has the name, description, and meta data
--- b. The second tab controls all the parent categories, properties, etc
--- c. The third tab is the design layout tab so you can choose which layout this category has. Again, start simple for now and expand later
Adding Products
1. Click on Catalog->Product and you may see the demo products that come with the default install. Edit one of them to see all the fields and understand how they are populated.
2. Now go back and click "Insert" from the list. Create your own product
--- a. The first tab has the name, description, and meta data
--- b. The second tab controls all the pricing, properties, etc
--- c. The third tab is how you link the product to other parts of the store. You can link your product to multiple categories, downloadable files, related products, and manufacturers. You will need to adjust these other areas first to have them listed here.
--- d. The fourth tab is for product attributes, used for common attributes among products. You create the attributes in the Catalog->Attribute menu. These are mainly used for the Compare system to do a side-by-side compare like you'd see on computer stores, etc.
--- e. The fifth tab is the product option tab. Product options are variants of the main product. For example:
Product: iPod
Color: Red/Green/Blue
Size: 16GB/32GB/64GB
The options system in 1.5.x is vastly different than the previous 1.x version of options. You first need to create option types in the Catalog->Options area. Then come to the product page and start typing the name of the option in the autosuggest box to associate it with the product. From there you fine tune the option with pricing, weight, etc specific to this particular product. For example.
Create an option in the Catalog->Option for a Select Box named "Color" and 2 values named "Blue" and "Red"
Now you can have Tshirt that associates the color option and the 2 colors with Red costing +1.00 and blue +2.00
You can also have a Had that associates the color option with the Red costing +3.00 and the Blue at +4.00
--- f. The next few tabs are for special pricing based on date and customer group, reward points, and finally the design override if you want a custom layout for this product.
More to come...
OK .got it , can try later ,thankyou
