Kirsten1570048772 Posted April 15, 2020 Posted April 15, 2020 Site URL: https://www.mela.co.nz Is there a way to universally override Squarespace's default fonts in a Brine template? I've created my first Squarespace site using my client's custom webfonts, loaded via the CSS panel. Once loaded, I've assigned these to p, H1, H2, H3, H4 in the CSS panel. But when browsing the site I still see Squarespace's default fonts here & there - like on mobile when I do a search, or when a page is not found. It's getting ridiculous adding CSS snippets to target every individual instance of the wrong (default) font. Can I assign my own overriding default font?
tuanphan Posted April 15, 2020 Posted April 15, 2020 @font-face { font-family: tuan; src: url(paste font file url here); } /* target all elements */ * { font-family: tuan !important; } 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!)
Kirsten1570048772 Posted May 2, 2020 Author Posted May 2, 2020 Thanks tuanphan I gave it a go but unfortunately it replaced everything with that one font. I'm using 3 fonts in the site, is there some CSS to target any font that's not assigned p, H1, H2, H3, H4?
tuanphan Posted May 5, 2020 Posted May 5, 2020 On 5/2/2020 at 1:19 PM, Kirsten1570048772 said: Thanks tuanphan I gave it a go but unfortunately it replaced everything with that one font. I'm using 3 fonts in the site, is there some CSS to target any font that's not assigned p, H1, H2, H3, H4? @font-face { font-family: tuan; src: url(paste font file url here); } /* target all elements */ * { font-family: tuan !important; } p, h1, h3, h4, h5 { font-family: enter-font-name !important; } 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!)
smgrant Posted May 6, 2020 Posted May 6, 2020 On a related note, how do you adjust the different paragraph sizes? In the dropdown menu when formatting a text block, there's a "paragraph 1," "paragraph 2," paragraph 3" options. How do you create CSS to affect those? Making new classifications like you do with Headers (h1, h2, h3, etc.) don't seem to work: for instance, when I wrote p1, p2, p3 and assigned unique fonts to each the paragraph size font didn't change. How do I assign font sizes to those other paragraph options?
tuanphan Posted May 6, 2020 Posted May 6, 2020 8 minutes ago, smgrant said: On a related note, how do you adjust the different paragraph sizes? In the dropdown menu when formatting a text block, there's a "paragraph 1," "paragraph 2," paragraph 3" options. How do you create CSS to affect those? Making new classifications like you do with Headers (h1, h2, h3, etc.) don't seem to work: for instance, when I wrote p1, p2, p3 and assigned unique fonts to each the paragraph size font didn't change. How do I assign font sizes to those other paragraph options? heading has 6 tags: h1 to h6 p in Squarespace has 3 class name: paragraph 1: p.sqsrte-large paragraph 2: p paragraph 3: p.sqsrte-small 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!)
smgrant Posted May 6, 2020 Posted May 6, 2020 Oh my goodness, thank you so much. Is it possible to adjust text on pre-made newsletter sign-up blocks where text is displayed in front of images? Does it also have its own class name?
tuanphan Posted May 6, 2020 Posted May 6, 2020 10 minutes ago, smgrant said: Oh my goodness, thank you so much. Is it possible to adjust text on pre-made newsletter sign-up blocks where text is displayed in front of images? Does it also have its own class name? Can you share link? 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!)
smgrant Posted May 6, 2020 Posted May 6, 2020 It is not yet live. Is there any other info I can give you? Attached is a screenshot of the section.
tuanphan Posted May 6, 2020 Posted May 6, 2020 6 minutes ago, smgrant said: It is not yet live. Is there any other info I can give you? Attached is a screenshot of the section. You can setup password & share url 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!)
smgrant Posted May 6, 2020 Posted May 6, 2020 Aaaaaaah. Okay, here it is: URL https://caper-robin-ljl7.squarespace.com/ PW Sq-strauss-method!
tuanphan Posted May 6, 2020 Posted May 6, 2020 4 hours ago, smgrant said: Aaaaaaah. Okay, here it is: URL https://caper-robin-ljl7.squarespace.com/ PW Sq-strauss-method! header.newsletter-form-header * { color: white !important; font-family: monospace !Important; } 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!)
AndyDevaney Posted June 24, 2020 Posted June 24, 2020 This was very useful, do you know if it then makes the typekit fonts unavailable so as to free up page speeds? Also if I want to keep my navigation menu to Aviano do I need to differentiate the CSS code as well?
tuanphan Posted June 24, 2020 Posted June 24, 2020 2 hours ago, AndyDevaney said: This was very useful, do you know if it then makes the typekit fonts unavailable so as to free up page speeds? Also if I want to keep my navigation menu to Aviano do I need to differentiate the CSS code as well? Can you share link to your site? Each template needs different code 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!)
tuanphan Posted June 25, 2020 Posted June 25, 2020 Add to Home > Design > Custom CSS .Header-nav-item { font-family: aviano-future !important; } 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!)
AndyDevaney Posted June 25, 2020 Posted June 25, 2020 Thank you, and what do I need to add to resize it please? Also do you know how it is possible to remove all the fonts in the style tab as they are reducing the page speed load as they are 1mb
tuanphan Posted June 26, 2020 Posted June 26, 2020 21 hours ago, AndyDevaney said: Thank you, and what do I need to add to resize it please? Also do you know how it is possible to remove all the fonts in the style tab as they are reducing the page speed load as they are 1mb Q1. font-size: 15px !important; Q2. You can't 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!)
ZolaProdz Posted June 30, 2020 Posted June 30, 2020 On 4/15/2020 at 5:42 AM, tuanphan said: @font-face { font-family: tuan; src: url(paste font file url here); } /* target all elements */ * { font-family: tuan !important; } Hi this is great it worked perfectly for me however on mobile the font is not the same is there a way to fix it on mobile with that single font i used? thank you
tuanphan Posted July 1, 2020 Posted July 1, 2020 20 hours ago, ZolaProdz said: Hi this is great it worked perfectly for me however on mobile the font is not the same is there a way to fix it on mobile with that single font i used? thank you Can you share link to your site? Which elements has problem? 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!)
villavi3 Posted February 6, 2021 Posted February 6, 2021 On 5/5/2020 at 7:45 AM, tuanphan said: @font-face { font-family: tuan; src: url(paste font file url here); } /* target all elements */ * { font-family: tuan !important; } p, h1, h3, h4, h5 { font-family: enter-font-name !important; } Hi tuanphan! sorry to hijack this thread but this answer was super useful to me but I'm having issues with the exceptions. They're not showing up with the correct font, they're showing up with a generic serif font. Here is the code I'm using: /* target all elements */ * { font-family: ia_writer_duo_sregular !important; } h1, h2, h3, h4, h5 { font-family: ia_writer_duo_bold !important; } As you can see in the screenshot it's the bold font thats not displaying correctly, both fonts are already in the css code. Thank you so much for helping me out!
creedon Posted February 6, 2021 Posted February 6, 2021 @villavi3 Please post the URL to the page where you are having this issue. If your site is not public please set up a site-wide password, if you've not already done so. Post the password here. We can then take a look at your issue. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.
villavi3 Posted February 6, 2021 Posted February 6, 2021 10 minutes ago, creedon said: @villavi3 Please post the URL to the page where you are having this issue. If your site is not public please set up a site-wide password, if you've not already done so. Post the password here. We can then take a look at your issue. @creedon The URL is: valledeoro.coffee and the site-wide password is: valle Thank you so much!
creedon Posted February 6, 2021 Posted February 6, 2021 @villavi3 All the fonts are the proper family on the elements that I can see. You might add the following to your rule-set. font-weight : 600; Let us know how it goes. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.
Recommended Posts
Archived
This topic is now archived and is closed to further replies.