Payment Wizard - Input ID of individual items

  • Profile Image
    Asked on July 28, 2015 at 04:06 PM

    Hi, I'm trying to find the input ID - I've tried SHIFT -CTRL-I?

    I must be doing something wrong.

    I need to add spaces and remove pricing


  • Profile Image
    Answered on July 28, 2015 at 05:52 PM

    I am not quite sure what you mean, so I would like to ask you if you could give us a bit more detains in regards to your query?

    I do presume that it might be related to editing of single payment options/fields, for which I would suggest checking out the following guide: How to apply custom CSS to a particular field

    Of course once we have more details we would be happy to assist in setting it up just right for you :)

  • Profile Image
    Answered on July 29, 2015 at 06:48 AM

    Hey Ben

    Sorry to be so vague, this should clarify.

    Here is a clone of the form in question

    If you go to FULL MENU lower down the form, you will see what I am "TRYING" to do.

    Basically, its something I started a long time ago, and now its time to finish. I refer to removing FREE from food headings ex CHINESE STYLE STARTER which I've done. Scrolling done the menu you will see many headings in CAPITALS with free the needs removing like CHINESE STARTER

    The second issue is spacing between headings, that said I think this is best done when form is fully populated with menu items.


    OK Ben, assuming you are still with me.

    I've found the CSS changes I did way back , but the issue I am having is how to find the input IDS of new items in my menu.

    FINALLY, as I have your attention, I've just posted another question that you may be able to help me with :)

    Thank you


  • Profile Image
    Answered on July 29, 2015 at 09:46 AM

    If I understand you correctly, you want to remove the word FREE on the headers right?

    Here's the CSS code that you need to add to your form so that the "Free" text will not appear. Here's a guide on how to inject it on your form.

    #input_102_1027_price, #input_102_1028_price, #input_102_1030_price, #input_102_1031_price, #input_102_1032_price, #input_102_1033_price,  #input_102_1034_price,  #input_102_1035_price,  #input_102_1036_price,  #input_102_1037_price,  #input_102_1038_price,  #input_102_1039_price  {

    display: none !important;


    I use Google Chrome Inspect Element to identify the IDs of this elements. 

    Can you please clarify the 2nd issue? We can increase or decrease the margin or padding of an element using CSS.  We might need to open a new thread for the 2nd issue if it is not related on the original issue.

    Thank you.

  • Profile Image
    Answered on July 31, 2015 at 04:43 AM

    Hi Jan

    I still need help......

    Thank you for your help, but I am REALLY struggling to understand where to inject the code. Do you think you could do this for me as I am under a lot of pressure to get this finished.

    I will learn how to do it myself - just don't have time right now.

    THE FORM is called No BG Needs FREE Removing PLZ

    Thank you



  • Profile Image
    Answered on July 31, 2015 at 09:40 AM

    No problem. I injected the custom CSS code I provided above in your form. Please check the form ( and verify if there are still issues with it.

    Let us know if you need further assistance. Thank you.