laesquinafeliz Posted June 22, 2021 Share Posted June 22, 2021 (edited) Site URL: https://www.saramendoza.co/quiz-margin Hi, I'm usingย custom webfonts forย my website. The ones that are from Adobe Fonts are working perfectly, but the ones that I manually uploaded are not working at all ๐ย There are 2 images attached, one shows where I uploaded the fonts to the site and the other shows custom CSS in the specific pages where I'm using those fonts, as they're not for the whole site. I would really appreciate your help. Kindly, Sara. Edited June 22, 2021 by laesquinafeliz Link to comment
sorca_marian Posted June 22, 2021 Share Posted June 22, 2021 (edited) Hi, Try to put the URLs in quotes(""). The url does not work:ย https://www.saramendoza.co/quiz-elegante-fashionista Edited June 22, 2021 by sorca_marian ๐จโ๐ง๐จโ๐ปย Contact me for development work - Iโm a Freelancer Software engineer, Architect, and Designer UI/UX ๐โโ๏ธย Squarespace Custom Web Development & Design ๐ ย Manage Tasks, Take Notes, and Upload Related Images ๐นย Squarespace Tutorials for free - YouTube๐นย ๐ฏ๐ I have worked on over 200 Squarespace sites with custom code for over 9 years ๐โโ๏ธย Let's connect on LinkedIn ย ย Link to comment
laesquinafeliz Posted June 22, 2021 Author Share Posted June 22, 2021 Sorry, I edited it to find a temporary solution while I can I use my custom webfont. Here's the current URL:ย ย https://www.saramendoza.co/quiz-margin Thanks a lot ๐ Link to comment
sorca_marian Posted June 22, 2021 Share Posted June 22, 2021 Can you send the URLs of the webfonts so I can try to add them? Or better, paste both code sections from above so it works faster to make changes ย ๐จโ๐ง๐จโ๐ปย Contact me for development work - Iโm a Freelancer Software engineer, Architect, and Designer UI/UX ๐โโ๏ธย Squarespace Custom Web Development & Design ๐ ย Manage Tasks, Take Notes, and Upload Related Images ๐นย Squarespace Tutorials for free - YouTube๐นย ๐ฏ๐ I have worked on over 200 Squarespace sites with custom code for over 9 years ๐โโ๏ธย Let's connect on LinkedIn ย ย Link to comment
laesquinafeliz Posted June 22, 2021 Author Share Posted June 22, 2021 Sure, here they are: https://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54ec3838956a5acaa99e/1624134892867/Margin+OTF.otfhttps://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54ec3838956a5acaa99e/1624134892867/Margin+OTF.otf https://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54f374264b4f47f9ce93/1624134899616/Margin+WOFF.woffhttps://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54f374264b4f47f9ce93/1624134899616/Margin+WOFF.woff Link to comment
sorca_marian Posted June 22, 2021 Share Posted June 22, 2021 (edited) Now I noticed the problem. The URLs are incorrect and added twice. Instead ofย https://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54ec3838956a5acaa99e/1624134892867/Margin+OTF.otfhttps://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54ec3838956a5acaa99e/1624134892867/Margin+OTF.otf Tryhttps://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54ec3838956a5acaa99e/1624134892867/Margin+OTF.otf ย Follow this syntax:ย https://www.w3schools.com/cssref/css3_pr_font-face_rule.aspย @font-face { font-family : 'Family'; font-style : normal; src: url('../fonts/Family-Book.otf'); font-weight: 400; } ย @font-face { font-family : 'Family'; font-style : normal; src: url('../fonts/Family-Demi.otf'); font-weight: 500; } ย @font-face { font-family : 'Family'; font-style : normal; src: url('../fonts/Family-Bold.otf'); font-weight: 700; } Edited June 22, 2021 by sorca_marian ๐จโ๐ง๐จโ๐ปย Contact me for development work - Iโm a Freelancer Software engineer, Architect, and Designer UI/UX ๐โโ๏ธย Squarespace Custom Web Development & Design ๐ ย Manage Tasks, Take Notes, and Upload Related Images ๐นย Squarespace Tutorials for free - YouTube๐นย ๐ฏ๐ I have worked on over 200 Squarespace sites with custom code for over 9 years ๐โโ๏ธย Let's connect on LinkedIn ย ย Link to comment
laesquinafeliz Posted June 22, 2021 Author Share Posted June 22, 2021 Oh, I didn't see that...ย It worked on phones but not on pc browsers ๐ญ๐ญ๐ญ Attaching screenshots. Thanks againย Link to comment
tuanphan Posted June 24, 2021 Share Posted June 24, 2021 Edit 640px in this code @media only screen and (max-width: 640px) { body,h1,h2,h3,h4 { word-wrap:normal; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none } @font-face { font-family: 'Margin'; src: url(https://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54ec3838956a5acaa99e/1624134892867/Margin+OTF.otf),url(https://static1.squarespace.com/static/605809d9a59404695757ccb0/t/60ce54f374264b4f47f9ce93/1624134899616/Margin+WOFF.woff) } } to 9640px ย Email meย if you have need any help (free, of course.). Answer within 24 hours.ย Or send to forum message Contact Customer Careย - Learn CSSย - Buy me a coffeeย (thank you!) Link to comment
sorca_marian Posted June 24, 2021 Share Posted June 24, 2021 Add the code without @media to apply the code on all screens tuanphan 1 ๐จโ๐ง๐จโ๐ปย Contact me for development work - Iโm a Freelancer Software engineer, Architect, and Designer UI/UX ๐โโ๏ธย Squarespace Custom Web Development & Design ๐ ย Manage Tasks, Take Notes, and Upload Related Images ๐นย Squarespace Tutorials for free - YouTube๐นย ๐ฏ๐ I have worked on over 200 Squarespace sites with custom code for over 9 years ๐โโ๏ธย Let's connect on LinkedIn ย ย Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment