Tapita AI Section Builder: Step-by-Step Guide

Tapita AI Section Builder: Step-by-Step Guide

Alongside our beautiful library of ready-made sections, you can now create your own AI-powered sections tailored specifically for your store—in just a few minutes.

Follow these simple steps to build stunning, custom sections with Tapita AI Section Builder.

Step 1: Enter Your Section Name
Type a name for your section. It will automatically start with “TptAI” followed by your chosen name.


Step 2: Upload a Reference Image
Upload from your device (1) or drag and drop (2) a reference image of the section you want to create.  AI will analyze this image to generate a similar section for your store.

Step 3: Analyze Your Image
Click “Analyze” to get an AI-generated section description based on your reference image. This action will use 20 credits.


Step 4: Review and Edit the Description
The AI will generate the section description divided into 4 main categories:
  1. Overview: Purpose and general info about the section. For example: Newsletter signup

  1. Design: Layout and style details. For example: Split-screen layout with two distinct color panels (blue and light blue). Left side contains branding and heading text, right side features email signup form with illustration of envelope and input field with submit button.

  1. Elements:
    1. Content types: Components included in the section. For example: Text, images, form elements.
    2. Customizable Elements: Parts you can further customize in the theme editor. For example: Heading text, subscription prompt text, button text, brand logo, form placeholder text, background colors, illustration

  1. Interactive Features: Interactive functions like carousels, sliders, etc. This field is optional

You can edit all these fields to tailor the section to your needs. Fields marked with * are required and cannot be left blank.

Step 5: Once you've finished editing the last field (Interactive Features), click “Create” to let the AI generate your section.
This action will use 20 credits and may take 1–2 minutes to complete.

Step 6: After your section is generated, you have can Install to Theme (1) – Add the section directly to any theme you choose or View Code (2) – Click “View Code” to access the section’s Liquid, CSS, and other files.



Step 7: Customize in Theme Editor
After installing your section to a theme, a pop-up will appear. Click “Customize Theme” to open the Theme Editor.
Step 8: In the Shopify Theme Editor, find your new section—its name will start with “TptAI”—add it to your theme. Configure the section as needed and save your changes!




Step 9: Manage Your AI Sections
You can find your AI-generated sections under the [AI Sections Dashboard].
Here, you can:
  1. See which themes each section is installed to
  2. Install a section to another theme 
  3. View the section information (AI Analysis Results - section description and associated code files)
  4. Edit the AI section. Here’s a step-by-step guide to edit sections created by Tapita AI.

Click “View all” to browse all your AI sections.



Step 10: Important: If you're running low on credits for AI features, feel free to contact us to request more.
You can reach us anytime via:
  1. Live Chat
  2. Email: support@tapita.io
  3. Help Center for quick answers and guides

If you want to remove the “Powered by Tapita” trademark on your sections, we're just a message away!
We’d love to hear your feedback on this exciting new feature—it helps us make it even better for you.

    • Related Articles

    • Tapita AI Section Builder: How to Edit Your AI Sections

      Sometimes, after creating a section with Tapita AI Section Builder, the result might not fully match your wants, or you may want to add additional configurations to that section. This guide will show you how to edit your AI-generated sections — ...

    • Getting Started: Adding Your First Tapita Section

      Understanding Theme Sections Theme sections are modular, customizable elements within Shopify theme templates. These sections provide merchants with the ability to design and structure the content of their online store pages without requiring direct ...

    • Cleanup section builder code

      1. Backup the current website Select your current main theme that you are using: Choose Duplicate (To ensure that you can revert if you have any mistake when follow our guide) Waiting for the progress 2. Cleanup the code of our section builder tool ...

    • Customizing the Testimonial Section

      Testimonial Section Overview In Shopify stores, displaying customer testimonials is essential for building trust and social proof. Tapita's Testimonial Section provides a modern and visually appealing way to highlight these testimonials, enhancing ...

    • Customizing the FAQ Section

      FAQ Section Overview In Shopify stores, FAQ sections are commonly used to address customer inquiries, reduce support requests, and improve the overall customer experience by providing quick access to answers for frequently asked questions. Tapita's ...