Live Demo Buy Now

Magento 2 Custom Option Stock & Images

Custom Option Stock & Images for Magento 2: Now display text swatches for custom options selection to your customers on simple, virtual, and downloadable product types. For each custom option, the admin can manage inventory, weight, and also upload an image. Multiple swatches can be displayed are synchronized to display the corresponding product image when a swatch option is chosen.

Module Features

  • This module is compatible with simple, virtual & downloadable products types.
  • Admin can set stock for each option
  • Admin can set to show custom option as swatches
  • Dynamic product image based on the selected custom option combination
  • Show custom option as text swatch
  • Set swatch and custom option labels
  • Manage inventory on purchases and return
  • Ajax based module, so no page reload
  • Mention weight for every custom option variant
  • The source code is fully open for customization


Installation – Custom Option with Stock and Images for Magento 2

Customers will get a zip folder and they have to extract the contents of this zip folder on their system. The extracted folder has an src folder, inside the src folder you have the app folder. You need to transfer this app folder into the Magento2 root directory on the server as shown below:

After the successful installation, you have to run these commands in the Magento2 root directory.

First Command – php bin/magento setup:upgrade

Second Command – php bin/magento setup:di:compile

Third Command – php bin/magento setup:static-content:deploy

After running the commands, you have to flush the cache from the Magento admin panel by navigating through ->System->Cache management as shown below in the snapshot.


Multilingual Support

For the multilingual support, the admin will navigate through Store->Configuration->General ->Locale Options and select the locale as German (the language into which admin want to translate his store content).

Module Translation

If user want to translate their module from English to German then they need to follow the path app/code/Webkul/OptionsWithStockAndImages/i18n in their unzipped Magento 2 OptionsWithStockAndImages folder and will get a csv file with name “en_US.csv”. Now they will rename that csv as “de_DE.csv” and translate all right side content after comma in German language. After editing the CSV, save it and then upload it to the path app/code/Webkul/OptionsWithStockAndImages/i18n where they have installed Magento2 on the server. The module will get translated in German Language. It supports both the LTRand RTL languages.

Product Configuration

After successful installation of the module, the admin navigates through the Catalog->Products, & in order to use the custom options, the admin needs to create a new product or can use an existing product.

Now the admin edits the product and selects the customizable options. From here the admin can Add options, Manage the swatch & Manage variation.

Add Option

Here the admin enters the “Option Title”, select “Option Type” ( This module only works with Dropdown & Radio Buttons ) add multiple values for the specific option created and select the “Required” checkbox.

Note:- Its required to tick on the “Required” checkbox, then only you can “Manage Swatch” & “Manage Variation”.

 As shown in below screenshot.

Manage Swatch

The admin can manage the text-based swatch from here that is which option label the admin wants to display on the product page.

Manage Variations

After creating the options with multiple option values, the admin will click on “Manage Variations” from where admin can create multiple variations as per the different options accordingly.

Here the admin can insert a specific image to the variation, can add weight to the variation.

And the best part is you can enter the stock against specific variation created. And accordingly, the stock total of all the created variations will be automatically synced up with the base product global quantity.

After managing the variations admin will save the product.

Customer end

The text-based swatch custom options are visible under the product view page.Here, the customer will select the product as per the desired variation & proceed to checkout by adding products to the cart.

Now after adding product to the cart, customer will proceed to check out, enter the shipping details & proceed to the payment review page.

Now here, the customer will choose the appropriate payment method and place the order successfully.

After order have been placed, the customer will receive a confirmation email with all the order details.

PRODUCT Configuration

After the order has been placed, the product inventory will automatically get synced both in specific product variation & the global quantity of that particular product.

As shown in below screenshots.

  1. For Global Quantity.

2. For Specific product variation quantity.


After the customer had successfully placed the order. The admin can create the Invoice & the shipment of the ordered product and complete the order.


Now if the customer desire to return the product then the admin will have to create a credit memo for the same order. In that, the admin needs to enter the “Qty to refund” and select the “Return to stock” checkbox and click on the “Refund offline” option. This will create a credit memo for the order, and after creating the credit memo, the inventory for the returned product will automatically get updated both in global quantity for the base product as well as for the specific product variation.

The created credit memo can be seen under “Sales”-> “Credit Memos”, here the admin select the created memo and can view the details of the refunded order.

Now the inventory for the returned product will automatically get updated both in global quantity for the base product as well as for the specific product variation.

For this find the screenshots below.

  1. For global quantity.

2. For specific product variation


Current Product Version - 2.0.1

Supported Framework Version - 2.0.x,2.1.x,2.2.x

. . .


Add Your Comment

Be the first to comment.

Hire Us!
Brief us about your requirements and we'll get back to you.
Woo! Hooy!
We have just recieved your project brief and our expert will contact you shortly.
Send Again