Building your products

Start Building

Once installed, open the app from your Shopify admin dashboard and click the "Start Building" to commence building your custom product.

Product Information

It is recommended that you use this area on the page to give your customer clear instructions on how to build their custom product.

Name

Give your product a title. This is displayed to your customers.

Description

Details of product & need to know information for your customers.

Product image

Upload file directly from source or drop images to upload. This image will be used as the product thumbnail across the site (including featured sections, checkout) and in email communications.

Click 'add image' to upload from device

Top section layout

Set how the product images are displayed with the product description. Images can be set Full width, or inline.

Full-width - Images are displayed full-width above the product title and description. We recommend images to have a width of 1200px. See the example below:

Image stretches above the description of the product

Inline - Images are displayed next to the product title and description - the recommended dimensions are width 620px and height 620px. An example image is below:

Image is inline with the product description.

Ken Burns effect

Product settings

Set a base price for your product. It can be set to zero and then you can build the product price with each section.

You can also add a shipping weight and choose whether you want to charge your customers tax on the product. These selections will then use your standard Shipping and Tax calculation rules in your checkout.

The app does not control settings and functions inside the checkout. This page is controlled by Shopify and not the theme.

Base Price

Set a base price for your custom product.

Shipping costs

Any shipping costs involved with sending the product to international destinations can be edited here.

Tax

Change how tax is displayed and applied to the product.

Charge tax on this product - Enable to include tax in the total product price. A breakdown is viewable at the Checkout stage.

Display additional price with tax included - Enable to...

Create your sections

Create a series of sections for your customers to create and customise their product. For further information, see our guide on Section types below.

Product Configuration

Sections for your product will display in a list.

You can edit details, reorder or remove sections. Re-order your sections for a product by clicking on the six horizontal dots on the left.

Conditions

Set conditions to hide options based on customer selections.

Page Layout

Select from 2 layout designs:

One Page Scroll - All of the sections will show on the same page, allowing customers to create their product as they scroll down.

Multi-section carousel - Sections will be presented to the customer one by one in a carousel and can be navigated using "previous" and "next" buttons.

Note:

To demonstrate Page Layouts, see our demo store below: Agile: One Page Scroll demo

Agile: Multi-section carousel demo

Quantity

Give customers the option to add multiples of their custom product to the cart.

Custom CSS

Add custom CSS to override the core CSS for Product Builder.