Configurable List widget: change the background color of the button

  • nyff42info
    Asked on March 18, 2025 at 10:42 AM

    I have created a number of forms with a configurable list as registration form. at the bottom is a smallish gray box to click to register additional people. MANY people miss this box and though they are buying multiple passes, they only register themselves and then I have to email those people and ask for the rest of the registrations. How can I make that button more visible. I have had patrons say they looked for the mechanism and could not find it. Please help! It needs to be larger and more colorful - red would be nice! Here is the link to one of my forms: https://form.jotform.com/240836514880157

    Kate Thorpe

    NY Faerie Festival

  • Shaina Jotform Support
    Replied on March 18, 2025 at 1:05 PM

    Hi Katharine,

    Thanks for reaching out to Jotform Support. You can easily change the background color of the button of Configurable List widget by simply adding the code to the Custom CSS section of the widget. Let me show you how to do it:

    1. First, copy this code:

    .add{
    background#FF0000 !important;
    }

    2. In Form Builder, click on the Wand icon on the Configurable List widget.
    3. Click on Custom CSS option in the option panel that pops up in the right part of the page.
    4. Paste the copied code inside the box under the Custom CSS option.
    5. Click on the Update button in the lower right part of the page.

    Configurable List widget: change the background color of the button Image 1 Screenshot 20

    For more details on how to set up the Configurable List Widget, you can refer to this guide.

    Give it a try and let us know if you need any other help

  • nyff42info
    Replied on March 18, 2025 at 2:40 PM
    Okay, that worked well. Can you send me code to make the button bigger?
    ...
  • Kyle Jotform Support
    Replied on March 18, 2025 at 5:37 PM

    Hi Katharine,

    Paste the custom CSS code below to make the button bigger:

    .add{
    width:400px;
    height: 200px
    }

    Configurable List widget: change the background color of the button Image 1 Screenshot 20 Let us know if there’s anything else we can do for you.