Edit a Shopify Theme With AI: Safe Steps Using a Duplicate Theme

Coding Liquids tutorial cover featuring Sagnik Bhattacharya for Edit a Shopify Theme With AI: Safe Steps Using a Duplicate Theme.
Coding Liquids tutorial cover featuring Sagnik Bhattacharya for Edit a Shopify Theme With AI: Safe Steps Using a Duplicate Theme.

Duplicate your live theme first, make every change on the copy, preview it on a real phone, then publish only when the checks pass. Keep the old theme in your Draft themes list so you can republish it in seconds. ChatGPT, Claude or Sidekick can draft the code or settings; none should touch the live theme directly.

The reason for the order is simple. A broken theme edit rarely looks broken on your own screen: the section works on desktop but collapses on a phone, or the product page is fine but the collection template loses its filters. Customers find those faults before you do. A duplicate turns every experiment into something only you can see.

Follow me on Instagram@sagnikteaches

Step 1: make the copy and name it so you can find it

In your Shopify admin, open Online Store, find the live theme, click the three-dot menu beside it and choose Duplicate. In the Shopify app, tap the Menu icon, then Online Store under Sales channels, then Manage all themes, then the same menu. The copy appears in the theme library as "Copy of" followed by the original name.

Connect on LinkedInSagnik Bhattacharya

Rename it straight away. A name that records the date and purpose saves confusion later, for example "Test 2026-11-05 add size guide". If you end up with three copies, you will otherwise guess which is which.

Subscribe on YouTube@sagnikteaches

Watch the limit: Shopify's help page says an admin holds up to 20 themes. If you are at 20, delete one first, and download it before you do because deletion is permanent. Old copies pile up quickly when several people experiment, so tidy as you go.

Before you touch anything, write down three things in a note: the name of the live theme, the date, and anything unusual about it (a customised cart, an app that injects code). That note is your rollback plan in one line.

The Complete Excel Course with AI Integration thumbnail

The Complete Excel Course with AI Integration

From formulas and pivot tables to Power Query, DAX, VBA and AI with Copilot, ChatGPT and Claude — hands-on from the first lesson.

By Sagnik Bhattacharya and Virginia Thorn, Primetime Emmy Award winner

Buy now

Step 2: decide which tool does which job

Three kinds of help are available, and they suit different edits.

Edit typeBest toolWhy
Change text, colours, spacing, section orderThe theme editor itselfNo code involved; settings are built to be changed
Add a small section or tweak a templateChatGPT or Claude drafting code, you pasting it into the duplicateYou see the code and control exactly what changes
Ask what a setting does or find where something livesSidekick, ChatGPT or ClaudeExplanations carry little risk
Change checkout, payments, cart logic or tracking codeA developerErrors here lose sales or data without any visible sign

Sidekick lives inside the admin and knows your store. Shopify's help pages say that in the theme editor it can change your theme's settings, add sections and blocks your theme already includes, and generate new theme blocks from a text prompt; they also note that in some stores Sidekick cannot run code. Open the duplicate before you ask it for any of those changes, exactly as you would before pasting code. Building custom apps with Sidekick is a separate feature, which Shopify limits to the Basic, Grow, Advanced and Shopify Plus plans, and generated apps cannot reach your theme. For a comparison of the assistants by job, see this guide to Sidekick, ChatGPT and Claude on Shopify, and for ready-made briefs for sections, the Sidekick prompts for custom sections.

Step 3: write a brief the assistant cannot misread

A vague request ("make the product page better") produces a rewrite of things you did not mention. A good brief names the file, pastes the current code, states the result and fences off what must not change. Here is a template.

I run a small Shopify store. I want to change ONE section in my theme.

Current file: sections/product-info.liquid (pasted below).
Goal: show a "Size guide" link under the variant picker that opens the page at /pages/size-guide in a new tab.
Constraints:
- Change nothing else in the file.
- Keep all existing Liquid variables and settings.
- Add the link text as a theme editor setting so I can edit it without code.
- Work on phones first: the link must not wrap onto two lines at 360px width.

