Finding Theme Code in Your Store

If you find something on the frontend of your store that you dislike, it can sometimes be a pain to find the theme code that causes it. This guide will give you some tips on how to find theme code in your store backend.


This example will help describe a process used to find specific theme code. In this example we will be working on the theme Zest (What theme you're working on won't effect the process) and we want to remove the left in stock text on the product page. See the image below.



Working In LemonStand Backend

Here are the steps we use to find specific theme code.

  1. Go to the page we want to edit on the front end. In our case it is any product page. For example our page URL is test-store.lemonstand.com/product/lemon-shirt. Take note that the URL contains product/some-product-code
  2. Go to the store backend and go to Store Design > Page Templates. We will see a list of pages in our store. Look for the one with the URL /product/:urlName. Note pages that don't generate custom URLs, like a login page, will have URLs like so: /login
  3. Look at the content of the product page. First we will look for the words left in stock using ctrl-f. If we don't find anything; we will look inside all the partials on this page. Partials can be easily found by using  ctrl-f on the word partial. We came across a partial called shop-product
  4. So now we go to Store Design > Partial Blocks and look for a partial named shop-product 
  5. Once you are inside the partial, look for left in stock using ctrl-f again. If you don't find it. Look for partials inside this partial using the steps above. The code will be in one of partials you come across using this method.  

This is a brute force method. However, you will notice a pattern after doing this a couple times. The partial names have logical naming that will help you find what you are looking for. In this example we went to the product page and saw it was just a template and had little text on it and saw a partial called shop-product , this partial probably holds the majority of the content so we looked inside. And sure enough we found the text we were looking for. 

Using Your Preferred Text Editor

To avoid doing this in the web browser and loading lots of pages; which can get tedious, store owners can download their theme by going to their store backend > Store Design > Themes. Then clicking the little gear beside their theme and pressing Download as Zip file. 

Now unzip the theme and open it using your code editor of choice. Your code editor should be able to handle a file structure. Sublime 3 text editor is a good choice.  Now you can just search the whole file structure for the code you are looking for. However, the changes you make in your local download of the theme won't effect your store unless you setup LemonSync, which is a development tool used to develop LemonStand themes. You can find more information on LemonSync here.

However, if you don't have LemonSync setup this will still help you find theme code much quicker. You will now just have to go into your Store Backend and look for the file you already found in the text editor.