Template builder: Difference between revisions
mNo edit summary |
|||
(4 intermediate revisions by the same user not shown) | |||
Line 37: | Line 37: | ||
After adding your prebuilt sections, hit '''Create''' menu in the top left. | After adding your prebuilt sections, hit '''Create''' menu in the top left. | ||
[[File:Template-builder- | [[File:Template-builder-step3b.jpg|800px|frameless]] | ||
'''Step 4''': Fill in the template name. | '''Step 4''': Fill in the template name. | ||
Line 50: | Line 50: | ||
After clicking '''Submit''' in Step 4, your new template will be created, and you'll be redirected to the Theme Editor to edit and add more sections. | After clicking '''Submit''' in Step 4, your new template will be created, and you'll be redirected to the Theme Editor to edit and add more sections. | ||
[[ | {{Note|IMPORTANT: At this stage, the new template isn’t assigned to any page yet, so you can only preview it in the Theme Editor. To see it on your storefront, assign it to your desired page following [[Create_Template_Apply_to_Multiple_Pages#How_to_assign_a_template_to_one_product|this guide]].|reminder}} | ||
[[File:Template-builder-step5b.jpg|800px|frameless]] | |||
===Add & configure prebuilt sections=== | ===Add & configure prebuilt sections=== | ||
Line 59: | Line 59: | ||
[[Add_section_settings#Edit_Section_Settings|Global configurations]] using Section Settings that include: | [[Add_section_settings#Edit_Section_Settings|Global configurations]] using Section Settings that include: | ||
Add multi-column layouts | *Add multi-column layouts | ||
Add the background image | *Add the background image | ||
Add the background video | *Add the background video | ||
Adjust the background color | *Adjust the background color | ||
Adjust the background container color | *Adjust the background container color | ||
Adjust the text color | *Adjust the text color | ||
[[Add_section_settings#Extra_Customizations|Extra customizations]] that include: | [[Add_section_settings#Extra_Customizations|Extra customizations]] that include: | ||
How to set up a full-width section | *How to set up a full-width section | ||
Add Colorful Sections | *Add Colorful Sections | ||
Create an overlapping layout | *Create an overlapping layout | ||
Adjust space between columns and rows within a section | *Adjust space between columns and rows within a section | ||
Adjust the top/bottom padding and margin between sections | *Adjust the top/bottom padding and margin between sections | ||
==Next Steps== | |||
=====Add Sections===== | |||
Now that you've added the first template using Easy Content Builder, it's time to begin adding sections to that template. Find out [[Add_section_settings|how to add your first section here]]. |
Latest revision as of 09:37, 16 June 2025
Who is this guide for?
Use the Template Builder to add prebuilt sections and create templates for any page you want.
The Template Builder helps you:
- Get to know the Easy Content Builder app quickly.
- Combine different prebuilt sections to try out new page layouts.
Template Basics
If you're new to Easy Content Builder, we suggest checking out this guide to learn about:
- What a template is in Shopify
- How to see which templates are applied to which pages?
Create your first template
Step overview:
- Select prebuilt sections from our library of 238+ (5 for Free plan, 12 for Pro plan).
- NOTE: You can add all PRO sections and edit in the Theme Editor, but you'll need to upgrade to see them on the front end.
- After creating your template, add more sections through the Theme Editor as needed.
- Assign the template to any page, product, or blog post and view it in your storefront.
Step 1: Go to Apps > Easy Content Builder > Template Builder.
Step 2: Click on Select a preset, choose your prebuilt sections, and hit Add to template. The selected sections will appear in the left-side preview.
- NOTE:You can add up to 5 sections (Free plan) or 12 sections (Pro plan) from our 238+ library. You can add more sections later using the Theme Editor.
Step 3: Click Create menu
After adding your prebuilt sections, hit Create menu in the top left.
Step 4: Fill in the template name.
- Specify the page type you want to assign to this template: Product, Page, or Blog post.
- Then enter a template name (3-15 characters, using letters, numbers, underscores, and hyphens).
Step 5: Preview and edit the template
After clicking Submit in Step 4, your new template will be created, and you'll be redirected to the Theme Editor to edit and add more sections.
Add & configure prebuilt sections
Now that you’ve created your first template with prebuilt sections, you can add more from our library of over 238 sections or create your own custom sections. We suggest checking out the helpful guides below to enhance your template further:
Global configurations using Section Settings that include:
- Add multi-column layouts
- Add the background image
- Add the background video
- Adjust the background color
- Adjust the background container color
- Adjust the text color
Extra customizations that include:
- How to set up a full-width section
- Add Colorful Sections
- Create an overlapping layout
- Adjust space between columns and rows within a section
- Adjust the top/bottom padding and margin between sections
Next Steps
Add Sections
Now that you've added the first template using Easy Content Builder, it's time to begin adding sections to that template. Find out how to add your first section here.