See a demo of how easy it is to create and install a nopCommerce theme using the Theme Creation Package.
We have developed a zip file that represents the design structure of a nopCommerce store. It allows designers to work locally on their computer to develope and test the nopCommerce theme they create by writing their own CSS and creating their own custom images.
The structure of the directories allow the designer to install the theme quickly and easily once the local version is completed.
- Simple to test in all browsers
- Easy to make changes without needing to upload every single change to a server
- Completely re-usable, use the same zip file to create as many themes as you want!
- Pre-installed theme to get designers started quickly
Below are the instructions contained in the package. Feel free to read them to further understand the process and post any questions about the package on this post.
Graphics Package Information
The information contained in this package will allow a graphic designers to create an nopCommerce Theme quickly and easily without needing to upload any files to a server to see the graphic changes. Once completed, just upload the “App_ThemesdarkOrange” directory to your nopCommerce application by placing the directory from the graphics package in the “NopCommerceStoreApp_Themes”. Feel free to rename the “darkOrange” folder to any theme name you wish. Then log into you nopCommerce store and go to “Configuration” – “Global Settings” – “SEO Display”, from there just change your store’s theme to the one you just created, the theme name will be the same as the new directory. Any folder placed in this directory is detected by the nopCommerce Software as a theme.
This package allows a designer to view the majority of pages associated with the nopCommerce software. Pages like home page, category page, product page, full check out lane, and other misc pages are contained in the package. Please review each page before submitting the package for installation.
Feel free to overwrite the files in the Graphic PackageAssetsApp_ThemesdarkOrange Directory. However please don’t re-name the folder, it will break the directory structure of the pages.
- No changes can be made to the HTML.
- JQuery Libraries can be made available upon request.
- You are welcome to add any additional images, please place them in the Graphic PackageAssetsApp_ThemesdarkOrangeimages folder.
- Use the links on the footer of all page to Navigate through the file structure as you change the design.
- Please ignore the file Graphic PackageAssetsApp_ThemesbreakfastpublicStore.skin it is a system file necessary for installation.
- Most links shown on each example page will work, they are primarily there to accurately show the design elements.
To Quickly Get Started … begin by making changes to Graphic PackageAssetsApp_ThemesdarkOrangebase.css, the main CSS file.