The integration with mPDF (generate PDF option) limits the ability to customize forms for PDF. However, using the Media Print/Print to PDF function, there is the ability to customize forms. The purpose of this document is to show options to cleanup checkboxes and radio buttons so that non-checked options are not displayed using Media Print for Gravity forms.
** If you need Caldera: PDF Printing CSS Customizations for Checkboxes/Radio Buttons (Caldera) **
In the Settings/Forms CSS section you can add the following CSS Customizations
This section shows several CSS customizations for the backend Display:
- Hide a specific field
- Hide the footer
- Change the font-weight of checkbox and radio button selections - making it easier to read
- Hiding all the checkboxes and radio buttons that are not chosen to compress the form display and print size.
All the above using Media Print
Below, showing how to hide even the checkboxes and radio buttons of chosen fields, showing only the selected label
/*hide field 118 added by Gravity */
.cm-hipaa-submitted-form-fields #field_32_118 {
display: none;
}
/* hide footer */
.cm-hipaa-submitted-form-fields .gform_footer{
display: none;
}
/* change font weight for checkbox labels - to make easier to read */
.cm-hipaa-submitted-form-fields .gfield_checkbox li label {
font-weight: 400;
}
/* change font weight for radio button labels - to make easier to read */
.cm-hipaa-submitted-form-fields .gfield_radio li label {
font-weight: 400;
}
/* remove all checkboxes non-checked labels */
.cm-hipaa-submitted-form-fields li span.cm-hipaa-forms-checkbox-not-checked,
.cm-hipaa-submitted-form-fields li span.cm-hipaa-forms-checkbox-not-checked + label{
display: none;
}
/* remove all radios non-checked labels */
.cm-hipaa-submitted-form-fields li span.cm-hipaa-forms-radio-not-checked,
.cm-hipaa-submitted-form-fields li span.cm-hipaa-forms-radio-not-checked + label {
display: none;
}
/*************************** media print *****************/
@media print {
/*hide field 118 added by Gravity */
#field_32_118 {
display: none;
}
/* Hide footer */
.gform_footer{
display: none;
}
/* change font weight for checkbox labels - to make easier to read */
.gfield_checkbox li label {
font-weight: 400;
}
/* change font weight for radio button labels - to make easier to read */
.gfield_radio li label {
font-weight: 400;
}
/* remove all checkboxes non-checked labels */
.cm-hipaa-forms-checkbox-not-checked,
.cm-hipaa-forms-checkbox-not-checked + label {
display: none;
}
/* remove all radio buttons non-checked labels */
.cm-hipaa-forms-radio-not-checked,
.cm-hipaa-forms-radio-not-checked + label {
display: none;
}
/* Needed to make the background color blank when background graphics setting is check to allow for yellow check boxes */
body {
background: none;
}
}
This section shows how to not show any checkboxes/radio buttons, even those selected. Will only display label of selected.
/************ hide chosen checkboxes */
.cm-hipaa-submitted-form-fields .cm-hipaa-forms-checkbox-value {
display: none;
}
/************ hide chosen radio */
.cm-hipaa-submitted-form-fields .cm-hipaa-forms-radio-value {
display: none;
}
/*************************** media print *****************/
@media print {
/************ hide chosen checkboxes */
.cm-hipaa-forms-checkbox-value {
display: none;
}
/************ hide chosen radio */
.cm-hipaa-forms-radio-value {
display: none;
}