Order Form: Adding sub categories to form products

  • Profile Image
    pagewalker
    Asked on January 28, 2016 at 06:40 PM

    Hi there-

     

    I tried this and it worked. However, I still have a little checkbox right beside my item heading. How do I get rid of this? Thanks!



    This is a re-post of a comment on How to Have Sub-Category or Sub-Labels on an Order Form

  • Profile Image
    Chriistian
    Answered on January 29, 2016 at 02:48 AM

    Are your referring to this checkbox?

    You could hide the checkbox, but then no one would know if they made the selection by clicking on the label or not. It will also make it practically impossible for those that use keyboard only to fill out the form to see that the keyboard stopped on the label for a specific reason, but nonetheless it is possible. You can inject this custom css to hide the check-box:

    /* remove checkbox */

    input.form-checkbox {

        display: none;

    }

    /* add text behind the label showing "( selected )" when the product is clicked */

    input.form-checkbox:checked + label:after {

        content: "( selected )";

        float: right;

        margin-left: 10px;

    }

    Here's how you can inject the custom css: How to Inject Custom CSS Codes

    This is how it would appear once you have added the css.

     

  • Profile Image
    pagewalker
    Answered on January 29, 2016 at 09:03 AM

    I'm not referring to that checkbox. I'm referring to when I put Sub-headings on the order form, there is a checkbox like there is next to an item.

    The CSS inject code doesn't really work for multiple products like it should for me. Where do I need to inject this code? In the beginning of the CSS file or..?

  • Profile Image
    Mike
    Answered on January 29, 2016 at 12:11 PM

    You can add the custom CSS via form designer.

    If you need help with some specific form, please provide us with a form link/name.

    Thank you.