How can I remove the GBP text on the Square payment field

It already has the £ sign so the currency is repeated twice, it looks daft.

Can GBP be removed? 

I can't seem to remove it using CSS. I will need to do further test.

Any effort is greatly appreciated. Thanks Marvih

Hey @movz - The GBP part is not an HTML element, it's just a text node so it can't be styled and manipulated with CSS. So, here's the workaround I came up with:

https://www.jotform.com/80187140343955

I placed the actual prices on the PRODUCT NAME and hid the product details (all of it) using CSS. So, instead of just hiding the GBP part, I hid the entire price + GBP (e.g. £98 GBP).

After placing the prices on the PRODUCT NAME, inject these CSS codes to your form to hide the rest:

.form-product-details {

    display: none;

}

Complete guide: How-to-Inject-Custom-CSS-Codes

Result:

Thanks Jim awesome work!!!

Just one more thing. The total still have the GBP displayed can it also be removed with css and how to add that? I'm a newbie css.

.form-payment-price  {

    display: none;

}

Just removes the whole price...

Unfortunately the only way to remove the total with GBP is getting your form's source code, removing the "GBP" text in the code and embedding the code to your website.

You can check the thread by my colleague here. https://www.jotform.com/answers/150327-change-color-of-price-remove-USD

I have tried covering the text with css codes but it will only overlap when the purchase is higher.

.form-product-details:after,
.form-payment-price:after {
   content : "";
   position :absolute ;
   width : 50px;
   height : 20px;
   margin-top: -15px;
   margin-left : 33px;
   background-color : white;
}

See screen cast.

Hope you find this information useful.

Please let us know if you have further questions.

Thanks for trying, really appreciate this.

I take this is not under Jotform's control then, if it is this should be an easy changeable non-source code option, unless of course it's Squareup?

The integration seems to be done that way. But since it is handled by a Script code, then the only way to modify it is by modifying the script itself on the source code.

You can apply some CSS tricks to cover it like what my colleague Ritchie P did.