I cannot add an HTML link in the sub-label

  • southind
    Asked on January 21, 2017 at 12:18 AM
  • southind
    Replied on January 21, 2017 at 2:27 AM

    anyone?

  • AIDAN
    Replied on January 21, 2017 at 10:30 AM

    Hi, thank you for contacting us.

    Please note that removing the possibility of inserting HTML elements into the sub-labels was a conscious decision made by our developers, to prevent some security related implications.

    With that said, you may still be able to use Text elements with their HTML capability, and style it in a way that allows you to have it render as and where you see it fit.

    If you need further assistance please let us know. We will be happy to help. Thank you.

  • southind
    Replied on January 21, 2017 at 10:29 PM

    please elaborate your answer. just tell me  YES/NO if i can add a link in sub-label using html code. If YES please tell me how to do it.  I used this code in my sub-label

    <a href="www.google.com">HELP </a>

     

  • Support_Management Jotform Support
    Replied on January 22, 2017 at 5:20 AM

    Hey @southind, the answer is NO, you can't anymore (regardless if you use V3 or V4).

    Please use a Text Field if you wish to use HTML on any part of your form. In case you need help with that, just let us know and we'll be more than happy to assist.

  • southind
    Replied on January 23, 2017 at 9:11 AM

    can you tell me how to do it using text field? i want to create text field similar from Sub-label. I mean the same text position, same color, font-size and responsive in all mobile devices. 

  • AIDAN
    Replied on January 23, 2017 at 11:07 AM

    I have created an animation to show you how to add a link using the HTML features of the Text elements:

    I cannot add an HTML link in the sub label Image 1 Screenshot 20

    Based on this, you can place a Text element with a link similar to the above, on any section of your form, and then style it as you see fit.

    If you need assistance styling a Text element, please add that element to a form and get back to us with the form URL and the styling that you would like to achieve, and we will do our best to help you achieve it. Thank you.

  • southind
    Replied on January 23, 2017 at 11:13 AM

    how can i align that text similar in sub-label? see my screenshotI cannot add an HTML link in the sub label Image 1 Screenshot 20

  • Support_Management Jotform Support
    Replied on January 23, 2017 at 12:36 PM

    I'm assuming that's for the Dealer Textbox. Here's how:

    1. Add your Text Field and include the link as you intend to. Below is just an example HTML code to turn that sublabel you shown on your screenshot into a link pointing to jotform.com

    Who do you work for?

    2. Remove the sublabel of the Dealer Textbox.

    3. Adjust your Conditions so the newly added Text Field is also hidden on form load and will only show up once Installation Audit was selected.

    4. Grab the ID of the Text Field you just added.

    Complete guide: How-to-find-field-IDs-and-names

    Or use the console: https://developers.google.com/web/tools/chrome-devtools/inspect-styles/#live-edit_a_dom_node 

    3. Use the following CSS Codes to position it right below the Dealer Textbox:

    #cid_247 {

        position: relative;

        left: 353px;

        top: 10px;

    }

    Seeing that you have heavily customized your form with CSS, I'll just assume you know where/how to place these.

    RESULT:

    I cannot add an HTML link in the sub label Image 1 Screenshot 20

    Here's a cloned copy of your form that was shown above: https://form.jotform.com/70224581844961 

    Now, if you'll do this for another field, the idea would still be the same - You add the Text Field, get its ID, then position it using CSS.

  • southind
    Replied on January 23, 2017 at 2:34 PM

    it's working however when you view it from mobile devices the above text is not properly align. I cannot add an HTML link in the sub label Image 1 Screenshot 20

  • AIDAN
    Replied on January 23, 2017 at 4:32 PM

    By following my colleagues explanation and logic, please inject this custom CSS code into your form with changes based on the element you want to target:

    #cid_247 {

    margin: 10px 0 0 353px;

    }

     

    @media screen and (max-width: 480px), screen and (max-device-width: 768px) and (orientation: portrait), screen and (max-device-width: 415px) and (orientation: landscape) {

    #cid_247 {

    margin: 0;

    }

    }

    Here is my corrected form to show you how it looks like, if you would like to clone it: https://form.jotform.com/70226611521949

  • dgn02000
    Replied on July 29, 2017 at 2:53 PM

    Can you make a video showing how you found the text field ID to be cid_247?

  • Support_Management Jotform Support
    Replied on July 29, 2017 at 4:27 PM

    Looks like you already created your own thread here https://www.jotform.com/answers/1211299 So, we'll reply to you on your own thread instead to avoid confusion.