How To

How to remove custom options price from the dropdown in Magento 2

Understanding the customer needs and selling products according to that not only increase store sales but also helps to serve products accordingly. Magento 2 comes with preloaded options to create up to six different product types along with the custom options that allows the store owner to one product with multiple variations. By creating custom options from the backend, a store owner can sell various varieties of the product. But by default, Magento served these product options as a drop-down in the store front-end with name and price. But sometimes store owner is willing to hide those prices until a customer makes a selection from the product page, but there is no option in the store backend to do this.

To make it easier for you, here is the blog about “How to remove custom options price from the dropdown in Magento 2 product page”. For this purpose, you need to add this small piece of code to “select.pthml” file available inside your theme folder at below location.

app\design\frontend\Themes\yourtheme\Magento_Catalog\templates\product\…
…\view\options\type\select.phtml

 

Using this code will help you to hide custom options price in store frontend dropdown.
Lastly, Comment down below if you face an issue while using this code.
Happy Coding!

Click to rate this post!
[Total: 18 Average: 4.6]
Dhiren Vasoya

Dhiren Vasoya is a Director and Co-founder at MageComp, Passionate 🎖️ Certified Magento Developer👨‍💻. He has more than 9 years of experience in Magento Development and completed 850+ projects to solve the most important E-commerce challenges. He is fond❤️ of coding and if he is not busy developing then you can find him at the cricket ground, hitting boundaries.🏏

View Comments

  • Hi, is there any solution to remove the price from dropdown fields with bundle products in Magento 2?

    So, I just need to remove the “+Price” part of the field, and the total price should calculate normally.

    Thanks.

  • This is a great solution I’ve been look to remove the prices from the product options dropdown and this solution worked for me Thank you.

    Is there any way of keeping the Select Option instead of just having a blank selection box?

    • Sorted now. Change else if (selectedOption.indexOf('-') > -1) to else if (selectedOption.indexOf('-') > 0) .

      require([
      'jquery',
      'domReady!'
      ], function ($) {
      $(document).ready(function () {
      $('select.product-custom-option').change(function(){
      $('option').each(function(){
      var selectedOption = $(this).text();
      if (selectedOption.indexOf('+') > -1) {
      selectedOption = selectedOption.substring(0, selectedOption.indexOf('+'));
      $(this).text(selectedOption);
      } else if (selectedOption.indexOf('-') > 0) {
      selectedOption = selectedOption.substring(0, selectedOption.indexOf('-'));
      $(this).text(selectedOption);
      }
      });
      });
      });
      });

  • This is a great solution I’ve been look to remove the prices from the product options dropdown and this solution worked for me Thank you.

    Is there any way of keeping the Select Option instead of just having a blank selection box?

    • Change else if (selectedOption.indexOf('-') > -1) to else if (selectedOption.indexOf('-') > 0) .

  • This is a great solution I've been look to remove the prices from the product options dropdown and this solution worked for me Thank you.

    Is there any way of keeping the Select Option instead of just having a blank selection box?

  • Hello Dhiren Vasoya,

    You blogs are really helpfull for me tahnks a lot for that.

    I need your help. I want to make customisation select option to text box convert and when i write in textbox then give option as a suggetions. It it possible to make?

    Thank you in advance.
    Pratik Mehta

    • Yes, that's possible, but for that one you will need to make more customization where instead of dropdown it can show the textbox, and you can use jquery to auto populate the options.

  • Hello Dhiren Vasoya,

    You blogs are really helpfull for me tahnks a lot for that.

    I need your help. I want to make customisation select option to text box convert and when i write in textbox then give option as a suggetions. It it possible to make?

    Thank you in advance.
    Pratik Mehta

Recent Posts

How to Integrate ChatGPT with Laravel Application?

In this guide, we'll explore how to integrate ChatGPT, an AI-powered chatbot, with a Laravel…

2 days ago

What are Net Sales? How to Calculate Your Net Sales?

In the world of business, understanding financial metrics is crucial for making informed decisions and…

5 days ago

Magento 2 Extensions Digest April 2024 (New Release & Updates)

Welcome to the MageComp Monthly Digest, where we bring you the latest updates, releases, and…

5 days ago

The ABCs of Geofencing: Definition, Features and Uses

In this era, businesses are always on the lookout for ways to engage with their…

5 days ago

How to Delete Product Variant in a Shopify Remix App using GraphQL Mutations?

Managing a Shopify store efficiently involves keeping your product catalog organized. This includes removing outdated…

6 days ago

6 Innovative Tools Revolutionizing E-Commerce Operations

E-commerce has transformed the way consumers shop for products and services and interact with businesses.…

1 week ago