Startseite > Template- und Themeprogrammierung > Account- & Passwort-Reset-Templates > password_reset / set_new_password.liquid

set_new_password.liquid

Das Template <keyword>set_new_password.liquid</keyword> rendert den Set-New-Password-Step des Password-Reset-Workflows und ist Schritt 3 des 3-Schritt-Verfahrens mit dem ein Account-Besitzer sein Passwort neu vergeben kann.

Speicherort

Das Template muss unter <keyword>templates/password_reset/set_new_password.liquid</keyword> abgelegt werden.

Verfügbare Objekte

Innerhalb des <keyword>request.liquid</keyword> Templates stehen folgende Objekte zur Verfügung:

Beschreibung

Das hier beschriebene Template ist Schritt 3 in dem 3-Schritt-Verfahren des Password-Reset-Workflow.

Nachdem der Account-Besitzer in Schritt 1 ein Zurücksetzen seines Passworts beantragt hat und durch den Empfang der Email bewiesen hat, dass er der Account-Besitzer ist, kann er innerhalb der Frist (standardmäßig 48 Stunden) den Link in der Email klicken und wird dann auf den hier beschriebenen Set-New-Password-Step im Webshop weiterleitet.

Sehen Sie auch folgende Beschreibungen um den Request-Step für Schritt 1 und das Email-Template für Schritt 2 zu hinterlegen:

Beispiel-Template

Das nachfolgende Beispiel zeigt das Markup des Set-New-Password-Steps.

In dem Beispiel wird ein HTML-Form aufgebaut. Das HTML-Form schickt das neue Passwort und ein Bestätigungspasswort an die Webshop-Software zur Verarbeitung. Damit die Webshop-Software diese Werte verarbeiten kann, müssen die beiden Formularfelder wie hier ersichtlich mit den Werten bestückt werden, die über das <obj>password_reset_workflow:workflow#step-2</obj> Objekt zur Verfügung stehen. Es werden außerdem folgende Fehlerfälle abgefragt, um dem Account-Besitzer eine entsprechende Fehlermeldung anzuzeigen:

  • Erlaubte Gültigkeitsdauer des Links (standardmäßig 48 Stunden) bereits abgelaufen
  • Link wurde bereits benutzt

Beim Absenden des Formulars wird von der Webshop-Software sichergestellt, dass das neue Passwort den Kriterien (standardmäßig mind. 6 Zeichen Länge) genügt und mit dem Bestätigungspasswort übereinstimmt.

<h2>Set new password</h2>


{% assign form = workflow.current_step.forms.password_reset %}

{% if form.post_successful == true %}

  {% comment %}Success message{% endcomment %}

  <p><b>Your password has been changed successfully! You can now login with it.</b></p>

 

{% elsif reset_status == 'link_used' %}

  {% comment %}Link already used message{% endcomment %}

  <p><b>The link for changing the password is invalid, because the password has already been changed.</b></p>

  <p>You can request a new link for changing the password here: <a href="/password_reset/request">I forgot my password</a></p>

 

{% elsif reset_status == 'link_expired' %}

  {% comment %}Link expired message{% endcomment %}

  <p><b>The link for changing the password is invalid, because {{ workflow.current_step.link_duration }} hours have been exceeded.</b></p>

  <p>You can request a new link for changing the password here: <a href="/password_reset/request">I forgot my password</a></p>

 

{% elsif reset_status == 'link_ok' %}

  {% comment %}Set new password form{% endcomment %}


  <p>Please enter a new password. Please note that the new password should be at least {{ shop.config.password_min_length }} characters long</p>


  <form method="post" action="">

 

    {% unless form.valid %}

      <p><b>There are errors in this form.</b></p>

    {% endunless %}

          

    <ul>

      <li>

        {% comment %}Field for new password{% endcomment %}

        <label for="{{ form.fields.password.name }}">New password *</label>

        <input type="password"

               {% if form.fields.password.required %}required{% endif %}

               {% if form.fields.password.max_length %}maxlength="{{ form.fields.password.max_length }}"{% endif %}

               name="{{ form.fields.password.name }}"

               value="{{ form.fields.password.value }}" />

      </li>

      <li>

        {% comment %}Field for repeat new password {% endcomment %}

        <label for="{{ form.fields.password_confirm.name }}">Repeat new password *</label>

        <input type="password"

               {% if form.fields.password_confirm.required %}required{% endif %}

               {% if form.fields.password_confirm.max_length %}maxlength="{{ form.fields.password_confirm.max_length }}"{% endif %}

               name="{{ form.fields.password_confirm.name }}"

               value="{{ form.fields.password_confirm.value }}" />

      </li>

    </ul>


    {% comment %}Submit-Button{% endcomment %}

    <input type="submit" value="Continue">

  </form>

{% endif %}