Edit Code
Early Access
Please note that only merchants who are part of Early Access can access this screen. Please reach out to your Ordergroove representative to learn more about the Early Access program.
Power at your fingertips
We have created a powerful code editor to work right within RC3. Our new code editor allows you to modify the files which make up the SMI. CSS styles, Liquid HTML templates, locale files, and even custom scripts.
![Screen Shot 2021-06-09 at 3.30.16 AM.png 2876](https://files.readme.io/3a1ed4c-Screen_Shot_2021-06-09_at_3.30.16_AM.png)
Note: provisional screenshot and not representative of final product
File navigation
You can find a full list of files displayed using a standard file tree navigation located on the left-hand side of the screen. The screen has been designed to make you feel right at home. You can click on a folder to hide the files contained within that folder. Clicking a collapsed folder reveals the folder's contents again. This feature is useful when navigating a folder structure with lots of files.
Clicking on a file opens it up in the editor window to the right of the file navigation area.
![Screen Shot 2021-06-09 at 3.30.16 AM.png 601](https://files.readme.io/f8c42c2-Screen_Shot_2021-06-09_at_3.30.16_AM.png)
Note: provisional screenshot and not representative of final product
Code editor window
The code editor window has been designed to provide you with the maximum amount of horizontal and vertical space. Each file opens up as a new tab. You can easily close an open tab by clicking the X button within the open tab.
![Screen Shot 2021-06-09 at 4.14.30 AM.png 2130](https://files.readme.io/665811e-Screen_Shot_2021-06-09_at_4.14.30_AM.png)
Note: provisional screenshot and not representative of final product
Syntax highlighting
We know the importance of making your code easier to read. This is why we have implemented support for syntax highlighting for all of the file types which we support in the RC3 code editor.
Liquid (Nunjucks variant)
![Liquid.png 2130](https://files.readme.io/a6a6030-Liquid.png)
Note: provisional screenshot and not representative of final product
Javascript
![JS.png 2130](https://files.readme.io/de92148-JS.png)
Note: provisional screenshot and not representative of final product
CSS
![Screen Shot 2021-06-09 at 4.38.01 AM.png 2128](https://files.readme.io/9dbc923-Screen_Shot_2021-06-09_at_4.38.01_AM.png)
Note: provisional screenshot and not representative of final product
JSON
![JSON.png 2130](https://files.readme.io/c3839e1-JSON.png)
Note: provisional screenshot and not representative of final product
Local Development
Ability to preview changes locally
Please note that you will soon be able to preview your changes locally without having to have to upload files back into RC3.
We have worked hard to build an in-browser code editor which will be a pleasure to use. However, sometimes there is just no substitute for being able to download the code to your local machine and edit it in your favorite IDE. Another reason that you might be interested in local development is so that you may keep a copy of your files in your git or other version control repository. Regardless of your reasoning, we have you covered. We have added the ability for you to seamlessly download and upload files using the RC3 UI.
![Upload.png 520](https://files.readme.io/9f53587-Upload.png)
Note: provisional screenshot and not representative of final product
Clicking the DOWNLOAD button will cause your browser to start to download a file called smitemplate(timestamp).zip to your local machine. After the .zip file is on your machine, you can unzip all of the files and open up the folder named smitemplate(timestamp) to begin your local development process.
![Screen Shot 2021-06-09 at 4.40.27 AM.png 2856](https://files.readme.io/32e38ff-Screen_Shot_2021-06-09_at_4.40.27_AM.png)
Once you're happy with your changes you can click the UPLOAD button or just drag-and-drop files right into the editor window. Please note that we support the ability to drag-and-drop individual files, folders, or even a zip file containing a valid folder structure. Please be aware that uploading files to the RC3 code editor won't save those changes automatically, and that you will still have to click the SAVE button to store those changes in our system.
![Screen Shot 2021-06-09 at 4.48.56 AM.png 2856](https://files.readme.io/7a20b83-Screen_Shot_2021-06-09_at_4.48.56_AM.png)
Updated about 3 years ago