Overview of the built-in web templates
Raytha comes with public account management such as login, change password, forgot password, etc.
To modify Raytha's built-in web templates, follow these steps:
Navigate to the Templates section in the left side navigation menu. Select the built-in template that you wish to modify. Click the Edit button. Please note: You must have the necessary permissions to modify templates in order to make changes.
Some of the built-in templates have associated target variables and form submission endpoints. For example, the Change Password template has these features. See the Change Password template below.
<div class="ud-login-logo">
<h3>Change password</h3>
</div>
{% if Target.ValidationFailures["__ValidationSummary"] %}
<div class="alert alert-danger">
{{ Target.ValidationFailures["__ValidationSummary"] }}
</div>
{% elsif Target.SuccessMessage %}
<div class="alert alert-success">
{{ Target.SuccessMessage }}
</div>
{% endif %}
<form
class="ud-login-form"
action="/account/me/change-password"
method="post">
<div class="ud-form-group">
<label for="currentpassword" class="form-label">Current password</label>
<input
id="currentpassword"
type="password"
name="CurrentPassword"
{% if Target.ValidationFailures["CurrentPassword"] %}class="is-invalid"{% endif %}>
{% if Target.ValidationFailures["CurrentPassword"] %}
<div class="invalid-feedback">{{ Target.ValidationFailures["CurrentPassword"] }}</div>
{% endif %}
</div>
<div class="ud-form-group">
<label for="newpassword" class="form-label">New password</label>
<input
id="newpassword"
type="password"
name="NewPassword"
{% if Target.ValidationFailures["NewPassword"] %}class="is-invalid"{% endif %}>
{% if Target.ValidationFailures["NewPassword"] %}
<div class="invalid-feedback">{{ Target.ValidationFailures["NewPassword"] }}</div>
{% else %}
<div class="form-text">Password must be at least 8 characters.</div>
{% endif %}
</div>
<div class="ud-form-group">
<label for="confirmnewpassword" class="form-label">Confirm new password</label>
<input
id="confirmnewpassword"
type="password"
name="ConfirmNewPassword"
{% if Target.ValidationFailures["ConfirmNewPassword"] %}class="is-invalid"{% endif %}>
{% if Target.ValidationFailures["ConfirmNewPassword"] %}
<div class="invalid-feedback">{{ Target.ValidationFailures["ConfirmNewPassword"] }}</div>
{% else %}
<div class="form-text">Password must match the above.</div>
{% endif %}
</div>
<div class="ud-form-group">
<button type="submit" class="ud-main-btn w-100">Save changes</button>
</div>
<input
name="__RequestVerificationToken"
type="hidden"
value="{{ Target.RequestVerificationToken }}" />
</form> The Change Password template uses the Target.ValidationFailures variable, which is a key-value dictionary that displays validation errors for each form field upon submission. In addition, the template includes the Target.RequestVerificationToken hidden field to protect against cross-site request forgery (CSRF) attacks. Move on to the next user guide article by clicking the link under the Continue learning section below.
Continue learning
How Liquid templates work in Raytha
Overview of the built-in web templates
Modifying the built-in email templates