How to update your OpenCart theme (journal3 tutorial)

Our friends at Digital Atelier just announced their brand new OpenCart theme - Journal 3.

Given the fact it’s the #1 bestselling theme for OpenCart, we think it’s quite a big deal so we decided to show you a tutorial on how to update your theme using Journal 2 and 3.

Technically, Journal 3 is a completely new and separate theme from the previous one. It's not an updated version.

The update process we’ll show you in this tutorial is about replacing the theme files with the new ones and enabling the new template for your OpenCart site.

And this should go for any OpenCart theme, not just Journal.

 

Before we begin...

How to Install OpenCart 3.x - Watch Video

How to Install a Theme in OpenCart 3.x - Watch Video

5 New Responsive OpenCart Themes - View Themes

 

Make an OpenCart Backup

Before making any major changes to your OpenCart store, make sure to have a backup of your current files in case something doesn’t go as planned.

If you’re not sure how to do a backup, you can either contact your hosting provider, or use the AnyPort OpenCart extension for a cloud Backup & Restore solution.

Test the OpenCart Theme

It’s always a good idea to test the theme locally and see how it’s performing with the rest of your OpenCart extensions and whether you’re seeing anything out of place.

If you’re happy with the way things look and work, you can apply the theme to your live store.

One last look at Journal 2

Digital Atelier really did make a lot of progress since Journal 2.

 

Let's remind ourselves how things looked like with the previous theme version and get ready to meet it's new successor.

 

Step1: Download Your New OpenCart Theme

Unzip the file and open your favorite FTP client.

Locate the files of the theme.

 

Step 2: Select the Correct OpenCart Version

Themes usually come with files for different OpenCart versions. Make sure you're opening the correct version for your store.

 

Step 3: Upload the New OpenCart Theme Files

Select the admin, catalog, image and system files and upload them in your OpenCart directory, replacing the existing ones.

When the upload is finished, the new theme is now ready for you to install.

Now go to your OpenCart Dashboard.

Step 4: Refresh Your OpenCart Modifications

Go to your Extensions > Modifications and click the Refresh button.

Step 5: Install the New OpenCart Theme

After entering your admin panel, go to Extensions > Extensions, select Themes in the dropdown and locate the theme you just installed.

 

Click the Install button.

How to Assign Modules to Journal 3 Layouts?15 OpenCart Extensions Compatible with Journal 3 - View Extensions
 

Step 6: Select your Default Store Theme

The field above your new theme lets you configure your default store theme.

This step requires you to set your new OpenCart theme as the default store one.

You can do that from the Theme Directory field at the top of the settings:

 

Step 7: Select Your Theme in General Settings

Go to System > Settings > Edit Store > General.

Scroll down and find the Theme field.

This is where you need to also select the new OpenCart theme you just installed and hit the Save button.

 

Congratulations! You're all done!

Now it's time to view and edit your new OpenCart theme.

Go back to your Extensions > Extensions > Themes and hit the Edit button on your theme.

This will lead you to the new admin panel of the theme. In our case, this is the brand new Journal 3 Dashboard.

It features a more comprehensive admin menu with more control over your styles, skins, layouts, header, and many more.

Journal 3 OpenCart Administration

 

How to Display Your New Theme and Start Customizing?

First step, go to the official Journal 3 OpenCart demo.

Go to the admin (username: demo / pass: demo) and open the Journal 3 dashboard.

Go to System > Import / Export and scroll down to the Export button.

 

Important!Be careful with exporting entities that shouldn't go into your store, such as the Blog, Newsletter, Messages, Catalog Data (Products & Categories), and System Settings. Keep them turned OFF for the Export.

You need to enter your ThemeForest User and the Purchase Code that comes with your Journal 3 theme.

Hit Export.

Now, go back to your OpenCart store and make the same steps. This time, open the Import tab.

Upload the file you just exported from the Journal 3 OpenCart demo (looks something like: 2018-08-15_11-06-20.sql) and import it here.

Journal 3 OpenCart Storefront

 

Meet your brand new OpenCart store design!

Journal 3 comes with tons of new features and a more elaborate storefront layout allowing endless customization with the theme editor.

 

Wrapping up

Hope you learned how to update OpenCart themes. This process was demonstrated using the new Journal 3, which is not yet fully released. Digital Atelier have stated that their full official release is coming soon