However, for the last step where it asks to paste “your css selector here”, instead of applying it to a specific selector I want to apply it to all text throughout the webite.
To try and do this I’ve pasted the follow code at the bottom of my theme.scss.liquid however it does not update the font on my website (it stays as Merriweather Sans)
h1, h1 a, h2, h2 a, h3, h3 a, h4, h4 a, h5, h5 a, h6, h6 a, #nav li a, div.title a, .headline, .subtitle, .Heading, .Footer { font-family: “Lexend Deca” !important; }
}
Find the class .Heading to the theme.css and change the font-family to the new font that you added, as in the dock
your css selector here { font-family: “NAME OF FONT” !important; }
Instead of NAME OF FONT, in your case, specify Lexand Deca. This should work. You previously specified all the headers: h1,h2,h3, and so on. But for the class, no.
For the future, do the same. You inspect the element, find the class name, and search in theme.css and change the font-family.
From your Shopify admin, go to Online Store > themes.
Locate your current theme and then click Actions > Edit code.
After that in the Assets folder, click to open your theme.scss.liquid file.
Go to the very bottom of this file and paste the following code:
/* Start */
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca&display=swap');
h1, h1 a, h2, h2 a, h3, h3 a, h4, h4 a, h5, h5 a, h6, h6 a, #nav li a, div.title a, .headline, .subtitle, .Heading, .Footer { font-family: 'Lexend Deca', sans-serif !important; }
/* End*/
Ensure that the code was copied exactly from this guide and pasted correctly, making sure no characters or symbols are missing.
Evening, I know this post is years outdated but I’m trying to do this exact thing with dynamic code that switches between multiple stylesheets and am getting this warning when doing this:
