How can I add a custom font to the Publisher theme?

Store Design
, , ,
1

Hello community!

I am attempting to add a custom font to the Publisher theme.

  • I’ve uploaded a file “enchanted_land-webfont.woff2” to my files
  • I’ve added the following to my base.css code:
@font-face {
  font-family "Enchanted Land";
  src: url("https://cdn.shopify.com/s/files/1/0563/1793/5734/files/enchanted_land-webfont.woff2?v=1705611630") format("woff2");
}

h1, h2, h3, h4, h5 {
    font-family: "Enchanted Land" !important;
  }

This is also beneath the last bit of code, don’t know if it is contradictory to it:

h1,
h2,
h3,
h4,
h5,
.h0,
.h1,
.h2,
.h3,
.h4,
.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;
}

Preview of the store here: https://tsgfmi5f515ubidy-56317935734.shopifypreview.com

Thank you. Any help would be much appreciated!

2

Hello @916designco :waving_hand:

You miss a colon after font-family

Screenshot 2024-01-19 at 11.09.44.png