How to remove the word "EUR" in the price list of of sub products?

Also: as you can see (encircled in blue) the prices are with the € sign, as well as the word EUR (same in American-English: $ sig and USD). Is it possible to use ONLY the € sign?

If you would like to remove the word "EUR" in the list of prices in the sub products. Then you can use this custom CSS code:

/*Hide all default pricing on the sub products*/

.form-product-child-table > tbody > tr > td:nth-child(2) > span {

    display: none !important;

}

 

/*Format the next text under the price column in the sub product list*/

.form-product-child-table > tbody > tr > td:nth-child(2):after{

    font-size: 0.786em;

    font-weight: bold;

    font-style: italic;

    font-family: "Lucida Grande", sans-serif;

}

 

/*First product group*/

#input_3_1005_subproducts > tbody > tr:nth-child(2) > td:nth-child(2):after {

    content: "€ 3,50";

}

#input_3_1005_subproducts > tbody > tr:nth-child(3) > td:nth-child(2):after {

    content: "€ 3,70";

}

#input_3_1005_subproducts > tbody > tr:nth-child(4) > td:nth-child(2):after {

    content: "€ 3,70";

}

#input_3_1005_subproducts > tbody > tr:nth-child(5) > td:nth-child(2):after {

    content: "€ 3,90";

}

 

/*Second Product Group*/

#input_3_1006_subproducts > tbody > tr:nth-child(2) > td:nth-child(2):after {

    content: "€ 4,00";

}

#input_3_1006_subproducts > tbody > tr:nth-child(3) > td:nth-child(2):after {

    content: "€ 4,80";

}

#input_3_1006_subproducts > tbody > tr:nth-child(4) > td:nth-child(2):after {

    content: "€ 4,90";

}

#input_3_1006_subproducts > tbody > tr:nth-child(5) > td:nth-child(2):after {

    content: "€ 4,10";

}

#input_3_1006_subproducts > tbody > tr:nth-child(6) > td:nth-child(2):after {

    content: "€ 6,40";

}

#input_3_1006_subproducts > tbody > tr:nth-child(7) > td:nth-child(2):after {

    content: "€ 3,30";

}

#input_3_1006_subproducts > tbody > tr:nth-child(8) > td:nth-child(2):after {

    content: "€ 3,70";

}

#input_3_1006_subproducts > tbody > tr:nth-child(9) > td:nth-child(2):after {

    content: "€ 5,30";

}

 

/*Third Product Group*/

#input_3_1007_subproducts > tbody > tr:nth-child(2) > td:nth-child(2):after {

    content: "€ 5,60";

}

#input_3_1007_subproducts > tbody > tr:nth-child(3) > td:nth-child(2):after {

    content: "€ 5,70";

}

#input_3_1007_subproducts > tbody > tr:nth-child(4) > td:nth-child(2):after {

    content: "€ 4,00";

}

#input_3_1007_subproducts > tbody > tr:nth-child(5) > td:nth-child(2):after {

    content: "€ 6,80";

}

#input_3_1007_subproducts > tbody > tr:nth-child(6) > td:nth-child(2):after {

    content: "€ 6,30";

}

#input_3_1007_subproducts > tbody > tr:nth-child(7) > td:nth-child(2):after {

    content: "€ 6,00";

}

#input_3_1007_subproducts > tbody > tr:nth-child(8) > td:nth-child(2):after {

    content: "€ 5,80";

}

#input_3_1007_subproducts > tbody > tr:nth-child(9) > td:nth-child(2):after {

    content: "€ 4,90";

}

#input_3_1007_subproducts > tbody > tr:nth-child(10) > td:nth-child(2):after {

    content: "€ 5,50";

}

#input_3_1007_subproducts > tbody > tr:nth-child(11) > td:nth-child(2):after {

    content: "€ 5,40";

}

#input_3_1007_subproducts > tbody > tr:nth-child(12) > td:nth-child(2):after {

    content: "€ 5,90";

}

#input_3_1007_subproducts > tbody > tr:nth-child(13) > td:nth-child(2):after {

    content: "€ 4,30";

}

 

Here's my cloned form with that CSS code: https://form.jotform.com/61534644356963. This is how it looks like in my end:

Please do double check if the prices are correct.

Let us know if that works.

Thanks for your solution, but the form I am working on is much longer in the items to be ordered than the one you used (11 subcategories and a total of 74 products).

Is there a solution that I can change € and EUR to a single € in one modification? that would also be useful when I might add products to my form, because I then do not need to add the extra lines to the CSS.

Unfortunately there is not an automatic way of hiding the word Euro. In case of the sign € it is pretty clear and does not need additional explanation, but it is important to understand that with the sign $, it can be connected with many currencies, so additional text is needed. 

I will still forward a request to our developers, so they might consider the implementation of such an option.

We'll contact you via this thread if we decide on its implementation.

Let us know if we can assist you further.   

I used a different solution, just in a short CSS Style:

 

.form-product-details span {

    position: relative;

    margin-right: -27px;

    background-color: white;

}

 

The "margin-right: -27px" is found in a trial-and-error way and has (of course) to do with the font and fontsize used.

 

Thank you for the update and for sharing your solution. However, when I tried to apply the CSS codes you provided to a clone version of your form it only changed this part (Please see image below).

I have found a solution using CSS codes also that may resolve your concern.

span[id*='input_3_100'][id$='_price']{

    position: relative !important;

    visibility: visible !important;

    left: -10px !important;

}

span[id*='input_3_100'][id$='_price']:before{

    content:"€ " !important;

}

span.form-product-child-price.form-product-child-label {

    visibility: hidden !important;

}

span.freeCurr{

    visibility:hidden !important;

}

Here's the form I have used for testing: https://form.jotform.com/61695531752966

You may also add the codes below to fix the Total.

.form-payment-price{

    visibility: hidden !important;

}

#payment_total{

    visibility: visible !important;

}

#payment_total:before{

    content:"€ " !important;

}

I hope this helps. Please feel free to let us know if you have any questions with the solution I have provided above. 

Thank you.

Thanks for your solution. I placed your CSS code in my form, but it did not work. Perhaps this has to do with the fact that I cloned and changed my form. I am now using https://form.jotform.com/61541543354351 as my form.

Could you provide me with the CSS code for this form that would make a solution for the word EUR?

Thanks!

Please try this CSS codes on your form https://form.jotform.com/61541543354351

 

span[id*='input_3_1008'][id$='_price']{

    position: relative !important;

    visibility: visible !important;

    left: -10px !important;

}

span[id*='input_3_1008'][id$='_price']:before{

    content:"€ " !important;

}

span.form-product-child-price.form-product-child-label {

    visibility: hidden !important;

}

span.freeCurr{

    visibility:hidden !important;

}

 

.form-payment-price{

    visibility: hidden !important;

}

#payment_total{

    visibility: visible !important;

}

#payment_total:before{

    content:"€ " !important;

}

 

 

This is my version of the form https://form.jotform.com/61714303320946 . You can check and test it to see the CSS codes work as intended.

Let us know if still did not work for you.

Thanks.

Alright, but the way you solve it, the notification of prices dissapears completely!

See image.

Thank you for providing the screenshot and I apologize for the mistake.

I just checked again and I see the problem now as well.

 

Let me check how it can be fix. I'll get back shortly.

Thanks.

Please check again my test form https://form.jotform.com/61714303320946

 

 

I cleared the other CSS codes and used only this http://pastie.org/10884169

I suggest also you clone the form so that we can work on the cloned version without worrying about your live form.

Let us know how it goes.

Thanks.

 

It is getting better, but your solution only works for a part of my form?
I cloned the form; the clone is: form 61714829980365.
As you can see in this cloned form, it works for the first 4 Sub-Categories; after that the price is gone.
Moreover: there already was a problem with the columns not lining, and now that has become even more!

I am not quite sure what kind of text-alignment you would like to have. Based from your form, the product description/name for each sub product is aligned to the right. 

I cloned your form and made some edits, see if this one works for you: https://form.jotform.com/61715187601959

If so, you can clone it and copy the CSS code directly there.

Let us know if that helps.

Aha, that's nice! Not exactly, but good enough (I sometimes use a screen measure tool, called Meazure, with which amongst others I can place grid over my screen to see how items are placed).

I will go on with your solution.

Thanks for your effort.

I'm glad to hear that it worked for you. If you needed some adjustments on it, please do let us know.

For other concerns or questions, feel free to open a new thread here in the forum.

Thank you.

Thanks again! I finally had the time to implement your code in my form and it worked fine.

Thanks for your contribution!

You are most welcome, please let us know if you have any other query.