Back to Top

Custom Product Builder App for Shopify

Updated 18 September 2023

In today’s highly competitive online retail market, it’s essential for businesses to stand out and offer unique, customizable products to their customers. That’s where our Custom Product Builder app for Shopify comes in. This app allows store owners to easily offer personalized options for their products, from adding custom text or images to selecting specific colors or materials. With a custom product builder app, businesses can create a more engaging and interactive shopping experience for their customers, ultimately leading to increased sales and customer satisfaction.

In this article, we’ll explore the workflow and features of our custom products builder app for Shopify. Also, analyze how it can help businesses differentiate themselves in a crowded market.

Installation

Use this link to install the app on your Shopify store- https://apps.shopify.com/webkul-custom-product-builder

Workflow

Once you install the app, you need to select a plan and make the payment. Then you will be able to see the app here in your Shopify store

custom product builder app

On clicking it you will be redirected to this page

Start your headless eCommerce
now.
Find out More
landing page

Dashboard

First of all, you will be redirected to the Dashboard. It will display the list of all the recently added products and orders.

the dashboard

Products

To add products to the app, click on Import Products. Select the products you want to import to the app from Shopify. The maximum allowed limit for importing products will vary depending on the plan you have chosen.

import products

After the products have been imported into the app, you need to enable the “Customizable” tab

products- Custom Product Builder app for Shopify

Then, click on the three dots(…) under Action, and click “View details”

products- Custom Product Builder app for Shopify

Now, you will be redirected to the page shown in the below image. Here, you need to enable the “Customizable at fronted” tab and upload catalog images for the product. Set the image for the Front and back sections. You can also enable/disable the Front and Back sections of the products for customization according to your preference. Then, choose whether to allow the customers to only upload customized images or text or both. You can also set the Price for both sections.

custom product

Note-  Catalog images will be shown to the customer on the Product customization page in which the customer can overlap the chosen image/text.

Configuration

In the Configuration, there are mainly two sections- Select Supported Fonts and Currency Format.

configuration- custom product builder app

Here, you can select the fonts that you want to be available for your customers and set the currency format that will be visible to the Customers at the front end.

Store Front Configuration

In this section, you will find the two distinct methods for incorporating the “customize product” button.

Method 1

Through this method, you can add the Customize product block to your Shopify theme.

screenshot_1694173974807

To do that, go to the customize theme page >>Go to the product details page >>Add the Customise Product Block using the “Add block” option under the Template category.

storefront-config-guide

Method 2

Here, you get the code snippet that you need to Copy and paste into the Shopify product.liquid or main-product.liquid file where you want to add the customize product button

store front config- custom product
embed-code-guide

Customer End

When the customers will visit your product, they will see a Customize button just below the Buy Now button.

Custom product

When customers click the Customize button, the system will redirect them to the next page, and they will see options to add text and images to both the front and back sides of the product. They can also choose the font style, font size, and font color.

custom product builder
custom product builder

Customers have the option to incorporate personalized text and upload custom images to enhance their personalized experience.

custom product builder

After choosing these details and entering the Custom text or uploading Custom Image, they will get the option to set its position, as shown in the image below-

custom product builder
custom image- product builder

Now they can proceed to buy the product. This is all for the Custom Products Builder App.

Need Help?

In case you need any kind of support, just raise a ticket at https://webkul.uvdesk.com/en/. 
Also, you can contact [email protected] to get proper assistance.

Thank you for taking the time to read this blog.

Demo Details

You can follow the below link to use the demo of the Custom Product Builder app:

https://custom-product-builder-demo.myshopify.com/

Password: 1

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

Back to Top

Message Sent!

If you have more details or questions, you can reply to the received confirmation email.

Back to Home

Table of Content