Headings Titles before each section in BILLING PAYMENT part

  • BBC2016
    Asked on April 11, 2016 at 11:31 PM

    I put a heading "MORE INFO RSVP" at the top? Can the next section be EVENT INFO (same font and color as the first heading) and then the final section be BILLING INFO (same font and color too) instead of CreditCard.

     

    Also a black line (just like near the total$ line above) be separating each section?

  • Elton Support Team Lead
    Replied on April 12, 2016 at 3:42 AM

    You can add it in your form using the Text tool under Form Tools.

    Headings Titles before each section in BILLING PAYMENT part Image 1 Screenshot 30

    You can customize the text color and fonts on its formatting toolbar. You can also add a horizontal line.

    Example:

    Headings Titles before each section in BILLING PAYMENT part Image 2 Screenshot 41

    If you need further assistance, let us know.

  • BBC2016
    Replied on April 12, 2016 at 4:04 AM

    can u help me do it?

     

    also what about:

    Also a black line (just like near the total$ line above) be separating each section?

     

  • BJoanna
    Replied on April 12, 2016 at 5:17 AM

    I have inspected your form and I saw that you added a lot of custom CSS codes to your form.

     

    Like my colleague suggested you can add additional heading to your form, by using Text field. Once you add "EVENT INFO" heading to your form, we can help you with positioning. 

    To replace word credit card with "BILLING INFO", please add this code to your form. 

    th#ccTitle13 {

        font-size: 0px;

    }

    th#ccTitle13:before {

        content:"BILLING INFO";

        font-size: 14pt;

        color: #00ccff;

    }

     

    Here is my demo form where I changed  "credit card" word and added "EVENT INFO" text field.

    https://form.jotform.com/61021772233950 

    Feel free to clone it.

    Also please provide us more details about where you want to add horizontal lines to your form. 

    Let us know if you need further assistance.

     

  • BBC2016
    Replied on April 12, 2016 at 4:33 PM

    i cant do it right.....can u help me again???

     

    Forum Info needs to be the color blue like the others: #0284C1 - how come there is a  big gap above forum info and big gap above billing info  - also the  line above billing should be like the total line.

  • Elton Support Team Lead
    Replied on April 12, 2016 at 5:14 PM

    Sure, please stay tuned. We'll provide you a form to be cloned with the desired output you want.

  • Elton Support Team Lead
    Replied on April 12, 2016 at 5:30 PM

    Here's the form https://form.jotform.com/61026294299966. Please clone it so you can use it and integrate it to your Stripe account.

    There are lots of CSS codes injected to your form, some of them are really not necessary but I did not bother to correct them because I might messed things up. Anyway, this will not affect the form functionality so I think your good to go with this. If you need any further help, do let us know.

  • BBC2016
    Replied on April 13, 2016 at 1:24 AM

    its great but the line needs to come down its too high and its covering up the words...do u see it? can u fix that??

  • BBC2016
    Replied on April 13, 2016 at 1:40 AM

    wait now it changed - - - now its a little bit on top of billing - can u fix it to look right???? i am trying to get everything nice and professionally and uniform on the spacing between each lines. please help! im so furious with myself and this!

  • BBC2016
    Replied on April 13, 2016 at 1:43 AM

    i just noticed that all the form fields moved too! how do i get all the ones on the RH to line up with one another? they should all be on the margin/indent that LAST NAME is.

     

    the form field font/size is messed up now too :(

     

    all my hard work is messed up! :(

     

    the fontsize and font for each form titles under each of tehe boxes should be 11pt and all text on page should be opensans.

  • BJoanna
    Replied on April 13, 2016 at 3:24 AM

    I have checked webpage you provided and form that is embedded there was not changed. You need to clone the form my colleague provided you and the re embed your cloned form to your website. 

    I have also checked form my colleague provided you and I do not see any issues with that form. Fields are not overlapping each other and they are positioned correctly. This is how form looks on my end.

    Headings Titles before each section in BILLING PAYMENT part Image 1 Screenshot 20

    Please clone this form https://form.jotform.com/61026294299966,to your account and then embed it to your webpage.

    Inside of this guide you can hind how to clone a form: 

    https://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL 

    If the form does not look correctly on your end please provide us a screenshot.

    Let us know if you need further assistance. 

  • BBC2016
    Replied on April 14, 2016 at 12:38 AM

    see the line is still messed up - it needs to be a little bit higher  - even between the two sections. above billing and under email and phone fields....nice and even. can u help here>>>????

     

    Headings Titles before each section in BILLING PAYMENT part Image 1 Screenshot 20

     

  • Elton Support Team Lead
    Replied on April 14, 2016 at 1:46 AM

    Sure. Stay tuned, we will check it. :)

    It was actually fine on Chrome browser, I see it is not displaying properly on Firefox.

  • Elton Support Team Lead
    Replied on April 14, 2016 at 2:11 AM

    Check the form now https://form.jotform.com/61026294299966.

    I just found out that the CSS codes you've injected into your form are suggested by different supporters. That might be the reason why some of it are duplicated and not really concise. I suggest sticking on the same thread next time whenever you have follow-up questions with your question. This is to avoid confusions and to prevent conflict issues with the solutions we provided (particularly on the CSS codes).

    Thank you!