Implemented in Magnolia CMS 4.5.7, Public User Registration 1.4.2

 

The demo-project site does not provide a default means for public users to retrieve their password. This tutorial shows you how to configure a password retrieval strategy that works like this:

  1. A registered public user clicks the Forgotten password? link on the demo-project/members-area/login page.
  2. The user is directed to a /password-reminder page where they enter their username.
  3. An email containing a link to a new password-change page is sent to the user. This link remains valid for a specified period of time.
  4. The user resets their password on this page and then receives an email confirming the password change.

This password retrieval strategy uses the STK and requires Magnolia CMS 4.5.7 and Public User Registration module 1.4.2 or later.

Configure the new retrieval strategy

To configure a new password retrieval strategy:

  1. Go to Configuration > /modules/public-user-registration/configuration/passwordRetrievalStrategy.
  2. Change the value of the class property to info.magnolia.module.publicuserregistration.password.MailChangePasswordLinkStrategy. This class mails a link to a user's email address. The link directs the use to the targetPage (see below). The link includes the user ID and a token that expires in 30 minutes.
  3. Add six data nodes:
    1. emailTemplate and set the value to publicuserregistration/components/password-reset-email.ftl. You can view this template in Git.
    2. fromEmail: Email address that is displayed in the From field.
    3. fromName: Name of the sender.
    4. subject: Email subject line.
    5. targetPage: The page that the email link directs to. You will create this page in Create a password change form below.
    6. tokenExpirationTime: The time in minutes that the token remains valid. This value overrides the default of 30 minutes.

Create a new component

Create a new form component definition in Templating Kit > Template Definitions.

  1. Go to /components/pur and copy the stkPURPasswordForm component definition.
  2. Rename the new component to stkPURPasswordChangeForm.
  3. In the new component definition:
    1. Add a new data node redirectWithParams and set the value to true. If you leave out this property the user ID will be lost after a failed form submission and cannot be retrieved.
    2. Change the values of the title and descriptions properties so you will be able to identify the component when you later add it to a page.
    3. Change the name of the class in /formProcessor/class to info.magnolia.module.publicuserregistration.processors.TokenPasswordProcessor. This processor takes tokens from the URL and checks whether the token is valid or not. If valid, the password will be changed.

Make the component available

Make the new component available in the stkPublicUserRegistration template.

  1. Go to In Templating Kit > Template Definitions /pages/stkPublicUserRegistration.
  2. Add a new content node under /areas/main/areas/content/availableComponents and name it stkPURPasswordChangeForm to correspond with the new component definition created above.
  3. Add a data node id and set the value to the path to the new component definition i.e. standard-templating-kit:components/pur/stkPURPasswordChangeForm.

Create a password change form

Create a new form on a Web page.

  1. In Website, create a new page based on the stkPublicUserRegistration template under /demo-project/members-area/password-reminder and name it for example password-change. The new form will reside on this page. The email link will direct users to the page to change their passwords.



  2. Open the new page and add the new component to it.
  3. Configure the form in the component dialog with your own version of the content in the screenshots below. For more information about configuring forms see the Form and Public User Registration module documentation.
    1. Form tab: This content is displayed on the page above the field sets.



    2. Submit settings tab: This content is displayed on the page after submission of the form.



    3. Confirmation Email tab: This is the content of the email sent to the user after they have changed their password



  4. Add a new Form Fieldsets component with:
    1. Two mandatory Password fields that use Passwords validation. The first is for entry of the new password and the second to confirm it. Note that the Field Names must be password and passwordConfirmation because the system expects to find these fields. but you can label them as you like.
    2. A Submit button field.

Your form should look simiar to this.

Edit the password-reminder page

The default demo-project/members-area/password-reminder page contains the form for a user to submit their username in order to retrieve their password. By default, this form is configured to automatically send a email containing the user's password and redirect them to the /members-area/password-reminder/password-change-confirmation page on successful submission of the form. This behaviour does not fit in with our new strategy.

Make the following changes to the default pages:

  1. On the /password-reminder page, in the:
    1. Form tab: Edit the introductory text in the Password Retrieval Form component to read something like "Enter your username and we will send a password-reset link to your registered email address".
    2. Submit settings tab: You can optionally add content to the Text field to advise the user that the email has been sent and delete the link in the Page displayed after submission field.
    3. Confirmation E-Mail tab: Deselect Send confirmation, alernatively delete the contents of all fields.
  2. Depending on what you did in 1.b above, de-activate or delete the /password-reminder/password-change-confirmation page or edit the content of the Text and Image component on the page to read something like "A password-reset link has been sent to the address you provided".

Activate the content

Next, activate all the changes to the public instance. Here's a list of nodes:

  • Configuration: /modules/public-user-registration/configuration/passwordRetrievalStrategy.:
  • Website: demo-project/password-reminder (including subpages).
  • Templating Kit > Template Defintions: /components/pur/stkPURPasswordChangeForm and /pages/stkPublicUserRegistration/areas/main/areas/content/availableComponents.

Test the strategy

First check that your SMTP settings are working and activated.

Next, on the public instance:

  1. Register a new account: On the Members Area page click Request New Account and fill in the form. You receive an email containing a verification link. Verify your account and login to the members area.
  2. Logout and click Forgotten password?. Enter the username registered in 1. and click RETRIEVE PASSWORD.



  3. Depending on your setup, the page reloads to advise that the email has been sent or you are redirected to the /password-reminder/password-change-confirmation page where a similar message displays.



  4. Click CLICK HERE in the email to redirect you to the /password-change page. Enter and retype a new password and click SUBMIT 



  5. The Success message displays and you receive an email confirming the password change. 



  6. Login with the new password.