Return: the full changed file, then a bullet list of exactly which lines you changed and why.

[paste file here]

The final instruction, a list of changed lines, is what makes review possible. If the assistant says it changed three lines and the diff shows twenty, discard the answer and ask again.

Reading the size-guide answer before you paste it

Illustrative output for the brief above might include a new block of about eight lines inserted after the variant picker, plus a schema entry for the link text. Read it with these questions:

  1. Is the inserted code inside the right container, or did it land outside the product form?
  2. Did it add an inline style that overrides your theme's fonts? If so, ask for a class that uses the theme's existing styles.
  3. Did it hard-code the page address? A setting is better than a fixed path, since pages get renamed.
  4. Did it quietly remove or reformat code outside the change? Compare the pasted original with the returned file side by side in a free diff tool or the theme editor's own view.

Ask the assistant to explain any line you do not understand. If it cannot explain a line in plain words, do not paste it.

Step 4: paste into the duplicate and nowhere else

Open the duplicate, not the live theme: the theme library lists the live theme at the top, and it is easy to click the wrong Customise or Edit code button. Check the banner or theme name at the top of the editor before you paste anything. This is the most common way a safe plan fails.

Make the change in small steps. If you want a new section and also a colour change, do the section, save, preview, then do the colour. Two changes at once means two possible causes when something looks wrong. In the code editor, each file has a Timeline view that can restore an earlier version, but Shopify's help page warns that restoring replaces the whole file, including changes you may want to keep. Treat Timeline as a backup for one file; the duplicate is your real safety net.

When the assistant has given you a new file rather than an edit, resist replacing the whole file in one go if you can instead paste only the changed block. Smaller pastes are easier to review and easier to reverse.

Step 5: preview like a customer, not like the owner

Use the duplicate's preview. Then run these checks, in this order, on an actual phone as well as a laptop:

  1. The changed page on a phone. Open the preview link on your phone, not just a narrowed desktop window. Rotate the phone. Look for text wrapping, overlapping buttons and horizontal scrolling.
  2. A sibling page. If you edited the product template, open a product with many variants, one with none, and one with a long title. Sections that work for your best seller often fail on edge cases.
  3. The path to purchase. Add to cart, open the cart, go to the checkout page. You do not need to pay; you need to confirm nothing earlier broke.
  4. The browser console. Right-click, choose Inspect, open Console. Red error lines after your edit mean something in the code is failing, even if the page looks fine. Paste the first error to the assistant and ask what it means.
  5. Speed. Run the preview URL through Google's PageSpeed Insights or the equivalent in your store's speed report, and compare with the live theme. A new script or image can slow a page noticeably. The assistant cannot see this from code alone.

Keep a short test log: date, what changed, the five checks, pass or fail. It takes ten minutes to write and saves an argument with yourself in three months. The same discipline appears in the store audit checklist, which is a good companion if you want to decide what to change in the first place.

Step 6: publish with a rollback already in hand

Publish from the Themes page: in the duplicate's menu choose Publish, or from the editor use Publish in the top bar and confirm in the window that appears. Shopify's help page says the previously published theme moves into the Draft themes section and that none of your changes are lost, so republishing it is your rollback.

Choose a quiet time: not during a sale, not just before a newsletter goes out, and when you can watch the store for an hour afterwards. Immediately after publishing, run three checks on the live store: load the changed page on a phone, add a product to the cart, and place or begin a checkout. Check your orders and your analytics real-time view for the next hour. A sudden drop in add-to-carts after a theme publish is the signal to republish the old theme first and investigate second.

Leave the old theme untouched for at least two weeks. Delete it only when you are sure you do not need it, and remember the 20-theme limit.

Six small edits that are reasonable to try with AI

