Back to Top

Custom Product Options: Multi-vendor Marketplace for Shopify

Updated 23 May 2024

The Multi-vendor Marketplace app has now come up with the custom product options feature. With this featured app, you can allow sellers to add custom options to products that they sell on your marketplace.
Thus, let the customers provide additional information about the product while purchasing it.

Features

  • Let customers add additional information about the products while purchasing it.
  • Allow customers to make more choices while purchasing a product.
  • Provide a better shopping experience for your customers.
  • Get a boost to your online sales.
  • Enable Toggle Checkbox and let customers pay for the custom options added.
  • Drop-down option is now available.

PLEASE NOTE- Now, if you want to get the product custom options on Shopify, then you can access them through the product metafields.

Limitations

There are certain limitations of this featured app:-

  • Cart Type should not be “Drawer”.
  • Up to 10 Custom options can be added for a single product.
  • Drop-down has limit of 5 options.
  • Make sure that you have disabled the notification option on your Shopify store when a product is added to the cart.

    Go to Theme Editor>>Theme Settings>>Select “Cart” from drop-down>>Click Add to cart notification>>Disable the option “Show notification when item is added to cart”.
sharecartdemo-Customize-Debut-Shopify
  • You can create a maximum of 10 custom options for a product.

Now you can check the video tutorial on Youtube and here as well.

4nkDU5xaPi4

Enable the Feature App

Visit the Feature app section and enable the Custom Options feature app.

Searching for a Shopify
Headless solution ?
Find out More
Dashboard

Visiting the feature App section, search for the featured app & enable it.

Screenshot-97

Click the Enable button to activate the Custom Option feature app.

Configuration

To allow sellers to add custom options to the products, firstly you need to enable the configuration from the Product Configuration menu of the app.

Dashboard-Admin

Now, enable the tab “Allow Sellers to Add Custom Options to Products“.

Once enabled, both you & your sellers will be able to add multiple custom product options while adding or editing a product.

Product Configuration

How to Add the Custom Product Options?

ADMIN END

  • On the Multi-vendor admin panel, go to the Products.
  • Click the Product Listing menu under Products.
  • Click the Add Product button.
product listing
  • Now, scroll down to the bottom and add the custom options.
    This feature app provides 4 different ways to display your seller’s products with custom options i.e. Text, Text Area, Toggle checkbox, DropDown.
Add-Product-Admin333

SELLER END

Similar to the admin, the seller can also add the custom product options to their products published on the admin’s marketplace.

  • For that, the seller needs to login to his/her seller panel.
  • After that, go to the “Products” and click “Product Listing” to get the option to add/edit a product.
  • Clicking the “Add Product” button, the seller will get redirected to the “Add product form” and fill the required form.
  • Scrolling-down to bottom, the seller will have the option to add multiple custom product options.
77

NOTE:- Single quote(‘), double quote(“), double colon(::), comma(,) are not allowed in the field name.
Instead, you can use a vertical bar/pipe (|) as a separator.

Lastly, click the save button.

Now, to display the same with the product on the store-front, you need to add a code to the respective liquid file. To get the code, please visit the “Instruction for Marketplace” section.

Configure Front

To configure your store-front, you need to follow the below-given steps:

  • Go to the Multi-vendor Admin Panel.
  • Visit the “Instruction for Marketplace” under the Configuration menu.
  • Get the code.

Copy the below-given code and add it to product.liquid template file inside the form tag:

{% render 'wk-product-custom-option' %}

In case, you haven’t found the required template file? – Click on the ‘Regenerate‘ button to create a new one.

Instructions-Admin

And that is how it appears on the store-front:

Coffe-Mug-–-sanjay-store-zip_code222

After filling all the custom information for this product, the customer will add this product to the cart. Thus, they can view the added information on the cart page also.

Your-Shopping-Cart-–-sanjay-store-zip_code

Now, once this product is ordered, both you and your sellers can view the custom information about the product on the order detail page.

Order-Details-Seller-•-Multivendor-MarketPlace-6

Toggle Checkbox As Custom Option

You can now have the Toggle Checkbox as an “input type” for a custom option added to a product. While adding a custom option to a product, you can enter the field name and choose Toggle Checkbox.

Now, in case you want to charge an additional amount for the custom option, enable the price option, and enter the amount you want to charge in addition to the product price.

Example:-
Let Suppose, you sell watches on your store. You want to provide a custom option on a product to let customers purchase products with warranties.

In this case, you can add custom options to the product by enabling a Toggle Checkbox. Now, the customer who wants to purchase the product with a warranty, can enable the checkbox and the warranty amount will be added to the product price at checkout.

You can add custom options while adding/editing products to your store. Go to Products>>Add Product/Edit Product>>CUSTOM OPTIONS>>Enter Field Name, Select TOGGLE CHECKBOX, Enable Price for Custom Option & Enter Amount you want to charge>>Save.

Edit-Product-Admin

To reflect this on the front end, you need to add codes provided in the “Instruction for Marketplace” menu in the app.

Instructions-Admin

If you don’t find the files, click the Regenerate button. In case you need help with the codes, you can drop a mail to [email protected].

After adding the codes, this is how it appears on the front end.

Metallic-Watches-–-surya-store20

To make this feature work with the split cart feature app, make sure to enable the product properties in the split cart configuration.

Screenshot-2020-09-02T181342.267

Mark Custom Options as Mandatory

Now, you have the option to mark custom options as mandatory, ensuring that customers cannot proceed without providing input or selecting a value. To make a custom option mandatory, simply check the “Keep the field mandatory for customers” option.

custom options mandatory

Once saved, the customers will not be able to proceed to the next step without input.

Demo

Check the demo of the Multi-vendor Marketplace App: https://multivendor-marketplace-5.myshopify.com/

If you need any kind of support, just raise a ticket at http://webkul.uvdesk.com/ or feel free to drop a mail at [email protected].

Hope you like this blog. Keep in touch with us for more interesting blogs.

. . .

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