/** * Make standard form fields to make read-only * To apply, add CSS class 'wpf-disable-field' (no quotes) to field in form builder * * @link https://wpforms.com/developers/disable-a-form-field-to-prevent-user-input/ * */ function wpf_dev_disable_field() { ?> <script type="text/javascript"> jQuery(function($) { $('.wpf-disable-field input, .wpf-disable-field textarea').attr('readonly','readonly'); }); </script> <?php } add_action( 'wpforms_wp_footer_end', 'wpf_dev_disable_field', 30 ); css input#wpforms-2228-field_14 { background-color: beige; color: gainsboro; }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter