Overview
Would you like to prevent copy and paste in your forms? You may want to prevent your visitors from copying and pasting anything into your form fields. In this article, we’re going to show you how you can use a small snippet to prevent your visitors from pasting anything into your form fields.
Please note, if there are any options on the Advanced tab enabled for the field, this snippet may not work correctly for you. Examples being text or character limits on the Single Line Text or Paragraph form fields.
Adding the snippet
Just add this snippet to your site. If you need any assistance with where and how to add snippets to your site, please check out this tutorial.
/**
* Prevent visitors from copying and pasting in your form fields
*
* @link https://wpforms.com/developers/how-to-prevent-copy-and-paste-inside-your-form/
*/
function wpf_dev_prevent_copy_paste( ) {
?>
<script type="text/javascript">
jQuery(document).ready(function () {
// Update the form ID to match your own form ID
jQuery( 'form#wpforms-form-2189' ).on( 'copy paste', function (e) { e.preventDefault(); } );
});
</script>
<?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_prevent_copy_paste', 30 );
In the snippet, we’re only processing this snippet on the form ID 2189, you’ll need to update this form ID to match your own form ID. If you need assistance in finding this ID, please check out this tutorial.
When a visitor comes to your site and tries to paste into your form fields, the fields will remain empty until the visitor physically types into the field.
And that’s it! You’ve successfully stopped users from performing the copy or paste function in your form fields.
Related
Action Reference: wpforms_wp_footer_end
FAQ
Q: What if I wanted to do this for all of my WPForms?
A: If you’d like to force this on all of your WPForms, use this snippet instead.
/**
* Prevent visitors from copying and pasting in your form fields
*
* @link https://wpforms.com/developers/hhow-to-prevent-copy-and-paste-inside-your-form/
*/
function wpf_dev_prevent_copy_paste( ) {
?>
<script type="text/javascript">
jQuery(document).ready(function () {
// Update the form ID to match your own form ID
jQuery( '.wpforms-container' ).on( 'copy paste', function (e) { e.preventDefault(); } );
});
</script>
<?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_prevent_copy_paste', 30 );
Q: Can I prevent a copy and paste in the Rich Text Editor field?
A: Using the snippet above, when you are on the Text tab of the Rich Text Editor field, it will automatically be disabled with the script. However, when on the Visual tab, since this is loaded via an iFrame, it’s not currently possible to prevent the copy and paste function.
