On Shopify-based sites, like many other e-commerce site platforms, there is a lot of code to manage all the different components of each site. When a new entrepreneur decides to open their own e-commerce business and signs up to Shopify, one of the first steps is selecting and setting up a theme. At ToyShnip, we went through many themes since we moved to Shopify in 2018. At some point, we settled on Expanse by Archetype.

Up until now, we didn't really have AI to help us with our theme. ChatGPT only came out on November 30, 2022, in the middle of our busiest season. In 2023 and 2024, we did see a lot of apps starting to use AI in their abilities. We did try to use AI to write content or fix our issues. Those apps enhanced our site with this new technology, but we never really used AI directly.

It all changed when more and more people started a sentence with "I asked ChatGPT and it told me that..." that it was clear that AI is taking over. AI is going to take a big market share of traditional search engines like Google. So it was just natural that we would need to migrate our work at ToyShnip to combine it with AI abilities.

Digging into Shopify code can be dangerous for your store. One small mistake and things will stop working. So here are a few basic simple tricks to do before working on your theme's code.

1. If you are not a coder or someone who is comfortable with code, it may be a good idea to get an expert first. Shopify theme code is a complex network of files and one can get easily lost there.
2. If you decide to dig into the code, at least back up the theme from time to time. This saved us many times. The easiest is to duplicate the theme. It is amazing how a copy of a specific working code is useful in the time of a code mess-up.
3. Check your work after every change. If you update a live theme, your customers may see any small issue in the theme. It is so annoying that customers can't check out because a small mistake in the code makes the add to cart button vanish.
4. Wander around your own site from time to time. You don't need to go into every product page, but at least the main sections (Homepage, Product Page, Collections, Blogs/pages).
5. An important addition to #4 is the need to purchase something from your own store. Pick a product, go all the way through checkout until you create an order. That way you can go through the full experience your customer is going through. Give yourself a discount (so you know the codes are working) and at the end cancel the order and issue yourself a refund. A free test that can teach you a lot.

We manipulated and changed the code many times before we started to use AI. But with AI we managed to do simple yet complex changes that otherwise would require a professional coder to do. Here is an example of a simple change we did with AI.

The default quick 'add to cart' button on a collection page is a big + on the top right side of the product. It looks like this (you can see the top orange button in our old theme on top of the Harry Potter figure, while it is hidden on top of the Messi figure. The button only shows when hovering on the image:

But we decided that we don't like that type of button. So with the use of AI we changed it to a traditional add to cart button:

So our CTA (Call to Action) is now permanent on the page, inviting users to add one of the Marvel Animated or a Muppet figure.

To do this simple yet effective change, we had to change the code. Any decent Shopify coder most likely knows what we did here. But so does AI.

We have many other examples of course. After all, we are using 2 separate AI platforms that work together and against each other. Each of them with their own uniqueness and advantages when it comes to Shopify code.