The code editor
The code editor is a page in the Shopify Admin that lets merchants view and edit the code for their themes.
Accessing the code editor
Anchor link to section titled "Accessing the code editor"From your Shopify admin, go to Online Store > Themes.
Find the theme you want to edit, and then click Actions > Edit code.
From the Shopify app, tap Store.
In the Sales channels section, tap Online Store.
Tap Manage themes.
Find the theme you want to edit, and then click Actions > Edit code.
From the Shopify app, tap Store.
In the Sales channels section, tap Online Store.
Tap Manage themes.
Find the theme you want to edit, and then click Actions > Edit code.
The code editor shows a directory of theme files on the left, and a space to view and edit the files on the right.
You can expand the code editor to fill the screen by clicking the expand icon:
You can return the page to normal by clicking the collapse icon:
When you click a file in the directory on the left, it opens in the code editor. You can also hover over section and snippet references within a file to reveal a link to the associated section or snippet:
You can open and edit multiple files at once. Any files that you modify will show a dot next to the file name:
This can help you to keep track of where you have made changes.
If you want to revert any changes to a file after you click Save, then open the file and click Older versions. A drop-down menu shows the date and time for each save that you've made. Select the version that you want to revert to, and then click Save.
When the code editor is in full screen mode, you can toggle the editor color scheme between Light and Dark by clicking the buttons at the bottom of the page.