Reset password html error in Dawn theme, does not show a link to reset password, instead it shows the html code, please could somebody help, thanks.
The text for this is in the default theme content under Checkout & System > Errors > reset password html.
Hi @HP92P ,
Yes, Basically, there is a problem in code. You need to edit the file - main-account-register.liquid. Please let me know if you can check it or provide me the collaborative code so that I can fix it for you.
This usually happens when the reset password HTML contains raw code instead of proper Liquid or text formatting. Shopify renders it as plain text if the HTML isn’t properly escaped or if the {{ reset_password_url }} variable isn’t used correctly.
Under Checkout & System → Errors → reset password html
Hi @HP92P,
Please go to Actions > Edit code > sections > main-reset-password.liquid file and change all code to following file:
{{ 'customer.css' | asset_url | stylesheet_tag }}
{%- style -%}
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
}
@media screen and (min-width: 750px) {
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top }}px;
padding-bottom: {{ section.settings.padding_bottom }}px;
}
}
{%- endstyle -%}
<div class="customer reset-password section-{{ section.id }}-padding">
<h1>
{{ 'customer.reset_password.title' | t }}
</h1>
<p>
{{ 'customer.reset_password.subtext' | t }}
</p>
{%- form 'reset_customer_password' -%}
{%- if form.errors -%}
<h2 class="form__message" tabindex="-1" autofocus>
<span class="visually-hidden">{{ 'accessibility.error' | t }} </span>
<span class="svg-wrapper">
{{- 'icon-error.svg' | inline_asset_content -}}
</span>
{{ 'templates.contact.form.error_heading' | t }}
</h2>
<ul>
{%- for field in form.errors -%}
<li>
{%- if field == 'form' -%}
{{ form.errors.messages[field] }}
{%- else -%}
<a href="#{{ field }}">
{{ form.errors.translated_fields[field] | capitalize }}
{{ form.errors.messages[field] }}
</a>
{%- endif -%}
</li>
{%- endfor -%}
</ul>
{%- endif -%}
<div class="field">
<input
type="password"
name="customer[password]"
id="password"
autocomplete="new-password"
{% if form.errors contains 'password' %}
aria-invalid="true"
aria-describedby="password-error"
{% endif %}
placeholder="{{ 'customer.reset_password.password' | t }}"
>
<label for="password">
{{ 'customer.reset_password.password' | t }}
</label>
{%- if form.errors contains 'password' -%}
<small id="password-error" class="form__message">
<span class="svg-wrapper">
{{- 'icon-error.svg' | inline_asset_content -}}
</span>
{{ form.errors.translated_fields.password | capitalize }}
{{ form.errors.messages.password }}
</small>
{%- endif -%}
</div>
<div class="field">
<input
type="password"
name="customer[password_confirmation]"
id="password_confirmation"
autocomplete="new-password"
{% if form.errors contains 'password_confirmation' %}
aria-invalid="true"
aria-describedby="password_confirmation-error"
{% endif %}
placeholder="{{ 'customer.reset_password.password_confirm' | t }}"
>
<label for="password_confirmation">
{{ 'customer.reset_password.password_confirm' | t }}
</label>
{%- if form.errors contains 'password_confirmation' -%}
<small id="password_confirmation-error" class="form__message">
<span class="svg-wrapper">
{{- 'icon-error.svg' | inline_asset_content -}}
</span>
{{ form.errors.translated_fields.password_confirmation | capitalize }}
{{ form.errors.messages.password_confirmation }}
</small>
{%- endif -%}
</div>
<button>
{{ 'customer.reset_password.submit' | t }}
</button>
{%- endform -%}
</div>
{% schema %}
{
"name": "t:sections.main-reset-password.name",
"settings": [
{
"type": "header",
"content": "t:sections.all.padding.section_padding_heading"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_top",
"default": 36
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_bottom",
"default": 36
}
]
}
{% endschema %}
If I helped you, then a Like would be truly appreciated.
Hi thank you for your help but this didn’t work unfortunately
Hi @HP92P,
Please go to sections > main-register.liquid file and change all code:
{{ 'customer.css' | asset_url | stylesheet_tag }}
{%- style -%}
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
}
@media screen and (min-width: 750px) {
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top }}px;
padding-bottom: {{ section.settings.padding_bottom }}px;
}
}
{%- endstyle -%}
<div class="customer register section-{{ section.id }}-padding">
<h1>
{{ 'customer.register.title' | t }}
</h1>
{%- form 'create_customer', novalidate: 'novalidate' -%}
{%- if form.errors -%}
<h2 class="form__message" tabindex="-1" autofocus>
<span class="svg-wrapper">
{{- 'icon-error.svg' | inline_asset_content -}}
</span>
{{ 'templates.contact.form.error_heading' | t }}
</h2>
<ul>
{%- for field in form.errors -%}
<li>
{%- if field == 'form' -%}
{%- if form.errors.messages[field] contains 'reset your password' -%}
This email address is already associated with an account. If this account is yours, you can <a href="/account/login#recover">reset your password</a>
{%- else -%}
{{ form.errors.messages[field] }}
{%- endif -%}
{%- else -%}
<a href="#RegisterForm-{{ field }}">
{{ form.errors.translated_fields[field] | capitalize }}
{{ form.errors.messages[field] }}
</a>
{%- endif -%}
</li>
{%- endfor -%}
</ul>
{%- endif -%}
<div class="field">
<input
type="text"
name="customer[first_name]"
id="RegisterForm-FirstName"
{% if form.first_name %}
value="{{ form.first_name }}"
{% endif %}
autocomplete="given-name"
placeholder="{{ 'customer.register.first_name' | t }}"
>
<label for="RegisterForm-FirstName">
{{ 'customer.register.first_name' | t }}
</label>
</div>
<div class="field">
<input
type="text"
name="customer[last_name]"
id="RegisterForm-LastName"
{% if form.last_name %}
value="{{ form.last_name }}"
{% endif %}
autocomplete="family-name"
placeholder="{{ 'customer.register.last_name' | t }}"
>
<label for="RegisterForm-LastName">
{{ 'customer.register.last_name' | t }}
</label>
</div>
<div class="field">
<input
type="email"
name="customer[email]"
id="RegisterForm-email"
{% if form.email %}
value="{{ form.email }}"
{% endif %}
spellcheck="false"
autocapitalize="off"
autocomplete="email"
aria-required="true"
{% if form.errors contains 'email' %}
aria-invalid="true"
aria-describedby="RegisterForm-email-error"
{% endif %}
placeholder="{{ 'customer.register.email' | t }}"
>
<label for="RegisterForm-email">
{{ 'customer.register.email' | t }}
</label>
</div>
{%- if form.errors contains 'email' -%}
<span id="RegisterForm-email-error" class="form__message">
<span class="svg-wrapper">
{{- 'icon-error.svg' | inline_asset_content -}}
</span>
{{ form.errors.translated_fields.email | capitalize }}
{{ form.errors.messages.email }}.
</span>
{%- endif -%}
<div class="field">
<input
type="password"
name="customer[password]"
id="RegisterForm-password"
aria-required="true"
{% if form.errors contains 'password' %}
aria-invalid="true"
aria-describedby="RegisterForm-password-error"
{% endif %}
placeholder="{{ 'customer.register.password' | t }}"
>
<label for="RegisterForm-password">
{{ 'customer.register.password' | t }}
</label>
</div>
{%- if form.errors contains 'password' -%}
<span id="RegisterForm-password-error" class="form__message">
<span class="svg-wrapper">
{{- 'icon-error.svg' | inline_asset_content -}}
</span>
{{ form.errors.translated_fields.password | capitalize }}
{{ form.errors.messages.password }}.
</span>
{%- endif -%}
<button>
{{ 'customer.register.submit' | t }}
</button>
{%- endform -%}
</div>
{% schema %}
{
"name": "t:sections.main-register.name",
"settings": [
{
"type": "header",
"content": "t:sections.all.padding.section_padding_heading"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_top",
"default": 36
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_bottom",
"default": 36
}
]
}
{% endschema %}
Hi @HP92P ,
Basically, what you can do is send the collaborative code here and we will fix it.