How to Create Different Layouts for Each Page on your Site in OpenCart (v.2.3.x) in 2 Easy Steps
Hello visitors of the «Learning Sessions» rubric.
We continue series of the blog posts devoted to some useful customization tricks and methods allowing you to achieve desired effects on your websites and running projects.
The last article «How to Combine Icon Fonts for a Website» was about design. Today we offer to talk little bit about Opencart. We’ll create some different layouts in 2.3.x version.
Ok. We are starting right now.
Let’s take as an example Category layout. By default there are 2 — column layout sets for each category. However, you may be faced with the necessity to
arrange your layouts in a different way. For example, you need to set 3 — column layout for default category “Desktops” and no columns for the category
“Laptops & Notebooks”. Actually, this is easier than it seems to be.
Step 1.
At first, go to administration panel of your web site: Design -> Layouts. You don’t need to change existent layouts. The better choice is to create the new
one. After that press top right button “+”.
Press Add route and write root for category listing: product/category. To have 3 columns on category page add some blocks in Column Left and Column Right
positions, for example, Category and Banner modules.
You must do the same actions in order to create layout without columns. Simply not add any blocks in positions Left or Right Column.
Step 2.
Now you must set new created layouts to corresponding categories. Go to Catalog -> Category and open category, for example, “Desktops”. Go to tab Design
-> Layout override. Choose there your new created Layout Category — 3 columns.
The same steps you can make for other layouts. You can create as many different layouts as you need and override the default layouts of Products, Checkout pages, Information pages etc. The only one significant thing you should pay special attention to is setting the correct route for new layouts.
First of all, check which route the original layout has, and then write the same for copy of the layout.
This is all for today. Don’t miss new publications.
Tonytemplates team
You may be interested in our Opencart website templates