These suit a careful non-developer working on a duplicate, each with a realistic check.

  1. A size guide or delivery note under the price. Add a text line that links to a page. Check: it fits on a 360px-wide phone and does not push the add-to-cart button below the first screen.
  2. A trust strip with three short promises on the homepage. Check the promises are true, such as dispatch times you can meet. Ask the assistant for the code, but write the promises yourself.
  3. An announcement bar edit. Often possible entirely in the theme editor. Use AI only to tighten the wording to 60 characters.
  4. Collapsible FAQ blocks on product pages. The assistant drafts the accordion; you supply the questions your customers really ask. Check it opens and closes with a thumb and with the keyboard.
  5. Reordering the product page layout, such as moving reviews above the description. Usually a settings change, not code. Check the order on every product template.
  6. Alt text and image-size cleanup. Not a theme edit at all, but often the most valuable change. Use AI to draft alt text from product names, with a cap of 125 characters.

For anything on this list that adds an interactive element, test with someone who has not seen it.

A size-guide edit, from duplicate to publish

Say a four-person homeware store gets about 8,000 phone visits a month. A third of its customer emails ask about sizes, roughly 30 a month, and about 5 percent of orders come back for the wrong size. The owner decides to add a size guide link, a table image and a short fit note under the variant picker.

She duplicates the theme (two minutes), names it "Test size guide", and pastes the product section into Claude with the brief above (ten minutes). The first answer changes the file in 14 lines instead of the 6 she expected; she asks for a minimal version and gets 7. She pastes it into the duplicate and previews on her phone. On a product with a very long title the new link wraps awkwardly; she asks for a fix that sets a minimum width, retests, and it holds. She checks the console: no errors. PageSpeed Insights scores within a point of the live theme.

She publishes at 7 on a Tuesday morning, watches orders for an hour, and keeps the old theme for two weeks. Over the next month, size-related emails fall from about 30 to about 18 (illustrative; she counts them in her inbox), and returns for wrong size fall by a similar proportion. Total cost: well under an hour, no developer. The same job on the live theme, with a typo in the code, would have broken the product page for every visitor until she noticed.

When a mistake gets through: three realistic failures

The three cases below are illustrative composites of faults that are easy to make on any store, not reports from particular shops. Each one passed a quick look on the owner's own screen.

The edit that worked everywhere except the sale template

A seller added a countdown banner to the main product template. Sale products used a different template, so the banner never showed there, and the seller assumed the banner was broken on that template when it had simply never been added. The lesson: list every template that could be affected before testing, and test one product on each.

The app that stopped working after a copy

Apps reach a theme in two ways: app blocks and app embeds that you switch on in the theme editor, and, for some apps, code injected straight into theme files. Shopify's help page on extending themes with apps says that when you change your published theme you need to re-activate apps in the new theme, as they won't be active by default. Picture a store that installs a reviews app on the live theme after making the duplicate: the copy never had the reviews block, so the stars vanish the moment the copy is published. Before publishing, open the duplicate's app embed settings in the theme editor, and each template that should show an app block, and compare them with the live theme. Install or reconfigure apps on the live store only after the publish, or recheck each app's setup page immediately after.

The paste that overwrote a hand-made change

A store had a developer's custom tweak in the cart template. The owner asked an assistant to "improve" the cart and pasted the full output over the file, wiping the tweak. The duplicate saved her: she republished the old theme within minutes. If a file has changes made by a person, give the assistant that file as it is now, and ask for edits to it, never a replacement from scratch.

Ask a second chat to review the first one's code

A cheap safeguard before you paste anything: open a fresh chat, paste the original file and the proposed file, and ask a reviewer's question instead of a builder's. A second conversation has no stake in defending the first answer, and it often spots what the builder missed.

