How can I hide the price difference displayed for Gravity Forms Option fields?

A simple snippet to remove the price difference displayed next to each choice for Gravity Forms Option fields.

gw-remove-pricing-labels

window.gform_format_option_label = function( fullLabel, fieldLabel, priceLabel, selectedPrice, price, formId, fieldId, index ) {
	return fieldLabel;
};

Getting Started

  1. Install our free plugin, Gravity Forms Code Chest.
  2. Copy and paste the snippet above into the “Custom Javascript” setting in your form’s settings.

For more options and examples of modifying Option labels, check out the Gravity Forms documentation for the gform_format_option_label.

Comments

    1. Samuel Bassah
      Samuel Bassah Staff February 1, 2023 at 5:23 am

      Hi James,

      The snippet works. I just tested it, and it works as expected. Please give it a try and see how it works.

      Best,

    1. Dario Space
      Dario Space Staff April 6, 2022 at 1:01 pm

      Hi Eni,

      It doesn’t seem to be working. Nice catch! I’ll pass this along to our dev team.

      Best,

  1. daniel parrott
    daniel parrott July 29, 2021 at 5:27 am

    This is exactly what I need. However, the snippet not only removed price, it also hides the image of the product on the option. How can I get by this problem?

    Reply
    1. Samuel Bassah
      Samuel Bassah Staff August 2, 2021 at 6:48 am

      Hi Daniel,

      I’m passing this request over to our developers to get their input on this. We’ll update this comment with a reply when we have a definite answer/solution.

      Best,

    1. Chris McCoy
      Chris McCoy April 9, 2020 at 1:54 am

      function gform_format_option_label( fullLabel, fieldLabel, priceLabel, selectedPrice, price, formId, fieldId, index ) { fullLabel = fullLabel.replace(‘+$’, ‘$’); return fullLabel; }

      this should work

  2. Chris H
    Chris H March 30, 2018 at 10:31 am

    Hi David, I’m looking at the below code you have provided but when I use this it hides all the product option fields prices, no matter what field ids I use. Field type is radio buttons if that makes a difference? Has the gravity forms core changed since you provided this? Please can you help me out? I’ve swapped the returns around so it only shows on the field IDs I put in.

    function gform_format_option_label( fullLabel, fieldLabel, priceLabel, selectedPrice, price, formId, fieldId ) { if( $.inAarray( fieldId, [ 62, 63 ] ) != -1 ) { return fullLabel; } else { return fieldLabel; } }

    http://snippi.com/s/y5h43hb

    Reply
  3. Tim
    Tim August 17, 2017 at 7:10 am

    Hi,

    This only removes from the product page, any idea how to remove from everywhere else, like the cart and checkout. Any ideas would be greatly appreciated. By the way this snippet works great!

    Cheers Tim

    Reply
    1. David Smith
      David Smith Staff August 17, 2017 at 11:21 am

      Hi Tim, I assume you’re using WC? If so, give this free plugin a try. It adds a setting to each field in the form editor field settings that allows you to remove the field from being output in the WC cart.

    2. Tim
      Tim August 17, 2017 at 11:52 am

      Hi David,

      Thanks for your response, that looks like a handy plugin. But I just want to remove the difference price that appears in the brackets i.e. (+25.00) and leave the option showing.

      Could this plugin be altered to have that as an option so an extra checkbox which says remove display price from checkout?

      Thanks for your help. Much appreciated.

    3. David Smith
      David Smith Staff August 17, 2017 at 1:45 pm

      It certainly could. I’d recommend hiring a developer to make such a customization. Codeable.io is a good resource for hiring freelancers for WordPress and Gravity Forms work.

  4. Vincent Escober Olaer
    Vincent Escober Olaer May 19, 2017 at 9:19 pm

    Thank you very much! This one worked well with our site. I’ve been long puzzled on how to turn that thing off.

    Reply
  5. Ciaran
    Ciaran November 15, 2016 at 6:27 am

    Hi David,

    Most of the functions provided are done by adding these to an HTML field in the Gravity forms itself. Is there a way I can simply use my child theme function file instead for these snipets such as the code for multiple fileds?

    Reply
    1. David Smith
      David Smith Staff November 15, 2016 at 7:45 am

      If you want to apply this globally you could include this in any script file that is being loaded by your theme. Alternately, you could use a hook like wp_footer to output a script block in your theme’s footer.

      The second bit would be accounting for the fact that each form has different field IDs. You would either need add all the possible combinations to your “global” code. So you would have to check for the form ID and then any of the possible field IDs you want to hide the labels for on that form.

    2. Ciaran
      Ciaran November 15, 2016 at 8:23 am

      That makes perfect sense David. Where I was going wrong is I was expecting that dropping in the function to one HTML in one form will affect all 3 forms I have. Instead I just added the custom fields per form and works a charm.

      However I will certainly try hook the function into the footer in the next site.

  6. Ciaran
    Ciaran October 16, 2016 at 9:34 am

    Hi David, this is fantastic. Many thanks for sharing this script. I have 2 drop down fields, and I would like that one of the dropdown fields retains the display of the value, while the other uses this script to hide the front end value. Is there a way that I can have this script only hide one of the dropdowns values?

    Reply
    1. Ciaran
      Ciaran November 1, 2016 at 8:49 am

      Apologies for the late response David. For some reason I did not see any notification that this was responded to.

      What I have at the moment is 15 fields, and I would like to hide the value of 3 of these 15 drop down fields. So I have used your method above and works fantastic. But I would like to do is add 2 more fields to be able to hide the value.

  7. Alan Masters
    Alan Masters September 28, 2016 at 6:20 pm

    Go to your Dashboard/Pages –> Open you cart page/edit —> then click on the option “code” in the editor and paste the code below between “” –> then save and that’s all. Reload the cart and then the prices between ($5,00) will be invisible but available for calculations. Open the page as normal. I hope the tip helps!

    jQuery(document).ready(function(){ jQuery( “.variation dd li, .variation dd p” ).each(function( index ) { html = jQuery(this).html(); var splitit = html.split(“(“); html = splitit[0]; jQuery(this).html(html); }); })

    Reply
    1. Chris
      Chris November 10, 2016 at 10:01 am

      Hi, same issue here: I create a HTML field and paste the code into the content field and after I save the form, the tags disappear and the code is truncated to: see the code below.

      Consequently, only the truncated code appears on the frontend on the form.

      I am running the latest GF 2.1.0.4.

      Strangely, I am also running the script on another website with GF and it works perfectly.

  8. susana
    susana August 2, 2016 at 12:50 pm

    Hi, Please. How can I hide the price from Gravity Forms PDF?, so will not appear in the pdf without need to custom CSS. Thanks :)

    Reply
    1. David Smith
      David Smith Staff August 8, 2016 at 2:55 pm

      Hi Susana, I haven’t personally used GF PDF so I’m not sure how this should be handled. Have you contacted their support team? It seems like something they would have an answer to.

    2. Chris
      Chris August 10, 2016 at 10:53 am

      Susana,

      I did a quick test with GravityPDF (I assume that’s what you’re using) using the core template Zadani. What you’re seeing is equivalent to {all_fields}. This will also so the preformatted product & pricing section – even in emails.

      Unfortunately you will not only need custom CSS but custom HTML & some PHP.

      You will want to create a custom template for the PDF output. This will allow you to hide what is seen.

      Let me know if you need help.

  9. Vlad_N
    Vlad_N July 29, 2016 at 10:23 am

    Hi there, thank you for this. However I stile have all custom fields shown on my email template sent to customer and received by admin. How can I remove some of them.

    For example I have: 1. Color variations (a,b,c) 2. Size variations(a,b,c) 3. weight Variations(a,b,c) 4. Prices(a,b,c)

    On my email sent to customer I want to see only chosen color variation and Size not price and weight.

    Thank you!

    Reply
    1. David Smith
      David Smith Staff August 8, 2016 at 2:51 pm

      Hi Vlad, we do not currently have a solution for this. Did you already ping Gravity Forms support?

    2. Tizio Caio
      Tizio Caio December 27, 2016 at 1:01 pm

      I am really sorry for asking this lately, but. How did you solve that issue? I mean i can see the code but where di you put it? Is there a filter or something?

    1. David Smith
      David Smith Staff August 8, 2016 at 2:29 pm

      This is probably something your host is doing to try and protect you from users posting <script>s to your site. You can alternately include the contents of the <script> tags anywhere else your theme outputs javascript.

  10. Cantin
    Cantin February 6, 2016 at 8:26 am

    i want to remove Gravity form product option pricing in Woocommerce Cart and in Woocommerce notification email too. How to do that?

    Reply
  11. Craig Tommola
    Craig Tommola February 1, 2016 at 10:16 am

    I’m actually looking to do something similar, and wonder if you could shed some light, as I’ve never used the gform_format_option_label bit before. I have a Single Product field that I’m using as a conditional discount (i.e. if you register before X date, save $25). But I’d love to have the “Price” label become “Discount” if the number is below zero. Thoughts?

    Much thanks CT

    Reply
    1. Craig Tommola
      Craig Tommola February 1, 2016 at 7:11 pm

      Figured it out. Add the following filter to your theme’s functions.php file:

      add_filter( ‘gform_product_price_13_133’, ‘set_price_label_1’, 10, 2 ); function set_price_label_1( $sublabel, $form_id ) { return ‘Discount’; }

      The _13 added to the gform_product_price specifies the form id. The _133 specifies the field id, on form #13. I named my function set_price_label_1 because I was going to add another filter for fields 135, 136, 137. Perhaps there’s an easier way to specify all four fields in the same filter, but I tried a couple and didn’t find it and this is such a minor aspect having 4 wasn’t a big deal.

    2. David Smith
      David Smith Staff February 1, 2016 at 8:11 pm

      Awesome! Glad you were able to figure this out. In regards to applying it to multiple fields, you can use the same function (if the logic is the same) and just add the the filter for each field.

      add_filter( ‘gform_product_price_13_133’, ‘set_price_label’, 10, 2 ); add_filter( ‘gform_product_price_13_134’, ‘set_price_label’, 10, 2 ); function set_price_label( $sublabel, $form_id ) { return ‘Discount’; }

Leave a Reply

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

  • Trouble installing this snippet? See our troubleshooting tips.
  • Need to include code? Create a gist and link to it in your comment.
  • Reporting a bug? Provide a URL where this issue can be recreated.

By commenting, I understand that I may receive emails related to Gravity Wiz and can unsubscribe at any time.

Grab a bundle of free Gravity Forms plugins

Enter your email and receive our most popular free plugins and snippets, plus access to hundreds of others.

This field is for validation purposes and should be left unchanged.