How to use Claude Code to design your Shopify store

Claude Code has made working on Shopify so. much. fun. I get a lot of questions about my approach for using it lately, so here's my full breakdown of the exact process I follow to design and build custom Shopify stores with Claude Code. 

I've figured out a sort of "hybrid" model when it comes to integrating Claude Code with Shopify—half in the terminal, half in the theme editor. This is because I frequently bounce back and forth from using Claude to write advanced code/do repetitive tasks to popping into the editor myself to change some copy or images, rearrange sections etc. 

A beginner-friendly Claude x Shopify setup

A typical developer Claude-to-Shopify setup has you editing local files and manually publishing your changes, but I found that slowed me down a lot. I'd rather use one that lets me work side by side with Claude in the theme editor—kind of like sitting side by side and handing a laptop back and forth. 

I always work in an unpublished theme with Claude so that no unwanted edits make their way onto a live Shopify store.

I find that a lot of people get intimidated by the thought of "getting set up with Claude Code", but once you've got a few key things installed, it's actually really easy to use because Claude is amazing at translating plain English to theme code updates. 

So if you've never touched your computer's terminal (where Claude Code runs) in your life, don't fret—I'll hold your hand through this walkthrough and show you how literally magical it feels to unleash the power of Claude on your Shopify store. 

How Claude Code Connects to Your Shopify Store

Claude Code is a tool that runs in your computer's terminal. Let's back up for a sec: your computer's terminal is an app that's already on your computer (Terminal on a Mac, PowerShell on Windows) where you type commands to your computer instead of clicking around a visual interface. 

You'll use it like this: copy a line from this guide, paste it into your terminal window, and press enter. The computer does the thing and prints back what happened. 

Added bonus: you get to feel like a really cool, hack-y developer when using it. 

Something important to note about Claude Code: unlike what you're probably used to in the browser or desktop Claude chats, Claude Code in terminal doesn't automatically save your chat history for reference later. 

