We had to create a part 2 to this tutorial “How to create a Forgot/Reset Password form with Gravity Forms”. Please read the first article in order to understand how this process works from start-to-finish.

It is a frequent issue among website users to forget their passwords. As a website owner, it is crucial to incorporate a functionality for password recovery/reset to ensure that users can regain entry to their accounts. Gravity Forms, a well-known WordPress plugin, offers the capability to create personalized forms, including a form specifically designed for Forgot/Reset Password purposes. Utilizing this approach enables users to maintain their frontend forms while aligning them with their unique branding.

In this article, we will guide you through the process of creating the final part of the Forgot/Reset Password form with Gravity Forms by setting up the form to change the password, creating a new page so your end-users can use the functionality, and last-but-not-least, the under-the-hood code to enable all of the functionality for the user resetting their password.

Step 1: read “How to create a Forgot/Reset Password form with Gravity Forms”

The first step is to read part 1 How to create a Forgot/Reset Password form with Gravity Forms.

Step 2: Create the Reset Password form

To make it easier for you, you can download the JSON form and then import it into Gravity Forms. Take note of the new Form ID as we’ll need this later. For your reference, the JSON code is below:

{"0":{"fields":[{"type":"password","id":1,"formId":15,"label":"Password","adminLabel":"","isRequired":true,"size":"large","errorMessage":"","visibility":"visible","inputs":[{"id":"1","label":"Enter Password","name":""},{"id":"1.2","label":"Confirm Password","name":""}],"displayOnly":true,"description":"Hint: The password should be at least twelve characters long. To make it stronger, use upper and lower case letters, numbers, and symbols like ! \" ? $ % ^ & ).","allowsPrepopulate":false,"inputMask":false,"inputMaskValue":"","inputMaskIsCustom":false,"maxLength":"","inputType":"","labelPlacement":"","descriptionPlacement":"above","subLabelPlacement":"","placeholder":"","cssClass":"","inputName":"","noDuplicates":false,"defaultValue":"","enableAutocomplete":false,"autocompleteAttribute":"","choices":"","conditionalLogic":"","productField":"","layoutGridColumnSpan":"","passwordStrengthEnabled":true,"passwordVisibilityEnabled":true,"enableEnhancedUI":0,"layoutGroupId":"9f99f61f","multipleFiles":false,"maxFiles":"","calculationFormula":"","calculationRounding":"","enableCalculation":"","disableQuantity":false,"displayAllCategories":false,"useRichTextEditor":false,"fields":"","checkboxLabel":""}],"button":{"type":"text","text":"","imageUrl":"","width":"auto","location":"bottom","layoutGridColumnSpan":12},"title":"Forgot Password - Reset","description":"","version":"2.7.8","id":15,"markupVersion":2,"nextFieldId":2,"useCurrentUserAsAuthor":true,"postContentTemplateEnabled":false,"postTitleTemplateEnabled":false,"postTitleTemplate":"","postContentTemplate":"","lastPageButton":null,"pagination":null,"firstPageCssClass":null,"labelPlacement":"top_label","descriptionPlacement":"below","subLabelPlacement":"below","requiredIndicator":"text","customRequiredIndicator":"(Required)","cssClass":"","saveButtonText":"Save & Continue","limitEntries":false,"limitEntriesCount":"","limitEntriesPeriod":"","limitEntriesMessage":"","scheduleForm":false,"scheduleStart":"","scheduleEnd":"","schedulePendingMessage":"","scheduleMessage":"","requireLogin":false,"requireLoginMessage":"","enableHoneypot":true,"honeypotAction":"spam","enableAnimation":true,"validationSummary":false,"deprecated":"","saveEnabled":"","save":{"enabled":false,"button":{"type":"link","text":"Save & Continue"}},"scheduleStartHour":"","scheduleStartMinute":"","scheduleStartAmpm":"","scheduleEndHour":"","scheduleEndMinute":"","scheduleEndAmpm":"","notifications":[],"confirmations":[{"id":"64824fa5e79c9","name":"Default Confirmation","isDefault":true,"type":"message","message":"Success! Your password has been reset. You may proceed to login.","url":"","pageId":"","queryString":"","event":"","disableAutoformat":false,"page":"","conditionalLogic":[]}]},"version":"2.7.8"}

