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

  • Profile Image
    pleymo
    Asked on March 01, 2016 at 06: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

    Screenshot
  • Profile Image
    EltonCris
    Answered on March 01, 2016 at 09: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!

  • Profile Image
    pleymo
    Answered on March 01, 2016 at 09:33 AM

    Well, thanks a lot for answer and this solution

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

  • Profile Image
    pleymo
    Answered on March 01, 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

  • Profile Image
    Kiran
    Answered on March 01, 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! 

  • Profile Image
    pleymo
    Answered on March 01, 2016 at 12:13 PM

    Kiran, thank you, I got it