Creating and installing your own jQuery UI theme is an easy process that won’t take you more than some minutes. Using mini template system, you will not need to modify any files. Let’s start:
Please note that mini template system has already 18 jQuery UI themes pre installed that you can easily select via a drop down menu in your administration panel. Read here about. The following article explain the procedure to add your own jQuery UI theme additional to the existing
1. Choose a theme from “themeroller”
Go to the jQuery UI page and pick a new theme from themeroller. You can take one of the ready themes, you can make adjustements to an existing one or even create your own theme. Some of the themes found there are already included in mini template system.
There are really many themes to choose from. After you are done click “download”. You’ll be transfered to another screen.
Note: Please disregard any version information shown on the image above. The recent jQuery UI version is 1.8.23 and mini template system is using this version
Leave all components checked and click “download” again. You’ll get a complete copy of jquery ui to your computer. Unzip the file and open the folder. The folder will look like this
You don’t need all of it’s contents, because jquery ui is already installed in osCommerce and mini template system. The part you need is marked with orange in the above image. It’s named by the name of the theme you choose or, in case you created it your self, it will be called “custom-theme”.
Here you need to do one change, to rename the file jquery-ui-1.8.23.custom.css to jquery-ui-1.8.23.css. (Please note, that even in the future the version number may change, the renaming logic remain same: Just remove the word “custom” and leave everything else in place) You can also rename the folder “custom-theme” to anything you want before uploading.
2. upload the theme to your server
Use your favorite FTP program to upload the folder “custom-theme” (or however it’s called after renaming it) to following location
In case you are updating an existing theme for a newer jQuery UI version, please check here
If you don’t have an FTP program by hand, you can do the same via your host cPanel. Please contact if you need instructions on how to do this
3. activate the new theme
That’s the most easy part thanks to mini template system. All you need to do is, to go to the mini template system area of your osCommece administration panel, click “edit” on the template you want to use your new jQuery UI theme, select it from the drop down menu, and save the settings
You can of course preview the new theme in your administration by clicking “preview”. If all is ok and to your satisfaction, you can activate the template (if it is not active already) and go to your store to enjoy the new look
