Wow, after watching many, many videos for hours and still not being able to get it, you were able to show me how to do it in less than 5 minutes. You are awesome!
I noticed yours didn't change to the font you downloaded. Neither did mine. It changed to some font but it wasn't the one I wanted. Anyone else have this issue?
@@hashirkhattak9180 For this to work, you must just upload the file in assets, then go to customize theme > Custom CSS > and put h1 there, h3, h4, h5, h6, the, body { font-family: "amine"; } Interestingly, the font was amina-medium, and it remained as a generic font. so I tried just amine, and it worked. I thank the owner of the channel who only responded to comments of praise and did not answer this question from subscribers...
You are literarly the best. Can't thank enough for this video, honestly. The way you say 'font' by the way, made me spit my water I drank I laughed so much, sooo cute :)
Hi, I'm sorry but the font on the end of the video doesn't seem to be the one you downloaded or am I blind? It' just random fallback serif font, not the Rubady. However everybody here in the comments report success, so I'm confused :D
@jankko7@@congthinhhoang7111 @zkdesigners I tried this method months ago and it worked. Recently I updated my theme (Sense) to the most recent update and not all custom code carried over with the update, so my font reverted back to the fallback serif font. I tried again just now to use this method and can't get it to work, even with tweaking a few things. So that could be the issue.
@@siraffatima For this to work, you must just upload the file in assets, then go to customize theme > Custom CSS > and put h1 there, h3, h4, h5, h6, the, body { font-family: "amine"; } Interestingly, the font was amina-medium, and it remained as a generic font. so I tried just amine, and it worked. I thank the owner of the channel who only responded to comments of praise and did not answer this question from subscribers...
For this to work, you must just upload the file in assets, then go to customize theme > Custom CSS > and put h1 there, h3, h4, h5, h6, the, body { font-family: "amine"; } Interestingly, the font was amina-medium, and it remained as a generic font. so I tried just amine, and it worked. I thank the owner of the channel who only responded to comments of praise and did not answer this question from subscribers...
Can you be a bit clearer as to what needs be put into Custom CSS? I have followed this video accurately, but the font is not working. This seems to be a common problem. I am hoping that your 'fix' will help, but I am not sure precisely what to add. Many thanks if you can help fix this!
i unexpectedly added AN OTF font, later deleted the font on assets and added a new asset with the right WOFF, but website didnt change to the desired appearance of the font. what do i do?
It won’t let me download the .woff file under assets. It’s greyed out. I can only download the .ttf and that didn’t work either. I tried downloading in the general upload area for files and the .woff uploaded, but still doesn’t work to change the font on the website 😢
Hey! This was a great video, however I have a question. This uploads the custom font to my entire website EXCEPT for my cart and my checkout, how do i get it to do that? I added 'system' to the h1,h1,h3 etc list, am i missing something?
hi, great instructions, thank you! Unfortunately, my stars no longer work on the judge me form. These are only shown as squares. but only in the widget form.
this is so great thank you! may i ask - how do you change font size and the custom font doesnt come up on mobile view! are you able to help me? thanks!
In case you are facing this same issue (Your custom font not displaying). Maybe you're getting an error on your browser console saying the font could not be decoded, it turns out uploading the font files to the assets folder is corrupting them. I could fix my issue by uploading them to the files folder instead. Then in the font face rule, for src property, set this: url("{{ 'my-font-name.woff2' | file_url }}") same for the woff url. And that's it.
Thank you, it worked nicely, but when I add page, it seems to be all or nothing. It adds it, but basically to the whole site. I want it mostly to the smaller things instead. Is that possible?
what about adding specific arabic font to the multilanguage store (English/Arabic) in Dawn theme. can you do a video for that. I am trying to add Almarai font to my shopify store but i could not.
hello, i want to change the font in my announcement bar, but I don’t know what code I have to add. It keeps telling me that there is no h1 in this section. Please help me
Hi! Your videos are so helpful! Do you know a way to change the color of a word within a heading? For example, I have a heading that says, "Timeless pieces that turn your home into a sanctuary." I want to change the word sanctuary to a different color. I have already italicized it just fine, but I can not figure out how to adjust the color without affecting the rest of the sentence.
Hi! This was very helpful. I just have one more question. Is it also possible to use this code twice in de base.css? Because I want to use a particular front as h1 to h6 and I want to use an other font for my body text. When I tried this, it wasn’t working. Hope to hear from u soon!
Hi I followed the same steps however the fonts are now changed but not the one I uploaded. I'm trying to change the fonts to ""Atomic age"> Can you please guide me how to do it?
I followed each step according to your video, my shopify theme is Mode, where i tried uploading the font i want but in my page all the font changed to basic Ariel. What should i do?
Hey I don’t know if you still need help but, If you pasted the h1,h2,h3,h4,h5,h6, body,p,a from the description then it doesn’t work. Try typing it and it should work.
I've been using your page to build by own store, first of all thank you sooo much. but man it is frustrating when a code doesnt work. i keep going back and forth. and every time i think yes, this has to be it. NOTHING!!! uuugggh. sigh.
this was very useful, thank you! can you please advise how to add multiple custom fonts, so for example, if the heading font is different from the body font?
Hey Enes !! I followed few videos of yours and always very helpful. I very appreciate your support from far. I wonder If I could ask for a tutorial for the Header, when the header on the home page (in my case) is in white text over a video just like in your shopify, now when I scroll down the white text desappears with the white backround of the page. It would look awesome if the heading fade in with a opacity backround when scrolling down of the video and up. I´ve been loocking and many videos and coding I´ve tried a few but nothing has given me the solution. If you have the time I would very appreciate it. Thank you so far for all your information given. Sally :)
@OnHOW Hi there, It worked for me on Dawn Version 9.0.0 but not on Version 10.0.0 and it would not work for my header and footer as well. Any help id be happy to take! Thanks Great video by the way.
Thank you so much, it did work! However, when I wanted to check the website from my phone, the fonts were not the ones I just added. So that means only people that have installed those particular fonts on their computers/phones are able to see the fonts I customised the website with?
my file upload size is always 0 no matter what font im using to upload to a converter??? I'm doing it as a tff not zip. PLease help. Video was great just isnt letting me convert
I seem to have done everything right and it doesn't seem to be working for me. I used the same theme and everything. went to the same convert page, don't know what seems to be the problem.
Check it out from a private window in browser, because browsers can cache old version of the website elements for longer time and specially fonts and so on. Cheers
The font that shows up on the site at the end isn't the one you downloaded...? I've followed this step by step and the same thing has happened to me. The font has changed but it's not the correct one I'm trying to add?
The display of the font might look different due to Shopify frontend rendering but its the same font. From my experience you might want to test different similar fonts to find the right one for your needs. Cheers
Hey wonderful tutorial. Please can you make a quick video showing how to add bold on to the font. I've looked at all video to see if you created a tutorial for that but find nothing. I would appreciate if you can make that quick video. Thank you.
Thank you so much for your videos! They really help. I tried this step for step bur unfortunately it didn't work.. had someone else has this as well and maybe already found a solution for it? :))
Wait I don't understand, the video didn't changed the font you have. In Dawn theme it's just changing Sans Serif to Serif but not the font I have uploaded
Hey, im sure this one will help. You will find either theme.css or base.css and implement this for one of them because they are the same its just each theme uses a different filename. Cheers
Thank you so much !!! Can you please tell me if there is a website where I can set a certain size and it will automatically set my gif to that ? I need to do it BASED ON SIZE that I SET pls 🙏🏻
@@OnHOWGuy sir I’d like to ask you if I would succeed by only finding a niche and a product in demand with low competition with a nice looking website and profitable margin
Hello Anas you are really doing a great job and i almost watch each and every video of you. But in this particular video i have applied the same thing i want to let you know that the font style is only changing on IOS devices not on android. Kindly do check and i hope you'll find a solution for it. Thank You & keep up the good work 👍
Hey, thank you and i appreciate that. Sorry for the late reply and Yeah unfortunately things changes quick and its hard to keep up, this trick still works on the popular themes just fine. Cheers
You can just go to your content section and add the font to files, copy the file URL it provides, and paste it into the URL section from the code provided here. Your welcome
Wow, after watching many, many videos for hours and still not being able to get it, you were able to show me how to do it in less than 5 minutes. You are awesome!
You're very welcome and glad i could help legend.
Cheers
@@OnHOWGuy not working for me bro i did all the steps chat gpt every thing not working for me what should i do now
I noticed yours didn't change to the font you downloaded. Neither did mine. It changed to some font but it wasn't the one I wanted. Anyone else have this issue?
exactly
@@hashirkhattak9180 For this to work, you must just upload the file in assets, then go to customize theme > Custom CSS > and put h1 there,
h3,
h4,
h5,
h6,
the,
body {
font-family: "amine";
}
Interestingly, the font was amina-medium, and it remained as a generic font. so I tried just amine, and it worked.
I thank the owner of the channel who only responded to comments of praise and did not answer this question from subscribers...
Still need help?
You are literarly the best. Can't thank enough for this video, honestly. The way you say 'font' by the way, made me spit my water I drank I laughed so much, sooo cute :)
Hi, I'm sorry but the font on the end of the video doesn't seem to be the one you downloaded or am I blind? It' just random fallback serif font, not the Rubady. However everybody here in the comments report success, so I'm confused :D
same with mine!
yeah, same. He did not even check 😥
@jankko7@@congthinhhoang7111 @zkdesigners I tried this method months ago and it worked. Recently I updated my theme (Sense) to the most recent update and not all custom code carried over with the update, so my font reverted back to the fallback serif font. I tried again just now to use this method and can't get it to work, even with tweaking a few things. So that could be the issue.
same here
same happened to mine as well.
Hi! Thank you for the tutorial. However I have followed these steps exactly, but the font is still not available, could you help at all?
same
@@siraffatima For this to work, you must just upload the file in assets, then go to customize theme > Custom CSS > and put h1 there,
h3,
h4,
h5,
h6,
the,
body {
font-family: "amine";
}
Interestingly, the font was amina-medium, and it remained as a generic font. so I tried just amine, and it worked.
I thank the owner of the channel who only responded to comments of praise and did not answer this question from subscribers...
hi, i cant upload always error when converting from ttf to woff
literally the best. most clear advice, i spent ages on so many other pages/videos. thank you
is there anyway to change the line height and other such settings in this method?
For this to work, you must just upload the file in assets, then go to customize theme > Custom CSS > and put h1 there,
h3,
h4,
h5,
h6,
the,
body {
font-family: "amine";
}
Interestingly, the font was amina-medium, and it remained as a generic font. so I tried just amine, and it worked.
I thank the owner of the channel who only responded to comments of praise and did not answer this question from subscribers...
Can you be a bit clearer as to what needs be put into Custom CSS? I have followed this video accurately, but the font is not working. This seems to be a common problem. I am hoping that your 'fix' will help, but I am not sure precisely what to add. Many thanks if you can help fix this!
thank you so much! Your code works - it helps me a lot
i unexpectedly added AN OTF font, later deleted the font on assets and added a new asset with the right WOFF, but website didnt change to the desired appearance of the font. what do i do?
This worked perfectly. Thank you sir. You deserve a like and follow
It won’t let me download the .woff file under assets. It’s greyed out. I can only download the .ttf and that didn’t work either. I tried downloading in the general upload area for files and the .woff uploaded, but still doesn’t work to change the font on the website 😢
did step by step but didn't work im using the sense theme, please help
I don't know why it doesn't work i do exatcly the same things :/
same brother
did you got the solution?
no sorry bro@@igicebear7835
Same here
Did you get any solution
this is awesome. what if i wanted to change the kerning??
the font changed but it doesnt look anyhthing smilir to what it should look like
Thanks for your help! Very straightforward!! 👍🏼
Hey! This was a great video, however I have a question.
This uploads the custom font to my entire website EXCEPT for my cart and my checkout, how do i get it to do that? I added 'system' to the h1,h1,h3 etc list, am i missing something?
What if I don't want to add classes in the edit code section?
Instead I would like to use the Custon css in the sections only.
my font doesn't load on mobile. can you help pls
If your font doesn’t show on mobile, this tutorial works ua-cam.com/video/jj6frF-SW3s/v-deo.htmlsi=WROxWVzeZBMnt8rJ
hi, great instructions, thank you! Unfortunately, my stars no longer work on the judge me form. These are only shown as squares. but only in the widget form.
Hey this works for desktop but doesnt show on the phone
this is so great thank you! may i ask - how do you change font size and the custom font doesnt come up on mobile view! are you able to help me? thanks!
Your site is not displaying the RubadyGame font, man. It's falling back to Serif or Times New Roman family.
In case you are facing this same issue (Your custom font not displaying). Maybe you're getting an error on your browser console saying the font could not be decoded, it turns out uploading the font files to the assets folder is corrupting them. I could fix my issue by uploading them to the files folder instead. Then in the font face rule, for src property, set this: url("{{ 'my-font-name.woff2' | file_url }}")
same for the woff url. And that's it.
@@JohannGarrido yeah this still didn't work fo me :(
Hi, for some reason my custom font only shows up on my device and no other devices after following this tutorial. Any help?
for some reason mine is defaulting to times new roman.....any idea why? i followed all steps perfectly. maybe i did something wrong?
Thanks the fot changed but only on pc or computers it doesn't display my font on the mobile phone. Please tell me a fix
You're welcome, Is this still the case ?
Cheers
can this be done for individual sections?
how do I change the font for a specific paragaph in my product page desription on the products section
Will the debutify theme work this way?
does this work for the header?
how about for marketing automations or shopify email?
Thank you, it worked nicely, but when I add page, it seems to be all or nothing. It adds it, but basically to the whole site. I want it mostly to the smaller things instead. Is that possible?
Worked for me. awesome work, thanks
what about adding specific arabic font to the multilanguage store (English/Arabic) in Dawn theme. can you do a video for that. I am trying to add Almarai font to my shopify store but i could not.
Thats an interesting request and i just noted it.
Cheers
Thank you very much I will be waiting for it 😊
Doesn't work, followed the video exactly and it doesn't load the font. Just defaults to new times roman.
Which theme/version you have ? im working on an update for this video.
Cheers
hello, i want to change the font in my announcement bar, but I don’t know what code I have to add. It keeps telling me that there is no h1 in this section. Please help me
Dawn 12.0.0 dldnt work :(
Hey - this changes my font in customize but not in preview / on the live webpage. Do you know why?
I did it the second time, maybe I can help?
Worked like a charm. Thanks for the help!
Hi! Your videos are so helpful! Do you know a way to change the color of a word within a heading? For example, I have a heading that says, "Timeless pieces that turn your home into a sanctuary." I want to change the word sanctuary to a different color. I have already italicized it just fine, but I can not figure out how to adjust the color without affecting the rest of the sentence.
Thank you and glad you think so.
Someone requested that 2 days ago and after you did i will work on it asap.
Cheers
@@OnHOWGuy Yay! Looking forward to the video!
Hi, is there a way to change the font just for one menu item?
Thats a request i have to work on, it requires a custom code and i noted your request and i will work on it.
Cheers
I followed al the steps but the font didn't change for me on the dawn theme. Any help?
same
@@vanwansink-ri8cn I got the solution with another methode if you down I can send it to you
You lost me at around 4:00 when you mentioned to copy the code from font family. No idea how you got there. Can you help and explain?
Google "Fonts" and you'll see many websites providing the fonts to use them.
Cheers
Thank you so much! Very clear, concise, and helpful!
Hi! This was very helpful. I just have one more question. Is it also possible to use this code twice in de base.css?
Because I want to use a particular front as h1 to h6 and I want to use an other font for my body text. When I tried this, it wasn’t working. Hope to hear from u soon!
Were you able to figure this out?
Hi I followed the same steps however the fonts are now changed but not the one I uploaded. I'm trying to change the fonts to ""Atomic age"> Can you please guide me how to do it?
I followed each step according to your video, my shopify theme is Mode, where i tried uploading the font i want but in my page all the font changed to basic Ariel. What should i do?
And are you sure you uploaded the correct file ?
use a different font provider and see.
Cheers
Is it possible to have individual fonts for just the headings?
I think so but i dont have the code in hand, i noted your request and i will work on it.
Cheers
Great tutorial! It was so easy to follow! Thank you for sharing your knowledge!
This didn't work for me....can you help?😔
Hey I don’t know if you still need help but, If you pasted the h1,h2,h3,h4,h5,h6, body,p,a from the description then it doesn’t work. Try typing it and it should work.
Thanks. The fonts changed for some devices by not all with these steps. Any advice on how to have the fonts consistent across all devices
You're very welcome,It might be browser cache issue.
Cheers
How to change the font only on the home page? The name of site
I've been using your page to build by own store, first of all thank you sooo much. but man it is frustrating when a code doesnt work. i keep going back and forth. and every time i think yes, this has to be it. NOTHING!!! uuugggh. sigh.
it didn't work with i don't know why, it is because i am working on spotlight theme ?
please answer me quickly
I did it the second time, maybe I can help?
Tried a few times, started the tutorial over. Didnt work. Maybe my theme?
this was very useful, thank you! can you please advise how to add multiple custom fonts, so for example, if the heading font is different from the body font?
You're welcome, glad it was.
I got that video noted now and i will work on it.
Cheers
very useful video! Have you made the video on how to make multiple fonts? @@OnHOWGuy
Hey Enes !! I followed few videos of yours and always very helpful. I very appreciate your support from far.
I wonder If I could ask for a tutorial for the Header, when the header on the home page (in my case) is in white text over a video just like in your shopify, now when I scroll down the white text desappears with the white backround of the page. It would look awesome if the heading fade in with a opacity backround when scrolling down of the video and up.
I´ve been loocking and many videos and coding I´ve tried a few but nothing has given me the solution. If you have the time I would very appreciate it.
Thank you so far for all your information given.
Sally :)
can you please show a way to fix all errors on page speed insight
I couldn't find the base.css file in the assets. Does anyone having the same issue? How to add a custom font without this file?
Even I am unable to find base.css or theme.css - I can see a theme.js though.. not sure if that's the one where I should be editing
@OnHOW
Hi there,
It worked for me on Dawn Version 9.0.0 but not on Version 10.0.0 and it would not work for my header and footer as well.
Any help id be happy to take!
Thanks
Great video by the way.
Thank you so much, it did work! However, when I wanted to check the website from my phone, the fonts were not the ones I just added. So that means only people that have installed those particular fonts on their computers/phones are able to see the fonts I customised the website with?
Brilliant Video :)
my file upload size is always 0 no matter what font im using to upload to a converter??? I'm doing it as a tff not zip. PLease help. Video was great just isnt letting me convert
me too
Once I uploaded the new font, it is not showing up in my assets menu. Can you help me?
Thats strange, did you change the file extension to woff just like i did ?
@@OnHOWGuy I did. I tried two different files and two different converters too. I'll try again to see any kinks. Love your YT btw
@@mydopepr No idea why it wouldn't show up, i still have that font file on my assets for now.
Thanks, really glad you like it.
Cheers
I seem to have done everything right and it doesn't seem to be working for me. I used the same theme and everything. went to the same convert page, don't know what seems to be the problem.
Check it out from a private window in browser, because browsers can cache old version of the website elements for longer time and specially fonts and so on.
Cheers
That didn’t work either
Hi - great vid! it worked on desktop, but when i opened my website in mobile, the text appears in its default font. know how to fix this? thanks
Thanks so much. A nice and clear explanation.
You're very welcome
You are a genius !
The font that shows up on the site at the end isn't the one you downloaded...?
I've followed this step by step and the same thing has happened to me. The font has changed but it's not the correct one I'm trying to add?
The display of the font might look different due to Shopify frontend rendering but its the same font.
From my experience you might want to test different similar fonts to find the right one for your needs.
Cheers
@@OnHOWGuy So when the site is live, the correct font should appear?
@@DanDavies-m8d No thats how Shopify renderers fonts on the browsers.
Cheers
Great Video! I do have one question though, can you still add multiple custom fonts after adding one?
thanks man just follow your instruction and I did yaaayyy
You're very welcome, glad i could help.
Cheers
Worked! Thank you
Thank you! This was really helpful
You're very welcome, glad it was helpful.
Cheers
how we can add shopify font liberary fonts
Hey wonderful tutorial. Please can you make a quick video showing how to add bold on to the font. I've looked at all video to see if you created a tutorial for that but find nothing. I would appreciate if you can make that quick video. Thank you.
Why can't I convert fonts? When I move files to converter they show as 0kb
Hey is this still the issue or you got it fixed ?
Cheers
yup same here, i tried to convert files and it says 0kb. What the hell
its not working for me, not sure why
It changed my font but not the font I plugged in. any help?
same
You are the BEST! Thanks
You're very welcome.
Cheers
Please help ,How to Add two custom fonts ?
jus do the same thing but when you get into the base.css put space between the code
Thank you sat! appreciate it!
You're very welcome and glad i could help.
Cheers
I did the same but it doesn't work for me I did try it on refresh theme which is free theme on shopify
I am having the same problem with the same template weirdly enough
Hey Enes, If I am adding more than one font to shopify, would I just duplicate the code and follow the same steps for each one?
Hey, you need to set multiple targets for the font to be applied.
unfortunately not working. is it because i converted a otf file to woff?
same, did you solve the issue?
What theme are you using ?
Try something else other than otf and see if that would work.
Cheers
why does it keep telling me file size is 0
Thank you very much, it was helpful
thanks man you saved me money
Glad I could help
Thank you so much for your videos! They really help. I tried this step for step bur unfortunately it didn't work.. had someone else has this as well and maybe already found a solution for it? :))
Hello dear, kindly do a tutorial on how to add the logo in footer in a big bold ?❤🙏 love all your vedios❤❤❤
Thank you this worked!
You're very welcome.
Cheers
Wait I don't understand, the video didn't changed the font you have. In Dawn theme it's just changing Sans Serif to Serif but not the font I have uploaded
I did it the second time, maybe I can help?
I've watched so many videos, but none help. I can't get past the first step because I dont have the theme.css page
Hey, im sure this one will help.
You will find either theme.css or base.css and implement this for one of them because they are the same its just each theme uses a different filename.
Cheers
Thank you so much !!! Can you please tell me if there is a website where I can set a certain size and it will automatically set my gif to that ? I need to do it BASED ON SIZE that I SET pls 🙏🏻
You're very welcome, you can search "resize gif" and you'll get dozens of websites that can do that.
Cheers
@@OnHOWGuy sir I’d like to ask you if I would succeed by only finding a niche and a product in demand with low competition with a nice looking website and profitable margin
@@stefanocarretta6678 Yes absolutely, perfect everything and you'll have higher of succeeding.
Cheers
The font worked well for me, but it dosent show on mobile version. Anyone who knows how to fix this?
It might be a browser cache issue, try with other devices that you never opened the Shopify store in.
Cheers
@@OnHOWGuy I am having the same issue
LEGEND!!
Thanks
Hello Anas you are really doing a great job and i almost watch each and every video of you. But in this particular video i have applied the same thing i want to let you know that the font style is only changing on IOS devices not on android. Kindly do check and i hope you'll find a solution for it. Thank You & keep up the good work 👍
Hey, thank you and i appreciate that.
Sorry for the late reply and Yeah unfortunately things changes quick and its hard to keep up, this trick still works on the popular themes just fine.
Cheers
You can just go to your content section and add the font to files, copy the file URL it provides, and paste it into the URL section from the code provided here. Your welcome
You are so cute, I follow many of your videos. Thank you for all your hard work.
khoya you are the best
Thank you brother, i appreciate that