How to find the code that's overriding the font?

Hi! Whenever I try to change the font, it doesn’t reflect to the online store. I think there’s something overriding it but I cannot find it yet. Can someone help me locate where it could be, please?

Here’s my client’s website: https://7000-islands.de/

Thank you!

Open up the browser developer tools.
Find an item where the font isn’t what you expect.
Inspect the item (element) using the browser developer tools. You’ll be able to see the CSS that is being applied to the item and the computed final values.
From here you can click on the variables or file names to find where abouts the code is in the theme.
Then locate the same file in the theme editor

Right click on your site => Inspect => the stylesheet is there:

Hi Jordan. Sorry, not an expert, can you show a sample of how to do this pls?

For context, the original font is Poppins. I tried to change the font of both Headings & Body font, but the body font doesn’t change/reflect

I’m familiar how to find the font in the stylesheet but I can’t seem to change some font in the Theme Settings

For example, I did change the headings & body font but the body font doesn’t reflect at all. See photo below

Hey Dean,
Theres a couple of things to check here. First if you select the rich text box, check for any custom CSS in the right hand side like so

I’d also Edit the Code and check the assets/scripts/javascript as I can see there is an ECOM EMBED thats also set to Poppins so you’ll need to change this. So I suspect theres some custom code thats setting the font for you

When editting the code you should be able to use CTRL + f to search for Poppins within the files.

I found this information out using what both myself and Kahn suggested.
If you right click and inspect and from there you can dig around the CSS and code that is on the site :slight_smile: