Topic: Gravity Form Checkboxes

Paul King pro asked 5 years ago


I'm trying to use mdbootstrap with gravity forms. When using the checkbox field the checkbox is automatically hidden but not replaced with an MDBootstrap version. 1) Is MDBoostrap compatible with Gravity Forms for Wordpress? 2) If yes, how can I change the default behaviour to show a standard checkbox?


Chris Sweeney premium answered 2 years ago

Thanks Marcin

I thought I'd tried that, but obviously missed something!

Cheers Chris

Marcin Luczak staff commented 2 years ago

I'm happy that it was helpful :)

Keep coding, Marcini

Chris Sweeney premium answered 2 years ago

Hi Marcin

Thanks - we aren't using WordPress or Gravity.

Cheers Chris

Marcin Luczak staff commented 2 years ago

In this case please use MDBootstrap's classes for the form elements. When using MDBPackage, original styles for the form elements may be overwritten and visual issues may occur. Please see my snippet showing your corrected code:

Chris Sweeney premium answered 2 years ago


I run a 'template' site for several hundred users, each of which can edit their own pages using an html editor.

Any of them might want to insert code provided by a third party - e.g. charity payment forms. These forms don't display properly - I've tried copying the code above into the css file - the boxes now display, but over the text label. (see test site)

Example code:

<fieldset class="mc_fieldset gdprRequired mc-field-group" name="interestgroup_field"> <label class="checkbox subfield" for="gdpr_93"><input type="checkbox" id="gdpr_93" name="gdpr[93]" value="Y" class="av-checkbox " />Email </label><label class="checkbox subfield" for="gdpr_105"><input type="checkbox" id="gdpr_105" name="gdpr[105]" value="Y" class="av-checkbox " />SMS </label> <br> </fieldset>

Could you suggest a modification to the css above so users could paste code in place and still have things display properly?

Many thanks


Marcin Luczak staff commented 2 years ago


Unfortunately, I cannot reproduce any testing environment for WordPress Gravity Forms to check your issue. Also, we do not guarantee the compatibility of our products with third-party libraries, thus I cannot give you any reliable answer.

Keep coding, Marcin

ggedde free answered 3 years ago

@Paul King @Bartłomiej Malanowski

Hi All, I recently published a plugin called Modern Designs for Gravity Forms that has an option to specify that you are using MDB Pro. It will convert all the HTML Markup of Gravity Forms to MDB Pro specific markup. This will allow you to continue using your existing installation of MDB Pro without requiring any additional scripts or styles to be added to your website.

If you are not using MDB Pro and just using MDB Free version which uses Bootstrap's specific markup then you can use the "Use Bootstrap" markup instead. It does the exact same thing, but just the generic Bootstrap markup without needing to include any additional scripts or styles as you are already importing your own.

However, if you are not including Bootstrap or MDB already then you can utilize another option of including Bootstrap or Material Design with the plugin.

These options are all part of the Pro version, but since I just launched it I am looking for some BETA testers so if you want a free Pro license then respond here and make sure to include me by adding @ggedde in the response.


Paul King pro answered 5 years ago

For anyone else using Wordpress and Gravity Forms to make the checkbox visible again override the following css:

[type=checkbox]:checked, [type=checkbox]:not(:checked) {
    opacity: unset;
    pointer-events: unset;

Currently, we don't officially support Gravity Forms. Anyway, some users use MDB with Gravity forms so maybe someone will know the answer

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.6.1
  • Device: Desktop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No