Using AI-Generated Sections to Build Your Store (Limited Access) – SHOPLINE Help Center

The AI-Generated Component feature in the theme editor allows you to create customized web sections, such as Image banners or Promotional areas, simply by entering text prompts—no coding knowledge required. This can help simplify the store design process and make it easier to create sections tailored to your needs.

This article will guide you through the setup process and key considerations for using AI-generated sections.

Note: This feature is currently in the Beta testing phase and is available to selected merchants only. If you do not see this option in your theme editor, please contact your SHOPLINE account manager to request access.

AI-Generated Component Features

AI-generated sections offer a flexible and efficient way to build your store's layout. By utilizing AI models, you can create and manage custom sections that are consistent across your entire brand.

No Apps Required: Unlike sections created by Section Gallery app, this feature is natively integrated into the theme editor. No additional app installations are needed.
Store-Wide Sharing: Once an AI section is generated, it becomes a reusable block available across your entire store. You can apply the same section to any existing or future OS 3.0 themes within your store without re-generating it.
Real-Time Preview & Generation: The AI assistant generates the code and renders the section in real time, allowing you to preview the layout before finalizing.

Note: Please stay on the current page and do not refresh your browser or close the theme editor window during the generation process; otherwise, the procedure will be terminated.
No Impact on Theme Updates: Using AI-generated sections will NOT turn your theme into a "custom theme." Your theme remains an official version, allowing you to continue receiving automatic or manual version updates from SHOPLINE.

Setting Up AI-Generated Sections

The AI assistant simplifies the creation process by transforming your ideas into functional web sections. Follow the steps below to generate and customize your AI sections directly within the theme editor:

From your SHOPLINE admin panel, go to Online Store > Design > My theme. Choose a compatible OS 3.0 theme (including Official, Third-party, and Custom themes) and click Design to enter the theme editor.
In the theme editor, locate the page where you want to add the section (for example, the Home page).
In the left-hand sidebar, click + Add component and select the AI assistant entry. This will open the interactive AI generation window.
Once the window appears, provide a prompt for the AI:
- Select a preset example prompt from the system for a quick start.
- Or, manually enter a detailed description of the section you want to create (for example, "A carousel banner with three images and a call-to-action button").
Click the Generate button to start the process. The AI will generate the code and render the section in real time. This allows you to preview the layout before it is finalized.
After the section is generated, select it to customize details in the settings panel. You can refine the content, colors, and layout just like any other standard section.
Click Save to apply your changes.

How to Use Generated AI Sections

AI-generated sections are highly flexible. Once created, they can be reused across different themes and pages without re-entering prompts.

Scenario 1: Across Different Themes (From Theme A to Theme B): If you generate an AI section in Theme A (e.g., Fashion), you can use it in Theme B (e.g., Sipply, as long as it is an OS 3.0 theme). Simply click + Add component in Theme B and find the section name in the search box or list to add it directly.
Scenario 2: Across Different Pages (e.g., From Page A to Page B): An AI section created on any page template (such as the Home page) can be easily applied to other pages (such as Collections page) via the + Add component menu, ensuring brand consistency across your store.

Translating Text in AI-Generated Sections

Once you've created and saved an AI-generated section, you can translate its text using the UGC Multi-Language Visual Translator.

Note: Only text that has been manually edited and saved will appear in the UGC Multi-Language Visual Translator and the corpus export feature under Language settings. If you haven't edited the section's default text, edit it (for example, change the wording or type a space) and save the section again before translating.

To translate the text in a section:

Go to the UGC Multi-Language Visual Translator app.
Find the corresponding section and the text you want to translate, then translate it.
Save your changes once translation is complete.

Note: For detailed instructions on using the UGC Multi-Language Visual Translator, refer to "UGC Multi-Language Visual Translator: Adding and Managing Store Content Translations.".

Regenerating an AI-Generated Section

If you’re not satisfied with an AI-generated section, there’s no need to reenter the full prompt or start over — you can build on your original prompt to have the AI regenerate and refine the section. The system remembers the prompts you’ve entered previously and appends new prompts to them before sending them to the AI. In other words, each new prompt adds to the previous ones rather than replacing them. For example:

Round 1: "Generate a carousel banner."
Round 2: "Support 4 banner images"; the prompt actually sent to the AI is "Generate a carousel banner, support 4 banner images."
Round 3: "Also support video"; the prompt actually sent is "Generate a carousel banner, support 4 banner images, also support video."

After a section is generated, the editor records and displays the prompt you used for that round. It’s collapsed by default — click to expand, and if the content is long, you can scroll within the expanded view. If you’ve regenerated a section multiple times, the editor will only show the prompt from the most recent successful generation.

Note: Within the same theme, only one section can be generated at a time (whether it’s a first generation or a regeneration). If you try to regenerate a different section while another is still generating, the system will temporarily disable the send button and show: "There is already a section generation task in progress. Please wait until it completes before retrying."

What Happens If a Regeneration Fails

If a regeneration attempt fails, the section’s previously successful version is not affected:

The section list on the left will still show the section’s original name — it will not display as "Generation Failed."
The settings panel on the right will show the configuration from the last successful generation, along with the prompt input box.
The prompt input box will show the prompt used in the last successful generation above it, while the box itself retains the input from your failed attempt so you can edit it and try again.

Deleting an AI-Generated Section

If you no longer need an AI-generated section in your store, you can delete it directly from the section list in the theme editor.

Find the AI-generated section you want to delete in the section list. Hover over it, and a ••• (More actions) icon will appear on the right; click it and select Delete section.
In the confirmation dialog "Delete AI-Generated Section?", click Confirm delete to complete the deletion.

Important Notes:

Because AI-generated sections are shared across themes, this action will remove the section from all theme templates in your store that use it, and this cannot be undone.
If other themes also use this section, after deletion those themes’ section lists will show it as Deleted. Clicking a Deleted component will prompt: "This AI-generated section has been removed. Do you want to delete it from the current theme as well?" Confirming will remove the section from the current theme’s list too.

Considerations and Limitations for AI-Generated Sections

To ensure optimal performance and a smooth design experience, please keep the following technical requirements and regional restrictions in mind.

Theme Compatibility: This feature is exclusively available for OS 3.0 themes. Older theme versions do not support AI-generated sections.
Limited Access: This feature is currently in the Beta testing phase and requires whitelisting. To request access, please contact your account manager.
Section Limit: Because AI-generated sections are store-level and shared across all OS 3.0 themes, each store can save up to 50 AI-generated sections.