Refresh Theme - Times New Roman as font after adding+removing custom font

Store Design
,
1

Hi!

I have earlier added custom fonts to my page, adding this code in the base.css:

@font-face {

font-family: 'PTSans';
src: url('https://cdn.shopify.com/s/files/1/0747/7909/9435/files/PTSans-Regular.woff2?v=1726870285') format('woff2');

and this code in the theme.liquid:

@font-face {

font-family: 'Raleway';
src: url('https://cdn.shopify.com/s/files/1/0747/7909/9435/files/Raleway-SemiBold.woff2?v=1726869972') format('woff2');

@media screen and (min-width: 750px) {
body {
font-size: 1.6rem;
}

When I no loger wanted these two custom fonts I removed them but now all fonts are Times New Roman and I don’t know what is causing this or what to do!

Can anyone check my code and see if they see any obvious mistakes? Store URL: https://petopiapets.net

![Skjermbilde 2024-10-13 kl. 00.28.04.png|1755x513](upload://x8JuS9zk8UWPYqJUkSfhOmeArPW.png)
2

Hi @MichaelFawx

You need to edit your base.css and put back the default code.

  1. From your Admin page, go to Online Store > Themes
  2. Select the theme you want to edit, click the three dots to edit code
  3. Under the Asset folder, open your base.css file, find the code " font-family: ‘Raleway’ !important;" It is on line 263
  4. Replace the line of code with the code below and then SAVE. You can use the theme editor to change the font
font-family: var(--font-heading-family);

See image for more information

Made4uoRibe_0-1728774970204.png
Made4uoRibe_0-1728774970204.png1362×813 63.2 KB

Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful.

1 Like
3

That’s great, thanks! :grinning_face_with_smiling_eyes:

4

However, I now see that all fonts are headings. I also copied the code you provided to body and p

Here is the current code:

h1,
h2,
h3,
h4,
h5,
.h0,
.h1,
.h2,
.h3,
.h4,
.reviews_title,
.h5 {
  font-family: var(--font-heading-family);
  font-style: var(--font-heading-style);
  font-weight: var(--font-heading-weight);
  letter-spacing: calc(var(--font-heading-scale) * 0.06rem);
  color: rgb(var(--color-foreground));
  line-height: calc(1 + 0.3 / max(1, var(--font-heading-scale)));
  word-break: break-word;
}

body, p, .p {
  font-family: var(--font-heading-family);