Theme Editor

Basic configuration of plugin

You may define how your editor will look like. You have few editor styles available, grouped by bright and dark themes.


By default, Monokai style is checked, and it looks like the sample below image:


Below an example of the bright theme:


How to edit theme

To start edit your files, first you need to choose theme.



By clicking edit you got access to files. First some additional explanation 



In my test environment, I made some modifications, to show how plugin is working, and how I may work with this editor. So first, how it is presented from my Visual Studio



And how it is presented by our plugin: 



It looks a bit different, why? Our plugin helping, if you need to add to your theme folder and file which is not included in your current template. In that case, you need to copy from default view file (red icons). Here it is presented, all you need is to save file. New file will be added to working theme. 

What is more, if you already added folder, our plugin showing rest of the files which by default are presented at the default view. Please have a look at mine Product view catalog. It has only one file, while on our plugin:



I may only choose a file, and save it to include it in /Themes folder. 

If you choose any file, you will be able to see content, also will be able to save, delete, and restore file from original.



I do not want to show price, would like to change it. Please note, for this moment, I do not have included file, which showing prices. To show prices is used default view file from /View catalog. 

So first, I need to add that file to my /Themes/DefaultClean catalog. Find it on the list, click and save.


There is information at the top, and you need to restart application to save copy into new place.



How now it looks like from backend?



I need to move it from folder, to my Visual Studio, to show it there. 

After restart application, I may see as follows.



Also here, _ProductPrice.cshtml file has been added. Please note, icon file has been changed. 
Let`s do modification. I apply change by adding new class to new span 



Let`s do one more change, and apply styles. This file is included in the working theme, so do not need to add it. Just made the change, and save. 

Now check how it looks in the store. 

Just like it shoul

How to create a GrandNode theme

Upload of the ready theme is not supported. But you may create new template, directly from your admin panel. To do that, just click Theme Editor

Next, click “Add new” button.

Next, add all necessary fields, and add theme image. Save it.

New theme has been added 

And it is ready to use.

Please note, this template do not have any files nor css. You will need to add it.