Hi, thank you for your video. I've run into an issue where the is no theme.scss.liquid as apparently Shopify has moved away from this. Is this true? If so, does it mean I am to edit base.css?
Thanks, Andrew, very clear instructions thank you. I'm now looking for the next video to add the custom font to the drop-down in the font settings. (what you were talking about briefly at the end)
This was so helpful, I manage to add my customer fonts but I have noticed that they are not displaying on the mobile version only on deskop. Do you have any advice on how to make them visible on the mobile version? Thank you so much!
Help!!! I don’t have any css with theme in it. What are my options. I read the comments and nobody is having this same problem. In the past it worked, but I had a different theme. Thanks!
Thanks for the tutorial, This worked a treat for one font. I am looking to add two different fonts to match the branding on another website, can this be done and how? Thanks in Advance!
Hi Andrew! I followed all your steps and it looked/ looks great on my computer website, but the font doesn't carry over to my mobile site... any easy fixes? Please help!
is there a new way of doing this as since the shopify update doesnt allow you to upload .otf files directly through the assets folder I cant seem to get it to work. I am using the prestige theme and I have noticed a few people in the comments saying about that particular theme having issues and needing to use otf instead of woff
this is incredible i first wanna thank you for such clear instruction!!! unreal. Anyways my question is about type size, are there ways to bypass the limits on font size through code in shopify? thanks!!
Hi Habib! It looks like you don't have Developer menu enabled on your Safari. To do so, open the Safari browser, click on Safari -> Preferences. Click on Advanced. Check the Show Develop menu in menu bar checkbox. Doing this also allows you to Inspect Elements on iPhones by connecting them also. Tell me how it went :)
There are sections that are under the same group (I mean group like "body"(im not a programer sorry hehe)) but I want them to be separate from each other in style, how should I do it?
Hey! Thanks for a great video. I'm looking for the video you reference about how to add Google fonts to your Shopify store. Can you help, please? Thanks!
Hi Andrew. Very helpful video! Any thoughts on why my changes are reflected on Chrome, yet when I change browsers a couple of sections show a different font? Any solutions on how to solve this issue would be deeply appreciated. Thank you.
Hey, not sure if you’re still looking for the answer. In my experience it is depending on which font files you upload. .woff and .woff2 work on most browsers but some still require a .otf or .ttf file as well
Hi great video! I have a problem. The font changes. But it doesn't change in the right font, it just changes into a classic type font. I have tried multiple fonts they all give the same result. I am using a google font, so any updates on that video about adding google fonts? Thanks!
Hey, great video! But the font just wouldn't for the element I want it to. I'm using the Pipeline theme. The code of the element is: ...... So I'm taking "title--overlay h2" and insert it into the code (without the " "), but the font for the element won't change. If I plug in "h1", the font changes, but also for all other h1s, which I don't want. Can you help me with that? Thank you!
Hi! Custom font is not loading I have this error "OTS parsing error: incorrect file size in WOFF header" any idea on how to solve this ? Tried another font converter to make sure file is not the problem but the issue is still there
Hi Whereabove is the lines of code you said you would provide in the video? I watched all the way through but then couldn't find where it is when I searched below your video. Thank you for the helpful instruction. The conversion idea worked very well.
Tried just copying from what I could see visually in the video but kinda made a mess. If you can provide the line codes that would be great. Thank you.
Hi! I was just wondering if there is a way you can change a particular part of the text without changing other parts of text with the same code? For example, I want to change the code 'span' for a particular heading, but when I add this into my coding it changes a big paragraph of text that I don't want to change and makes it very hard to read. Thanks!
Hi Andrew! Awesome video - but it didn't work for me :( I'm trying to use the font Bigilla (which I bought, woff & woff2 files) and my theme is Impulse by Archetype themes. Can you help me? Hope to hear from you soon!
hey Mandy - strange that it doesn't work - i think at this point you need a dev that jumps into your code and see where there is conflicting info. I try to make the videos fit everyone but its not easy considering there are thousands of different versions of the same codebase out there. Maybe check out HeyCarson they do small jobs like this!
Hi Andrew! Thanks, great video! It works perfectly! After adding the code, my logo in the header menu flashes when I scroll down on the home page. I will appreciate your help, what could be causing this? You are a crack 🙌🏾Merci
HI! Thanks so much for the video. I got it to work however; I have a sticky header and noticed that the changed font only appears on the home page of my site but when clicking on another page the font defaults to another style. Can you share how to make the "added font" work on each page of the sticky header? thank youuuuu!
theme.scss.liquid does not appear in the theme i've selected on shopify under assets. I'm able to find it in another theme i was working on but that theme doesnt fit my site as well as the express theme does. help?
The primary step is to enable the Developer menu. To do so, open the Safari browser, click on Safari -> Preferences. Click on Advanced. Check the Show Develop menu in the menu bar checkbox. The Inspect Element feature should be now enabled.
@@EcomExperts I really like your videos! you are super helpful. Do you mind sending me same code for the @font to copy and paste. I don't seem to find it below. ashleyiramos@gmail.com
PLEASE HELP This line of code is showing up on the debut theme, catalog tab underneath each product after the sold out square family: Griffon,serif; font-weight:400; font style:normal;
This did not work at all, my file name is theme.css for the debut theme. It worked the first time i did this, but after sometime, it stopped. So I change the font because I believed it was a licensing issue. Redid everything step-by-step and still nothing.
I did exactly as video, but when I inspect element the font name appears but it shows a different font like a default font or something, it is not showing the font that I uploaded
Hello Robin, I figured the problem was you have to upload your woff files to shopify files section and then manually copy the link and link it in the code.
Crystal Eyez: "Hi guys, I see a lot of you are having trouble finding "theme.scss.liquid" as Andrew shows in his tutorial. Instead, use "base.css" under the Assets folder and scroll all the way to the bottom, then follow the rest of his instructions. Hope this helps some of you!"
![[2022 FREE] How To Add a SIZE CHART To SHOPIFY Product Pages - Easy Step-By-Step Tutorial](http://i.ytimg.com/vi/VzGYxj6pTIE/mqdefault.jpg)
![ILLSLICK - WINTER IS COMING [Official Video]](http://i.ytimg.com/vi/dwTMeM1zIhQ/mqdefault.jpg)
👊👊 Get access to *THE BEST* Ecommerce Email Marketing course ------ tinyurl.com/nnhrezf7
Hi, thank you for your video. I've run into an issue where the is no theme.scss.liquid as apparently Shopify has moved away from this. Is this true? If so, does it mean I am to edit base.css?
also looking for answer please
Thanks, Andrew, very clear instructions thank you. I'm now looking for the next video to add the custom font to the drop-down in the font settings. (what you were talking about briefly at the end)
THANK YOU SO MUCH!! I've been to France, its such a beautiful place.
Thanks for the video! I was following along but "theme.scss.liquid" was not an option in my assets. any suggestions? thanks again!
Same! I have theme.css without the liquid
@@SuVienChen use theme.css for any file containing css in it. Works fine
This was so helpful, I manage to add my customer fonts but I have noticed that they are not displaying on the mobile version only on deskop. Do you have any advice on how to make them visible on the mobile version? Thank you so much!
Hi Marijana! Did you manage to get this fixed? I'm curious to know as I'm having the same issue.
did you got an answer?
Help!!! I don’t have any css with theme in it. What are my options. I read the comments and nobody is having this same problem. In the past it worked, but I had a different theme. Thanks!
I’m having the same issue
Same problem. I have a District theme and can't find anything like theme.scss.liquid
I don´t have the theme.scss.liquid in my assets folder. I just have theme.css there?
Theme.css will work. :)
Thank you for the great tutorial 👍
Hi! This video was super helpful. QQ - If i want to add more than one font, would i have to repeat the steps or do i another step?
Hi Bro, can you add 2 fonts like a Black and a Medium font ?
Just added the black font but another font is the same process or not?
It is the same process, just change the name of the font and css selector. :)
How do I apply it to the mobile version? I'm using Dawn theme 2.0. I edited base.css for desktop but it doesn't carry over to mobile. Thank you.
Thanks for the tutorial, This worked a treat for one font. I am looking to add two different fonts to match the branding on another website, can this be done and how? Thanks in Advance!
thanks mate, i love you, i hope you have a beautiful day.
You and ROCK! Thank you so much for this tutorial!
Hello, Thank you for this - it was very helpful. I am wondering if you have a training to add third party hosted font on a store. Thank you!
Hi Andrew! I followed all your steps and it looked/ looks great on my computer website, but the font doesn't carry over to my mobile site... any easy fixes? Please help!
did you fix it?
is there a new way of doing this as since the shopify update doesnt allow you to upload .otf files directly through the assets folder I cant seem to get it to work. I am using the prestige theme and I have noticed a few people in the comments saying about that particular theme having issues and needing to use otf instead of woff
This works amazingly. Thank you!
this is incredible i first wanna thank you for such clear instruction!!! unreal. Anyways my question is about type size, are there ways to bypass the limits on font size through code in shopify? thanks!!
This is a great tutorial - thanks mate.
This vid was really good. Do you have your new video on how to add Google font to the Typography section?
hey andrew! what if i wanted to make exceptions on what is affected by font? so for example: if ididnt want every "span" to be affected?
Thanks for the video but it didn't work for me. I did everything exact, I made sure of it. I don't know where I went wrong
Hi, Love your work! My right click wont work on my mac to inspect the text title names. Any suggestions? :/ Thank you so much.
Hi Habib! It looks like you don't have Developer menu enabled on your Safari. To do so, open the Safari browser, click on Safari -> Preferences. Click on Advanced. Check the Show Develop menu in menu bar checkbox. Doing this also allows you to Inspect Elements on iPhones by connecting them also. Tell me how it went :)
@@EcomExperts had the same problem thanks
Can you please also explain how to get the font-variant-ligatures: discretionary-ligatures; in Shopify?
There are sections that are under the same group (I mean group like "body"(im not a programer sorry hehe)) but I want them to be separate from each other in style, how should I do it?
sounds like you need custom classes
Hey! Thanks for a great video. I'm looking for the video you reference about how to add Google fonts to your Shopify store. Can you help, please? Thanks!
Hi Andrew. Very helpful video! Any thoughts on why my changes are reflected on Chrome, yet when I change browsers a couple of sections show a different font? Any solutions on how to solve this issue would be deeply appreciated. Thank you.
Hey, not sure if you’re still looking for the answer. In my experience it is depending on which font files you upload. .woff and .woff2 work on most browsers but some still require a .otf or .ttf file as well
Have you made the video about adding the font to the font_picker options?
by the look of it, i don't think u can add custom fonts from the picker. i hope i'm wrong.
Hi great video! I have a problem. The font changes. But it doesn't change in the right font, it just changes into a classic type font. I have tried multiple fonts they all give the same result.
I am using a google font, so any updates on that video about adding google fonts? Thanks!
Honestly at this point it might be easier to use a free app in the shopify app store like fontio
Hey, great video! But the font just wouldn't for the element I want it to. I'm using the Pipeline theme. The code of the element is: ...... So I'm taking "title--overlay h2" and insert it into the code (without the " "), but the font for the element won't change. If I plug in "h1", the font changes, but also for all other h1s, which I don't want. Can you help me with that? Thank you!
Hi! Custom font is not loading I have this error "OTS parsing error: incorrect file size in WOFF header" any idea on how to solve this ? Tried another font converter to make sure file is not the problem but the issue is still there
Hi Whereabove is the lines of code you said you would provide in the video? I watched all the way through but then couldn't find where it is when I searched below your video. Thank you for the helpful instruction. The conversion idea worked very well.
Tried just copying from what I could see visually in the video but kinda made a mess. If you can provide the line codes that would be great. Thank you.
Follow this link and you'll get it in your inbox:
zfrmz.com/MLm2oiSwD0OIJuUuYRr5
Config getting in the way? schema + data and the font picker stopping it from displaying
Don't know why but it didn't work for me. I'm using the Narrative theme on Shopify. Can you help? Thanks
Hi! I was just wondering if there is a way you can change a particular part of the text without changing other parts of text with the same code? For example, I want to change the code 'span' for a particular heading, but when I add this into my coding it changes a big paragraph of text that I don't want to change and makes it very hard to read. Thanks!
you'll need a custom class
Use tag and assign the CSS
Hi Andrew! Awesome video - but it didn't work for me :( I'm trying to use the font Bigilla (which I bought, woff & woff2 files) and my theme is Impulse by Archetype themes. Can you help me? Hope to hear from you soon!
hey Mandy - strange that it doesn't work - i think at this point you need a dev that jumps into your code and see where there is conflicting info. I try to make the videos fit everyone but its not easy considering there are thousands of different versions of the same codebase out there. Maybe check out HeyCarson they do small jobs like this!
Hi Andrew! Thanks, great video! It works perfectly! After adding the code, my logo in the header menu flashes when I scroll down on the home page. I will appreciate your help, what could be causing this?
You are a crack 🙌🏾Merci
I found the error😅👌🏾. Thank you!
Nice to hear that you found the issue :)
HI! Thanks so much for the video. I got it to work however; I have a sticky header and noticed that the changed font only appears on the home page of my site but when clicking on another page the font defaults to another style. Can you share how to make the "added font" work on each page of the sticky header? thank youuuuu!
the class must be different on the other pages - use inspect from chrome to isolate it. Fontio has an easy custom class picker
Thanks Andrew! This video was super helpful.
Please send me the link of font converter website that you used in vedio...
My problem is that the new font shows on desktop but not on mobile how do I fix this issue
I wish i could figure this out - works great on chrome-PC but does not work at all on chrome-Mobile (android). Why does this not work for mobile?
Andrew exited for a video about the font on the phone📲👍🏾
Coming out in the next few weeks. :)
@@EcomExperts Great video. However, I am having difficulties with the font not showing on mobile. Has this video come out yet?
Can someone help me find the link for the code he provided 5:51 mark?
theme.scss.liquid does not appear in the theme i've selected on shopify under assets. I'm able to find it in another theme i was working on but that theme doesnt fit my site as well as the express theme does. help?
Thank you andrew! God bless your heart.
Our pleasure!
Hi andrew after I done the code it wasn’t letting me save. It saying an error
So i only want it on my header on my front page but it applies to my other titles in the website
So to do two different fonts u have to code it
So I'm on a Mac and whenever I preview the site and then right click on text, I don't have the "inspect" function
only on google chrome browser :)
The primary step is to enable the Developer menu. To do so, open the Safari browser, click on Safari -> Preferences. Click on Advanced. Check the Show Develop menu in the menu bar checkbox. The Inspect Element feature should be now enabled.
Hi, i'm using impulsive theme and when i upload the woff2 to asset, it doesn't appear at all
Legend! Thanks so much
Glad it helped!
where is the link bellow for the
bit of code
Awesome! Merci beaucoup!
Thank you!
Such a cool video I only have the theme.css under assets still gave it a shot and didn't work
It should work! Try again :)
@@EcomExperts I've also tried this and it doesn't seem to work for me.
Hey bro, I'm so lost. The link via your email gives my 5 pages of code... where do I find the "@font" section to copy and past?
Hi Ben! Check your email again please. You should only get 2 pages of instructions and a small block of code. Tell me how it went!
@@EcomExperts I really like your videos! you are super helpful. Do you mind sending me same code for the @font to copy and paste. I don't seem to find it below. ashleyiramos@gmail.com
@andrew i need the @ code please
You didn't provide the case selector copy and paste thing :'S
Hi there, I can't find the code for the new font?
IMPORTANT! One step was forgotten! Make sure to add the fonts as new assets classes!!! That's how itll show up on everyone elses!
Hi Nick how you do tha?
Good video !! Thank you for your help
Glad it helped!
Is there any way to change the fonts in your theme's 'Typography' editor?
You can change fonts, but you can't upload custom fonts :)
@@EcomExperts too bad
After following all of the steps, my font is not translating onto my website. Advice?
This is great! got instructions over email - thank you so much!
Glad it was helpful!
I used this on my shopify site, and it worked on my dell computer, but when I look on apple devices it reverts to the original font. Please help!
Hi Cora! It looks like your theme is using diferent fonts for mobile. Which theme are you using?
@@EcomExperts I actually just paid for a font app to put it in for me. I was having a lot of trouble. But Thankyou for replying back!
how to paste font code, i only have woff file,but don't know how to read it and paste. thanks for your video
Watch the video again :)
That was some good french! "les goûts et les couleurs ne se discutent pas"
PLEASE HELP This line of code is showing up on the debut theme, catalog tab underneath each product after the sold out square family: Griffon,serif; font-weight:400; font style:normal;
SOLUTION: change WOFF2 to WOFF, DELETE OLD ASSET AND REMEMBER TO CORRECT THE NAME.
What if i want the yourcssselectorhere to be my site navigation, i cant find it?
Just check what css selector is your navigation using :)
You're awesome
ttf format also worked
so no need of change of file format
My woff file doesn’t download to a zip file on my Mac.
Neither does mine :( This is where I am stuck at, someone please help :(
Where is the liquid code?
This did not work at all, my file name is theme.css for the debut theme. It worked the first time i did this, but after sometime, it stopped. So I change the font because I believed it was a licensing issue. Redid everything step-by-step and still nothing.
Why dont the changes show on mobile?
How do we change the font from what we changed it to 😩😩😩
my custom font doesn´t apply to my mobile page`??
I did exactly as video, but when I inspect element the font name appears but it shows a different font like a default font or something, it is not showing the font that I uploaded
I have the same, did you figure out the cause?
@@robinvanderpol3069 unfortunately not
Hello Robin, I figured the problem was you have to upload your woff files to shopify files section and then manually copy the link and link it in the code.
@@amrsalama151 You're the MAN. Thank you!
I try to follow your tutorials but I never have the same files. What gives?
Crystal Eyez: "Hi guys, I see a lot of you are having trouble finding "theme.scss.liquid" as Andrew shows in his tutorial. Instead, use "base.css" under the Assets folder and scroll all the way to the bottom, then follow the rest of his instructions. Hope this helps some of you!"
I don't have the theme.scss.liquid in my assets folder
What about stylesheet.css.liquid ? :)
What about the schema?
it didnt work for me, it changed to font to a random other font instead
Hi, did you make a duplicate of your theme? If you did you can try it again. :) This should work, but only if you follow it step-by-step.
Where's the video for adding the font to the customization section? This was super helpful but that's what I really need! 😭
Coming soon!
@@EcomExperts NEED THIS TOO, NEED TO BE ABLE TO CHOOSE MY FONT EASY AND SWAP IT THANK YOU. LOVE YOUR VIDEOS
@@EcomExperts Is this video released yet?
how you do it without uploading it
I don't see the link for the code anywhere. Please help?
First link in the description box :)
@@EcomExperts 3rd link for me ;)
How to add this on typography selector
I am not sure I follow. Can re-phrase your question?
it's been 2 years and you still haven't uploaded a separate video on how to add your font on the list of the customizer, or maybe you can't?
Instead of altering the CSS itself?
You can change fonts, but you can't upload custom fonts :)
hey question, the font isn't showing up on mobile but it is on desktop. how can i fix this?
Which theme are you using? :)
@@EcomExperts Same here. I'm using the Ride theme.
I like the way you put all this useless stuff in the description but you miss the actual good stuff like the code
It's the first link in the description :D
yeahh nothing's working for me unfortunately, I guess it's just specific for my program or something but sans is okay I guess
It should work. Which theme are you using?
@@EcomExperts It didn't work for me either. I'm ussing Express theme.
@@EcomExperts I'm using Motion Theme and it didn't work for me
didn't work for me either I'm using Prestige theme. Did you find a way to make it work?
I dont see the codes here. :(
Hi! You should get it in your inbox. If you don't see it in the primary inbox, there is a chance it ended up in the promotions folder. :)
@@NQuiz52 Hi! Just choose from the dropdown and you should get it zfrmz.com/MLm2oiSwD0OIJuUuYRr5
Anyone else can't get it to work? My 'theme.liquid' file is not even in the Assets folder, it's in Layout.
Theme.liquid should be in the Layout folder. What are you missing? :)
@@EcomExperts Thanks for replying! Figured it out, I was using a different theme - Dawn. It has a base.css folder instead.
@@AliseChachka were you able to change it for mobile? I'm using dawn also but only desktop version works.
@@floatingodds no :( that's so annoying. let's let each other know if anyone of us finds the solution
@@AliseChachka bummer. Will do! Will spend some time researching today.
not working anymore :(
th-cam.com/video/UjWU3XLgT1E/w-d-xo.htmlsi=3CwYzbZZBKqDYSQT | New video Add a CUSTOM FONT To Your Shopify Store
I dont see the codes here
Hi Daniela! Click on the first link in the description box. :)
this did not work for me
It should work for the most of the Shopify themes. :)
THIS DOES NOT WORK! It only looks like it works on your website, but doesn't translate to others. BEWARE!