Below are two versions of a Shopify theme file: ORIGINAL and PROPOSED.
List every difference line by line. Flag anything that: (1) changes behaviour outside the stated goal;
(2) removes a setting, a variable or a comment that was in the original; (3) adds a script, an external link or an inline style;
(4) could behave differently on a phone. If the two are identical outside the goal, say so.

Illustrative result: the reviewer reports that the proposed file also renamed a CSS class used by the cart drawer, which would have left the drawer unstyled. That is exactly the kind of quiet, unrequested change that a visual preview of the product page would never reveal. You would only meet it by opening the cart, which is why the fifth preview check includes the path to purchase.

Be wary of one thing in reverse: do not let the reviewer chat "fix" the file as well. Review and rewrite are separate jobs, and mixing them returns you to an unreviewed change. Take the findings back to the first chat, ask for a corrected version, and review that again.

Where the line sits: stop and call a developer

Shopify's own help page on editing theme code says to edit code only if you know HTML and CSS and have a basic understanding of Liquid, and to duplicate the theme first. An assistant can write the code for you, but it cannot give you that understanding. Stop and hire help when any of these is true:

  • The change touches checkout, payment buttons, discounts, subscriptions, tax or shipping logic.
  • The change involves tracking, pixels or consent tools; mistakes here silently corrupt your data or break legal obligations.
  • The assistant's code uses terms or tools you cannot explain after two rounds of asking.
  • The console shows errors you cannot resolve in an hour.
  • The theme was built or heavily customised by a developer, and you do not know which files they changed.
  • The change would touch more than about three files.

When you do hand it over, AI still helps: write a one-page brief with screenshots of the current state, a description of the result, the tests you will run, and the duplicate's preview link. Developers quote less and deliver faster against a clear brief. If you are weighing how far to take AI features on the store, this cost breakdown for adding AI to a Shopify store helps you decide between apps, edits and developer time.

A short routine you can reuse every time

  1. Note the live theme name and date.
  2. Duplicate and rename the copy.
  3. Write the brief: file, goal, constraints, request for a changed-lines list.
  4. Paste only what is changed, into the duplicate, after checking the editor banner.
  5. Run the five preview checks and log them.
  6. Publish at a quiet time, check the live store for an hour.
  7. Keep the old theme for two weeks.

A routine this short is easy to follow every time, including when you are in a hurry, which is exactly when mistakes happen. If your store has apps that inject code, or you are not sure which edits are safe to try yourself, I can map that with you in an AI implementation consultation.

Questions before you let AI near your theme

Can I edit my live theme directly if the change is small?

You can, but a duplicate costs two minutes and removes the risk. A small edit to live code can still break a section on one product template or one screen size, and customers see it before you do. Work on the copy, preview it, then publish.

Does duplicating a theme copy my apps' settings?

The copy carries the theme's files and settings as they were when you duplicated it, so anything an app adds afterwards may be missing. Shopify's help page says apps need re-activating when you change your published theme, because they are not active by default. Open the duplicate's app embeds and app blocks before publishing, then check each app on the live store.

How many themes can a store hold?

Shopify's help page says an admin can hold up to 20 themes. If you are at the limit, delete an old one before duplicating, and download it first because deletion is permanent.

Should I paste my whole theme into ChatGPT or Claude?

No. Paste only the single section or snippet you want changed, plus a clear description of the result. A whole theme is far too large and risks the assistant rewriting parts you did not ask about.

What if the published change breaks checkout?

Republish the previous theme straight away from the Draft themes list, where the old live theme moves when you publish. Then fix the problem on the duplicate. Shopify's help page says none of your theme changes are lost by publishing.

Further reads

Sources: Shopify Help Center pages on duplicating, publishing, deleting and editing themes, on extending a theme with apps, and on Sidekick (generating content and generating apps).

Want theme changes made without the risk?

On a 1:1 call we can look at which storefront edits are worth doing yourself with AI, which need a developer, and how to set a safe routine your team can repeat.

Book a 1:1 call with me