This tutorial explains how to add a “Remember Me” checkbox to any USP Form. This can be useful when collecting a lot of information, so that if there is an error when the form is submitted, the fields will be re-populated with any provided data. This can be a huge time-saver for the user, and is pretty easy to do with USP Pro.

Add a “remember me” checkbox

Here are the steps to add a “remember me” checkbox to any USP Pro Form.

Step 1

Visit the USP Pro General settings, and check the following options:

  • Remember Form Values — check this box to enable “remembering” of submitted form data
  • Memory Duration — check this box to remember form data indefinitely (until the user clears their browser), or leave it unchecked for default remembering (until the form is submitted successfully)
  • Memory Default — check this box to display the “Remember Me” checkbox that is already selected, or leave unchecked to display the remember box unchecked.
Step 2

Once your settings are configured, you can include a “Remember Me” checkbox on any form by adding the [usp_remember] shortcode, like so:

[usp_remember class="" label=""]

The attributes may be left blank to use the default values, or you can add some custom CSS classes and a label name. To customize further, copy the source code generated from this shortcode and add it directly to the form; then customize however is required.

Note: you can add the “Remember Me” shortcode by clicking on the USP:Remember Quicktag (located just above the form editor).

Hey man it’s not working

This technique is known to work well, so if you are experiencing any weird behavior try the following steps:

  • Clear your browser cache
  • Clear your browser cookies

After clearing your browser, reload the page and try again.

Make it hidden

Once you have the remember me checkbox set up, you can hide it from the user so that the values are either always remembered or always hidden. Here are the steps:

  1. Set the option “Memory Default” to your preference (show or hide)
  2. With the field included in the form (as per above steps), add the following CSS to your theme or plugin styles: .usp-pro .usp-input-remember, .usp-pro .usp-label-remember { display: none; }

Done! Now the form always will either remember or forget without the users consent one way or another. Good times.

Update!

If the CSS method above doesn’t work for whatever reason, then you can try the alternate method. Simply replace the remember shortcode with the following hidden field in the form:

<input name="usp-remember" type="hidden" value="1">

And you’re golden, congratulations!