Clever Colorful Theme: Copy fields - styling doesn't copy though?

  • Profile Image
    Asked on February 01, 2017 at 06:35 AM

    I want to duplicate fields in my Character Breakfast form, particularly the Child's Name fields - but the styling/ formatting of the fields don't carry over when I do that. And I can't even view the settings for the those fields to copy on to the ones I want to change.

  • Profile Image
    Answered on February 01, 2017 at 07:03 AM


    I cloned and check the form. You are right. The styles can't be copied with the field. This issue belongs to theme. The theme should automatically update the styling code. I am escalating the issue to the owner of the theme. They will update the theme accordingly.

    In the mean time, you can add your own styling code to implement styling to the copied fields. Here is the code that you should inject in the form builder.

    #id_10 {

        width : 460px;

        margin : auto;

        -webkit-border-radius : 10px;

        -moz-border-radius : 10px;

        border-radius : 10px;

        background : rgb(0,183,229);

        background : -moz-linear-gradient(top,  rgba(0,183,229,1) 0%, rgba(0,183,229,1) 100%);

        background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,183,229,1)), color-stop(100%,rgba(0,183,229,1)));

        background : -webkit-linear-gradient(top,  rgba(0,183,229,1) 0%,rgba(0,183,229,1) 100%);

        background : -o-linear-gradient(top,  rgba(0,183,229,1) 0%,rgba(0,183,229,1) 100%);

        background : -ms-linear-gradient(top,  rgba(0,183,229,1) 0%,rgba(0,183,229,1) 100%);

        background : linear-gradient(to bottom,  rgba(0,183,229,1) 0%,rgba(0,183,229,1) 100%);

        filter : progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7e5', endColorstr='#00b7e5',GradientType=0 );



    Here is a guide on how to inject CSS code into your forms:


    For adding the same styling into other fields, you need to find its id on the console. Then duplicate this code and update the id part and inject the code. Here is a demonstration on finding id on the console. I am using Chrome. Right click on the filed that you want to add styling:

    Scroll up to the "li" element on the HTML code and there lies the id of the "li" element:

    Here how it looks like after injecting the CSS code to id_10:


    You will be updated about the issue when it is fixed.

    Thank you for your understanding.




  • Profile Image
    Answered on June 21, 2017 at 01:53 PM

    i was having the same issue with this form. I tried the solution above. It worked correctly in the "build" area.  However, once published, the form reverted back to it's original styling.

  • Profile Image
    Answered on June 21, 2017 at 03:03 PM

    The theme is specific to a single form and the code referenced in this thread is specific to the users form.  You would need to apply new styling to any new fields added in the form.  If you need help with doing so, please create a new thread letting us know the form you are using and what needs to be updated, we will be happy to have a look: