Search the Community

Hi all. I'm a CSS newbie, but am starting to get the hang of it. Have made a few customizations that have worked thus far to both the standard and mobile site. I don't know if any of those customizations are overriding what I'm trying to do with the mobile menu font size, which is too big and I just want to bring it down a notch. Here is the code that I found that folks were saying worked (not working for me). I've tried adding the '!important;' tag after font-size as well and had no luck with that. And here is all the code I have already on my site, in case it's relevant. All of this code works properly: I'm still building the site so it's not public yet. Again, I just want to change the SIZE of the mobile menu font so it's slightly smaller. Thank you!

Site URL: https://radish-flute-xksb.squarespace.com/config/design/custom-css Hello, Integrating my own font works only for headlines and paragraphs – Not for menu, buttons, price, product name, checkout, ... Below is my css so far. Would be fantastic to get some advice! Thanks in advance 🙂 //merkury_bold @font-face { font-family: merkury_bold; src: url(https://static1.squarespace.com/static/601d122b852db615309652d6/t/601e698b2fde0b5388e29a49/1612605836133/merkury_bold.otf); } //merkury_light @font-face { font-family: merkury_light; src: url(https://static1.squarespace.com/static/601d122b852db615309652d6/t/601e6995fb454231c728a067/1612605845814/merkury_light.otf); } h1 {font-family: 'Merkury_bold';} h2 {font-family: 'Merkury_bold';} h3 {font-family: 'Merkury_bold';} p {font-family: 'Merkury_light';} /* navigation */ nav#mainNavigation span { font-family: 'merkury_bold' !important; } /* button */ .sqs-block-button-element { font-family: 'merkury_bold' !important; }

Site URL: https://www.charlottefeldforth.com/ When I look at my site on a large desktop the size of the type is way too small. When I scale the size of the window down to mock up a smaller screen size the type jumps up in size (to a much better proportion.) I don't want the type to reduce in size as the screen gets bigger! At the very least I'd like it to stay the same size. Any ideas?

Site URL: https://bluebird-porcupine-yzdg.squarespace.com/collection-3w5d7 Hello, is it possible to increase both the H2 and P2 sizes on mobile only? I'd like to set my H2 at 1.4375rem and P2 at 1.1875rem This will be across all pages. Current Page - https://bluebird-porcupine-yzdg.squarespace.com/collection-3w5d7 Pword - bluebird Many thanks, Best, Faiz

Site URL: https://panda-ocelot-kt64.squarespace.com/ Hi all, was wondering if there was a way to increase the size of the calendar date font (1, 2, 3..) in each date. I've tried several things and can't seem to get anything to work.

Hello everyone.I want to know how to choose some traditional Chinese fonts in design page. I tried some adobe fonts, but squarespace doesn't support :( Or Maybe someone can tell me easier way to change Chinese fonts? Thank you guys !

Site URL: https://www.acres.co/ Hi all, I am trying to get a single block to display H1 and H3 text in Bree font, while the rest of the website is in Soleil. I am entering the code below, but the 'bree-web' font-family isn't getting picked up. #block-736342bd02c7c985adaf h1 { font-family: 'bree-web'; } I would greatly appreciate any insight someone has on this. Thank you!

Site URL: https://www.bassfreedom.com I am trying to change only the Header 1 font size ("Bass Guitar Lesson") of my home page. Is it something with code? I don't know the CSS code to do this! I am also trying to change the font color to specific words within a sentence. Any help would be greatly appreciated! Thank you!

Site URL: https://thehybridhome.squarespace.com/ My custom fonts isn't showing once i leave the editor. they are showing inside the squarespace builder but not on the site itself. plus, because the site is in hebrew and its right to left, i have added code injection (rtl). but now every gallery arrows are the wrong way. is there a way to fix this aswell? thanks. 🙂 https://thehybridhome.squarespace.com/

Site URL: https://harmonica-mandolin-k5zk.squarespace.com/ Hi, So I need some help coding my nav menu, currently the font sits as this: However I want the font to look like the rest of my custom font: I have tried so many different codes that I've seen through this forum and I should add I'm new at this whole coding thing, I did this all last night by copying and pasting different codes I've seen. This is all the coding I have used for my font so far: .newsletter-block .newsletter-form-button { font-family: 'Afrah-Light.otf' !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: .12em !important;} .collection-type-products .grid-title { font-family: 'Afrah-Regular.otf'; } .blog-item-title h1 { font-family: 'Afrah-Regular.otf' !important; } nav#mainNavigation span { font-family: 'Afrah-thin.otf' !important; } .sqs-block-button-element { font-family: 'Afrah-Thin.otf' !important; } .header-title-text { font-family: 'Afrah-Regular.otf'; } @font-face { font-family: 'Afrah-Regular.otf'; src: url('https://static1.squarespace.com/static/6022cb3df94c921352bb00c0/t/6022cd7cc1e1cc6421e117e3/1612893564915/Afrah-Regular.otf'); } @font-face { font-family: 'Afrah-Light.otf'; src: url('https://static1.squarespace.com/static/6022cb3df94c921352bb00c0/t/6022cd6f5d81ae6201c0613a/1612893551991/Afrah-Light.otf'); } @font-face { font-family: 'Afrah-Thin.otf'; src: url('https://static1.squarespace.com/static/6022cb3df94c921352bb00c0/t/6022cd76eb9d5f2e0a0d72e2/1612893558855/Afrah-Thin.otf'); } h1 {font-family: 'Afrah-Regular.otf';} h2 {font-family: 'Afrah-Light.otf';} h3 {font-family: 'Afrah-Light.otf';} h4 {font-family: 'Afrah-Light.otf';} p{font-family: 'Afrah-Regular.otf';} and this is the coding I have most recently tried: nav.header-menu-nav-list *, .header-nav * { font-family: 'Afrah-Light.otf' !important; } This is only in my phone version menu, as on the desktop version there isn't a drop down menu, I am also hoping it'll change the font on the desktop menu too. Thanks in advance!

Site URL: http://www.pearlsandpoets.com Hello! Wondering if anyone knows how to change the menu overlay button font size for mobile? It's much smaller than the nav links and I want to increase it. Thanks!

Site URL: https://duck-chicory-2yad.squarespace.com/config/pages/5ffc811878ad8522d30ef991 Hi. I am trying to add two different custom fonts to my site. I would like the heading 2 to be in a particular font style (hello_honey). And the rest of the headings eg heading 1,3,4, body text, navigation etc to be in the abhaya libre font. I have uploaded the font styles in the custom css section but the abhaya libre one which is the main one is showing, but the 'hello_honey' custom font which is the one i would like for heading 2 only is still showing as the @abhaya libre' font. Can i add two different fonts in this version 7.1? thanks.

Site URL: https://www.thisispalo.com/ Looking to change the font on my About section on mobile ONLY. Is this possible?

Hello! Please help if you know advance 7.1 styling or coding! I'm trying to customize my site's font colors in 7.1 . I've gone through the Site Styles and changed the color palette in the general Advanced section, and changed specific items in the Customize section of specific "sets". Also tried deselecting the current theme in sections to have it take on the global style. But no matter what I do, I can't change all the font colors on my site. Specifically, the client wants all her titles and image overlay captions and most text to be Blue. Can anybody help out with this? Do I need to use code? Just a note Squaspace, this is a SUPER important aspect of being able to customize a site, and I wish there were an easier way to do this. I get lost in all the options that are laid out in different parts of the editor. Think others are having this same problem as well!

Site URL: https://www.jaxmariephotography.com/ Hi! Here is the list of things that I would like to customize in my footer: Increase the font size of the "JM" on the left side Decrease the amount of padding (space) slightly between each of the vertically stacked links (i.e. between "Pricing"/"Credits," "Contact"/"FAQ," and "Privacy Policy"/"Terms") Change the layout of the newsletter block to the pict attached below and invert the colors of the "Sign Up!" button when it is hovered over Decrease the amount of padding (space) between the social media icons and the newsletter block (see picture), around the line break, and around the text under the line break (email and copyright) Also, I am using the Zion Template under "Photography." I am a complete beginner when it comes to HTML so any help (with any of the customizations) would be greatly appreciated. Thank you! *The first picture is a rough outline of what I would like my footer to look like and the second picture shows all the customizations to be made on the current footer.

Dear Community, does someone know how to apply a custom font to the Monospace? I was able to successfully apply my custom font to the Headline and Paragraph font, though not on Monospace. Anyone has a clue? Thanks!

Site URL: https://lykopis.com/ Hi there I am hoping someone can help us to get our custom font that shows correctly on desktop to also display on mobile. We have custom font implemented using CSS for 2 sections: 1. Header 1 2. Cover Page Header DESIGN >CSS //ADD BOLTON FONT// @font-face { font-family: 'BOLTON'; src: url( }https://static1.squarespace.com/static/5cb57d98d74562986f6b14cf/t/601d08fa707518709464c14c/1612515578387/Bolton.ttf)format('BOLTON'); } //APPLY BOLTON FONT TO HEADER 1// h1 {font-family: 'BOLTON' !important; } COVER PAGE > ADVANCED > CSS <style> h1#sqs-slash-page-header { font-family: 'BOLTON' !important; } </style> DESKTOP: MOBILE:

Site URL: https://orange-beagle-9jfc.squarespace.com/ Hi there, I'd like to change the font size and line height of both headings and paragraphs in mobile view only. How can I achieve this? Thanks, as always! Matthias

Site URL: https://www.pushkinhouse.org/virgin-london-marathon-2021 Hi there, I have added this form to the page on our website and I'm happy with the background colour (our brand colour) and white font which works well everywhere else on the site https://www.pushkinhouse.org/virgin-london-marathon-2021 however, when you click on the drop down choice you can't see the text, because it's white on the white background. When I changed it to black, the text overlay everywhere else had changed to black too. Is there a way of changing the font colour in the drop down only or changing the font colour of the form only? Thanks in advance!

Hi! I have implemented a custom font however on a PC the e's seem to be cut off (pic attached) has anyone experienced this or know how to correct? Mac seems perfect. Thanks, Jennie

Hi, I'm struggling to make the "shopping cart" text lowercase or sentence-style. It's capitalised at the moment, which looks horrible with my cursive font. Is there a way to either make this text lowercase or sentence-style OR change from my H2 to H1 or H3? Thank you!

Hi! I have uploaded a custom font is there a css I can use to change all buttons throughout the site? Thanks, Jennie

Site URL: https://www.themillwestport.com/new-modern-amenities-features On this page I want to modify the font size. @tuanphan 🙂 https://www.themillwestport.com/new-modern-amenities-features

Site URL: http://www.pollenize.org.uk Hi everyone, I've installed a custom font via css which is working great. I need to override/exclude it on image card titles. Can anyone help me with a CSS code? Thanks!

Site URL: http://www.ccs.ms How do I customize the main header font to a custom one that i've uploaded? When I insert CSS that i've found online, it changes every font in the header.