Password page not applying custom font to heading? (Dawn theme)

Store Design
, ,
1

Hi there, I am using Dawn theme and have managed to make the rest of my website use Piersans Bold (a custom font) for headings, but on my password page the heading is staying on the default (Times New Roman?).

I used this tutorial: https://www.youtube.com/watch?v=jj6frF-SW3s

I would greatly appreciate some help on how to code the heading on the password page to the Piersans Bold font as on the rest of the website.

Password page here where it says “Join the movr movement.”: https://www.movr.uk/password.

Thank you in advance.

Harry.

2

Hey @harrymovr ,

Try adding the font family in your section-email-signup-banner.css file like this:

.email-signup-banner .newsletter-form,
.email-signup-banner .newsletter-form__field-wrapper {
  display: inline-block;
  font-family: Pier Sans Bold;
}

.email-signup-banner__box .email-signup-banner__heading {
  margin-bottom: 0;
  font-family: Pier Sans Bold;
}

Let me know if this works. Thanks.

3

Hi @harrymovr

You can follow this suggestion

Find the password.liquid file in the Layout folder and add this code in front of the {% endstyle %} tag

 @font-face {
        font-family: 'PierSans-Bold';
        src: url('https://cdn.shopify.com/s/files/1/0716/6794/1665/files/PierSans-Bold.woff?v=1684728877') format('woff2');
      }

BSSCommerce_0-1684738491986.png
BSSCommerce_0-1684738491986.png1559×512 38.9 KB

and navigate to --font-heading-family and change it to ‘PierSans-Bold’ !important (as image below)

BSSCommerce_1-1684738506736.png
BSSCommerce_1-1684738506736.png1540×610 42.2 KB

4

Thank you for your time and advice! Unfortunately, it didn’t work this time. But I resolved it from the other comment.

5

Thank you for providing this solution, it appears to have worked. I have tried everything for about 4 days. Brilliant cheers.

6

Do you by chance know how to make adobe fonts appear in the password page? it feels like I have tried everything but it doesnt work.

I have added the projects like both in theme.liquid and password.liquid and I have added this part of the code: :root {
–font-body-family: “field-gothic-xwide”, sans-serif; !important;
–font-heading-family: “field-gothic-xwide”, sans-serif; !important;
}

both in base.css and section-password.css. but it still isnt working, would appriciate some help I’ve been at this for days now. BTW the font works fine on all the other pages