Gift Registry widget. How can I change the style of my text or just a part of it in the options?

  • pleymo
    Asked on March 1, 2016 at 6:50 AM

    I am using Gift Registry widget and I have a question about it. How can I change the style of my text or just a part of it in the options (Wizard -> Generals -> Items)? In common forms I used to change the styles in "Options" by adding the code. But I cannot do it in this case.

    For example:

    <span style="color: #ff0000; font-weight:bold; margin-right: 30px;">11:00 - 12:00</span>text2

    Jotform Thread 784553 Screenshot
  • Elton Support Team Lead
    Replied on March 1, 2016 at 9:17 AM

    Unfortunately, this widget does not support HTML codes in its options. You have to inject a CSS code to add styles in the text.

    You can use these CSS codes and inject it within the widget settings under Custom CSS tab.

    li label {color: violet !important;} /*first option*/

    li+li label {color: red !important;} /*second option*/

    li+li+li label {color: blue !important;} /*third option*/

    You can change the colors in this code to your preference. The label indicates on which element it will be applied.

    Unfortunately, since it is not possible to add HTML code in the option, I'm afraid it's not possible to define multiple colors on a single line.

    Hope this helps!

  • pleymo
    Replied on March 1, 2016 at 9:33 AM

    Well, thanks a lot for answer and this solution

    I hope this function will be available in the future ><

  • pleymo
    Replied on March 1, 2016 at 10:08 AM

    Sorry, but pseudo-classes like :nth-letter and :nth-word also don't work here?

    btw: first-letter is working

  • Kiran Support Team Lead
    Replied on March 1, 2016 at 12:04 PM

    Unfortunately, it doesn't support to have :nth-letter and :nth-word since they are not native CSS pseudo classes. As I check on this, it is required to include Letteringjs jquery Plugin. Unfortunately, it is not possible to add any Javascripts to JotForm due to security related issues. Also, since the widget loads on an iframe on the iframe, it doesn't allow to add any scripts except CSS.

    Hope this information helps! 

  • pleymo
    Replied on March 1, 2016 at 12:13 PM

    Kiran, thank you, I got it