Step 3: Add the Reset Password functionality to functions.php

There are three parts to this code.

  1. First we need to add a new filter for Gravity Forms to pre-render the form. This will do the initial checking to make sure the reset key is valid.
  2. Then we need to add another filter for Gravity Forms to validate the input field before submission. Again, this will check the reset key is valid. We do this because if the user is sitting idle on the page for 5 hours and then finally submits the form, without checking it would allow them to change the password. This step is vital to protect the account.
  3. And finally, we need to actually change the password after the form has been submitted.

You can copy/paste the code below into your functions.php or a custom plugin file.

In the code example below, your new form ID is 100 and the password field ID is 1. If you import the form using the JSON file above, you’ll only need to change the Form ID.

// Forgot Password - The password reset form, check for a valid key!
add_filter('gform_pre_render_100', function($form) {
	
	$key = sanitize_text_field($_GET['key']);
	$login = sanitize_text_field($_GET['login']);
	$validation = check_password_reset_key($key, $login);
	$form['limitEntriesMessage'] = 'The link you followed either expired or is invalid.';
	
	if(is_wp_error($validation)) {
		
		$form['limitEntries'] = true;
		
	}
	
	return $form;
	
});

// Let's do some validation of field 1 (the password field) prior to resetting the password
add_filter('gform_field_validation_100_1', function($result, $value, $form, $field) {

	$key = sanitize_text_field($_GET['key']);
	$login = sanitize_text_field($_GET['login']);
	$validation = check_password_reset_key($key, $login);

	if(is_wp_error($validation)) {

        $result['is_valid'] = false;
        $result['message'] = 'The link you followed either expired or is invalid. Please refresh.';
		
	}

	return $result;

}, 10, 5);

// Validation success, let's change the password
add_action('gform_after_submission_100', function($entry, $form) {
	
	$login = sanitize_text_field($_GET['login']);
	$user = get_user_by('login', $login);
		
	if($user) {
	
		wp_set_password(rgar($entry, '1'), $user->ID);
		
	}
	
}, 10, 2);

Step 4: Create a new page and embed the new Gravity Form to this page

In order for users to create a new password, they’ll need public access to the new form you’ve imported (or setup) in this article. To do so, simply create a new page and then embed the form on the page. You’ll need to note down the page ID as we will use it in the next step for a flawless integration.

Please note: if you have read the previous article in Step 1 and are continuing this tutorial, at the very end you’ll end up with two forms and two pages that you have to create. The first form is to handle the user’s email address so they can receive a reset password email and the second form (in this article) is so the user can actually create new password and update their account.

FREEBIE!

Got Gravity Forms? You'll need Cloudflare Turnstile.

Protect your forms from those pesky spammers with our Cloudflare Turnstile plugin for Gravity Forms. A super lightweight plugin.

Find Out More

Step 5: Change the initial redirect in Part 1

In part one, you added a filter to your functions.php file to the first form after submission. That filter was gform_notification_99 and one line contained part of the code site_url('wp-login.php'). You’ll need to change this part of the code to redirect to your new password reset form (which is the page you created in Step 4) by replacing it with get_the_permalink(PAGE_ID) (PAGE_ID = the page ID you saved in Step 4); Once you do that, the add_filter code may look something like this:

// After forgot password submission
add_filter('gform_notification_99', function($notification, $form, $entry) {

    // Send the forgot password email
    $user = get_user_by('email', rgar($entry, '1'));
    
    if($user->ID)
    {
        $displayName = $user->display_name;
        $reset_link = add_query_arg([
            'key' => get_password_reset_key($user),
            'login' => urlencode($user->user_login)
        ], get_the_permalink(123456789));

        $notification['message'] = str_replace('{full_name}', $displayName, $notification['message']);
        $notification['message'] = str_replace('{password_link}', $reset_link, $notification['message']);
    }

    return $notification;

}, 10, 3);

Once you’ve changed this filter to redirect to your new password reset form page, the user who receives an email notification about the password reset will be sent to the new form you’ve created and then may proceed to change their password.

Step 5: Test!

The next step is to test the form! This is the most important step. You should get all the way to the confirmation message and the password of the user account will have been reset. Once you do, you know it’s working 100%!