How to Create AI-Generated Theme Blocks with Shopify Magic (Summer 2025 Edition)

Shopify’s Summer 2025 Edition  introduces an incredible new feature—AI-generated theme blocks  powered by Shopify Magic. This tool helps you create custom sections for your online store’s theme quickly and easily by simply describing what you want. No coding skills required!

If you prefer to watch a video tutorial, here’s a step-by-step guide to create your own AI-generated theme block and customize it to fit your store perfectly.

Follow this step-by-step guide to create your own AI-generated theme block and customize it to fit your store perfectly.

Step 1: Access Your Theme Code Editor

• Navigate to your Shopify admin and click on “Online Store” in the left sidebar. Then, click on “Themes” and select the theme you want to edit.
• Click on “Edit code” to open the theme code editor (I’m trying with Dawn theme).

Step 2: Create a new section file

• In the theme code editor, navigate to the “sections” directory and click on “Add a new section”.
• Name the section file “ai-block-generator”.

• Fill this file with the following code:

{% for block in section.blocks %}
  {% render block %}
{% endfor %}
 
{% schema %}
{
  "name": "AI Block Generator",
  "settings": [
    {
      "type": "header",
      "content": "AI Block Generation",
      "info": "Select ADD BLOCK and then click GENERATE and enter your prompt to create an AI powered block."
    }
  ],
  "blocks": [
    {
      "type": "@theme"
    }
  ],
  "presets": [
    {
      "name": "AI Block Generator"
    }
  ]
}
{% endschema %}

The file should look like this:

Step 3: Use the AI block generator

• Click on “Add section” and select “AI Block Generator”.
• Continue “Add block” and select “Generate” to create a new block.
• Enter your prompt and click “Enter” to generate the block.

Tips for best results

• If your custom blocks aren’t aligning with the layout of the rest of your content then ask the A.I to add a setting that allows you to align the block.
• Example prompt: “Add a setting that allows me to align the block to the left, center, or right.”
• If you know how to code and want to try editing the code for the generated block directly you can navigate to the file quickly by right clicking the block and selecting “Edit code”.

Note: “Edit code” is only available after the generated block has been saved to the theme files by clicking “Save”.

With these steps, you can harness the power of Shopify Magic’s AI to create beautiful, functional theme blocks that enhance your store’s design and user experience—all without writing a single line of code!