change color of price, remove USD

  • Profile Image
    Asked on November 22, 2012 at 04:53 PM
  • Profile Image
    Answered on November 22, 2012 at 05:07 PM


    To change color of product price, inject these codes to your form:


    .form-product-details {

    How to Inject CSS:


    As for removing "USD", there is no other way to do it aside from getting your form's source codes, removing the "USD" text in the codes,  and embedding the codes to your website.

    Let me know if you're okay with hosting the codes on your website so I can walk you through it.

  • Profile Image
    Answered on November 22, 2012 at 06:02 PM

    Hi, I am moving my site and do not see a way to embed the source code successfully. I'm using pagelines in wordpress.  IF you know of a way, pls do walk me through it.  Thx

  • Profile Image
    Answered on November 22, 2012 at 06:19 PM


    Our colleague NeilVicente was referring to this article How-to-get-your-Form-Source-Code to get the form's source code. You can use it to host on your own website.

    I made a sample page using your form's source code. If you view the source of this page, I simply erased the text USD.

    I am not sure if you can embed html source code in pageline. Just like you cannot do it in Worpress.

    Hope this help. Please inform us if you have further inquiry.


  • Profile Image
    Answered on November 22, 2012 at 10:36 PM


    Whereas before the currency element used to be classed as curr-text, this appears to be no longer the case. However, I've found a way to hide the currency via injected CSS, eliminating the need to embed a copy of the form's source, as can be seen in this clone of your form.

    Here's what to do:

    1. In your form's injected CSS, replace the .curr-text rule with the following:

    b span:after {
    content: "";
    position: absolute;
    background: #87AE11;
    width: 50px;
    height: 20px;
    margin-left: 2px;

    .form-product-item:hover {
    background: transparent;

    2. On the Field Styles tab of the Preferences, disable the highlight effect. (This is necessary for the solution to work correctly in Firefox and possibly other browsers.)

    3. Save the changes if they aren't autosaved

    Unfortunately, this solution doesn't work in IE8 (and earlier) and there is still quite a large number of users of that version of the browser. So, if it's vital that the currency not be displayed, the only option at your disposal would be to go the source code route.

  • Profile Image
    Answered on July 11, 2015 at 05:24 AM

    Hello, I have removed the currency info using the above css code.  Unfortunately it also makes the form total invisible.  Is there a workaround for this?
  • Profile Image
    Answered on July 11, 2015 at 07:07 AM


    Your question has been moved to a different thread ( and will be dealt with shortly.