So, if you have any inkling that you'll want to reference the chat you're having with Claude Code in the future, ask it to "save a copy of this chat transcript into this folder on my computer". I like to pop these as Markdown (.md) files in my Obsidian vault (article to come on my Obsidian setup soon, it's a lifechanging note-taking tool that speaks to Claude Code super well).

I know you're super excited to get zooming around your Shopify store with the help of Claude ASAP, but there are a few steps you need to do in order to get this all set up. You need to install a few foundational things first:

• Claude Code (duh)
• Shopify CLI (the free tool from Shopify that connects your terminal to Shopify's backend)
• Node.js (the free program the Shopify CLI runs on top of). 
• Git (another free program the Shopify CLI needs to run, it tracks file changes behind the scenes and backs up your work)
  

These are all one-time things, though. All in all, Claude does the designing, the CLI does the delivering, Git does the backing up. 

Some other things you'll also need to edit a store on Shopify with Claude Code:

• You need to be the store owner (or staff/collaborator with permission to edit the theme).
• A paid Claude plan.
• And you need a computer from roughly the last five years with at least 4GB of RAM (nearly anything you'd buy today has this). 

How to Set Up Claude Code for Shopify, Step by Step

This feels a little complicated at first, but you only need to do it once before you've got your Claude Code x Shopify setup in place for good: 

The Claude x Shopify Workflow

Simply put, my side-by-side hybrid workflow goes like this:

• Open a new terminal window
• Type the word "claude" to launch Claude Code
• Give Claude your Shopify theme access password
• And just get working! 

Open a new terminal window + launch Claude Code

Open Terminal (Mac) or PowerShell (Windows) and type the word "claude". It's that easy! You may need to log in before doing anything else—Claude will let you know how to do this if so. 

Creating and Giving Claude a Theme Access Password

You'll only need to do this once for each Shopify store you work on. 

A theme access password is a special password where whoever holds it can access and publish theme code, and it's it's how Claude gets permission to work on your store.

This doesn't involve access or editing rights to backend things like orders, customer info, payouts, or store settings.

To generate a Theme Access Password, install the free Theme Access app (built by Shopify) from the App Store.

Open the app, click Create password, and enter your own name and email. Shopify emails you a link to view the password (it starts with shptka_). Note that the link only shows the password once, so save it somewhere safe as soon as you open it up. 

Keep in mind that anyone who sees this password can rewrite your entire storefront with no login and no record of who they are. SO, don't text it around, paste it into random AI chats, or leave it sitting in a shared doc.

If it ever does leak, open the Theme Access app and delete that password: it's killed immediately and you can make a fresh one in about a minute.

The best way to give it to Claude is through a file on your computer instead of a chat message, and you don't even need to make the file yourself. Just tell Claude: "save this password in a plain text file called theme-password.txt in our working folder, and read it from there whenever you need it", then paste the password once.

Claude then creates the file alongside your theme files on your computer and references it on its own from now on. This is nice because the theme access is now persistent and every future session picks it up on its own.

Tell Claude the .myshopify URL and which theme you're working on

Claude will need to know the .myshopify URL of the store you're working on—the easiest way to find it is to head to Settings → Domains in your Shopify admin, where it's listed as the permanent domain.

You'll also want to specify the exact theme copy that you'll be working on with Claude. All you need to do is simply tell Claude in plain English "we'll be working in [THEME NAME] together".

Again, it's a good idea to always work on an unpublished copy of the theme, unless you're working on a brand new store that's not live yet. 

Then, get prompting! 

This is the easy part where all of the tech-y setup becomes super worth it, because you can talk to it like a normal person. 

The world is your oyster, and we'll dive into some things that Claude Code is great for in Shopify next. 

The way we've done our setup, you'll be able to see the changes Claude makes as soon as it pushes them to your live store. All it takes is a refresh of the preview link and voila.

Important note: if you yourself are working within the code editor of your Shopify store alongside Claude, be sure to refresh the tab after every Claude push, otherwise you'll overwrite Claude's work (no biggie because you can basically just say "sorry Claude I overwrote your work can you push it again and merge it with my updates 🥺". 

What Claude Code Can and Can't Change in Your Store

Before we move on to the list of ideas to try with Claude Code in your Shopify store, let's go over what exactly it can and can't touch: basically anything that lives in your theme, plus your store data if you ask it to.

Skipping the products spreadsheet with the direct data connection

Newer versions of the Shopify CLI add a more direct option for editing backend store data: a data connection that lets Claude read and update products, inventory, and other store records for you.

Setting it up takes one prompt—ask Claude to connect to your store's data and a browser window opens where you log into Shopify and approve the connection.

The connection only touches the types of data you approve, so you can start with read-only access and use it purely for answers like which products are missing descriptions, which ones have no images, what your slowest movers are.

Edits are blocked by default even after you approve the connection, so every time Claude wants to change any data, it has to ask for explicit permission.

Once you trust what Claude plans to do with that data, bulk changes like "Add a Summer tag to everything in the Warm Weather collection" or "set the compare-at price on these ten products" become a single prompt instead of a CSV download and upload.

The spreadsheet still has one thing going for it, which is that you can read the entire file before you import it, so stick with the file version any time you want to review every change before it happens.

Ideas For What To Do With Claude Code On Your Shopify Store

1. Design custom sections

Claude is amazing at breaking you out of Shopify's "theme jail"—basically how you're locked in to the layouts that your theme gives you unless you have the right resource like a library of pre-built Shopify sections.

A good candidate for your first Claude-built custom section is one that's on the simple side: AKA no cart logic, advanced animations or interactivity, third-party data, or checkout involvement.

Leave things like a cart drawer, product form, and variant selection alone until you've done several smaller builds and are feeling confident in your process and QA. These parts involve more intense logic and are the ones that can cost you orders if they break.

Something like a brand story section or a values row is a good example of this: 

"Build a section called Brand story under my Featured Collection section on my home page. Give it a heading, a rich text body, one image, and an optional button. Match the style of my featured collection section. Make the following editable in the theme editor: text, image, button, button link, background color, font style. Use theme defaults for things like typography, spacing, container etc. where possible".

Claude will then propose its plan, you'll approve it, and it gets to work—it should automatically publish this new section right where you told it to.

Now, because of our hybrid setup, we can pop right into the editor and add our content/style it how we like it, then head back to Claude to ask it to make further design refinements. 

If you have any edits you'd like Claude to make, it's as easy as explaining them just as how you're thinking them—"can you make the image a bit bigger? I'd like the button to be higher up." etc. 

2. Bulk product edits through a spreadsheet

Your can export your entire product catalog as a spreadsheet file in order to edit them in bulk (head to Products > Export to do so).

Give that file to Claude and do things like the following: "rename every SKU to follow this pattern", "add a Bestseller tag to these 12 products", "rewrite all the titles in title case".

Claude can edit hundreds of rows in one go, then you'll want to just glance over a few to confirm before uploading the file back up in your Products area.

One tip that to save you a potential headache: before you re-import, ask Claude to trim the file down to just the product titles, handles, and columns that you changed.

This lets you rest easy and protects any unwanted drift in the things you didn't touch because an import overwrites only what's in the file.

3. FAQs in bulk

Copy-pasting FAQ questions and answers into your theme section takes a long time (and is a workout for your mouse hand or trackpad finger). If you hand it to Claude, it'll upload them into your FAQ section easy peasy. 

AND, it can add FAQ schema markup at the same time, which is the code that makes your questions eligible to appear in Google Search results. 

4. Variations of the same landing page

If you want to create lots of versions of the same landing page (perhaps for different ad creative or audiences), ask Claude to duplicate your landing page and make a version with different copy, a reordered layout, or a campaign-specific offer etc.

5. Technical SEO optimization

This is the unglamorous work that's 1. hard to do by hand and 2. near impossible if you're not a literal technical SEO specialist.

Ask Claude to sweep your theme for missing alt text on images, check that every page template has one clear main heading, add the right structured data to your product pages, and tighten page titles + meta descriptions using that same spreadsheet trick from the bulk edits above.

Better yet: Install and run this Shopify Theme Audit skill (it's as simple as copy pasting the URL and telling Claude "install this skill then run it on my store".

6. The tiny styling tweaks your theme has no setting for

Every theme has them: the buttons you wish were rounder, the heading that's too big on mobile, the section you wish could have a gradient background. These fixes take Claude seconds because it can touch the code that the theme editor interface doesn't edit (yay!).

7. Cleaning up dead links with bulk redirects

When you rename or retire products, the old links live on in ads, emails, and Google results, and visitors who click them hit a dead page. Give Claude your list of old and new URLs and it will build the redirect file for you, ready to import in your admin's URL Redirects area so every old link forwards to the right place.

8. Making your store's built-in wording on-brand

All the little default phrases in your store ("Sold out", "Your cart is empty", "Continue shopping") live in your theme's default text files, and Claude can rewrite them in one go.

It's a fun way to sneak brand personality into spots that a ton of stores leave generic.

Which Shopify Apps You Can Retire by Building It Into Your Theme

A handful of common storefront apps are not quite scams, but are very easily replaceable with a simple Claude-generated alternative.

A couple added benefits are the fact that you don't need to pay for a monthly app fee and the code is more elegant and lightweight as you don't need third party app scripts to load on each page. 

Some of these swaps are like 40 lines of code, some are a weekend. 

Now, some things should stay as apps: review apps (they handle a whole bunch of things like email requests, verified-buyer badges, and moderation), subscriptions, email and SMS marketing, loyalty, tax, shipping rates, search and filtering at scale, and anything involving customer data or payments.

Frequently Asked Questions