Search the Community

Please check mobil site: www.victoriaalstrup.com. Password: victoria On desktop the overlay image fonts on the front page looks perfect, but it won't adjust correctly on the mobile version. Any tips?

Is it possible to define new paragraph styles in addition to the default H1, H2, H3, etc?

Montserrat is my choice for font branding, however my website title, which is my name, is not in that font. When I go into the back end of Squarespace, the title is in that font, and when I click on the title and click on the font choice drop down menu, Montserrat is selected. Could anybody explain why this is happening?

Hi! My website is based off the Brine template that I have customized. The font sizes I have chosen look fine for a desktop view. But all of my text needs to be reduced to a smaller font size for mobile viewing. I'll add a photo of what it looks like in mobile view in the design panel. I've watched several tutorials on adding custom CSS code to reduce font size on mobile, but anytime I inject that code nothing changes. I do have a h4 custom css code in there already. When I inject code it says "syntax error on line 1". Is there something that I'm missing or not doing correctly?

Working on a portfolio using Jasper Template. I got the custom font to work for H2, H3 but I have no idea how to insert it into page description on the Index/Work page. This does not fall under main heading styles (nor does navigation) - so how to change these fonts to custom ones?

Hi, my website is: https://www.cottagecc.com/home I'm trying to make the caption overlay on the homepage image (and site wide) to be a font that I've already imported from google fonts. thank you!

Hi!! I was wondering how I can target the header overlay text to be a different coloured font on one of my pages. I also want to get rid of the shadow behind the text but only for this page. The section is the "What We Do" index page of my homepage. I want the font to be #hsl(195, 7%, 23%). Here is the URL: https://penguin-roadrunner-4c8m.squarespace.com/ and password: Skyfall77

Hi, anybody van help? the link myfonts is providing to use in the css to the myfonts server seems to be wrong for the squarespace i figured out with the dev tools from google that this must be problem why webfonts do not show up! it cannot load the fonts..it says :"wrong href " this is the link from my css file @import url("//hello.myfonts.net/count/3ad6aa“); you have an idea what to change..??

Hi, I am using Om Template for my website. I have bought a font that I would like to use for my site title. I have looked through the online help and am still stuck with this. I know I am on the right path because using css code I am able to change the Heading 1 or Heading 2 or Heading 3 to use this custom font.... but I just cannot figure out how to change the site title. The custom font is not available in the list of fonts available under Site Styles | Typogrpahy | Site Title. So I have added following code under Design | Custom CSS. Where am I going wrong? Any help would be much appreciated. You can view the website on : https://interiordesignstein.squarespace.com/ // Adding Leyton Font @font-face { font-family: 'Leyton'; src: url(//static1.squarespace.com/static/5d71b8d9e71af8000103a6ea/t/5e0d887f014e1a25d2e580a0/1577945215697/Leyton-Regular.otf); } //change the heading 1 font h1 { font-family: "Leyton"; } //site title does not want to change?? header h1.site-title { font-family: "Leyton"; }

I'm fairly new to CSS and I'm trying to figure out how to add custom font for the navigation and also the 'normal' font in the text box. Can anyone help?? This is what I have so far.... Also... what is the 'p' font? //ADDING HAVELOCK FONTS// @font-face { font-family: 'HAVELOCK LIGHT'; src: url('https://static1.squarespace.com/static/5e18e998a6a8c14066a834e0/t/5e190c7112be5b2164a3f91c/1578699889315/3AD48F_3_0.woff'); } @font-face { font-family: 'HAVELOCK MEDIUM'; src: url('https://static1.squarespace.com/static/5e18e998a6a8c14066a834e0/t/5e190e2812be5b2164a4282d/1578700328356/3AD48F_4_0.ttf'); } @font-face { font-family: 'HAVELOCK REGULAR'; src: url('https://static1.squarespace.com/static/5e18e998a6a8c14066a834e0/t/5e190d344c275445aaacdee3/1578700084635/3AD48F_6_0.woff'); } //ASSIGN FONTS// h1 {font-family: 'HAVELOCK LIGHT';} h2 {font-family: 'HAVELOCK MEDIUM';} h3 {font-family: 'HAVELOCK REGULAR';}

I want to change the font in my header navigation. I'm able to do it to each link that is a direct link (i.e., I click on it and it takes me directly to a page), but the items that are drop-down menus on hover don't change. I'm using this code: #headerNav nav a { font-family: 'AspiraWide' !important; } The website is at www.middle.st – It's subtle, but you can see the "Events" and "Contact Us" links are a slightly different font. Thanks!

Wondering if someone could help me with custom CSS code to change my avenue sites mobile navigation bar font to a custom font. Already using a custom font for the rest of the site just cant get it to apply to mobile nav. As a bonus if I could get the CSS to change the text of my mobile navigation from "menu" to something else that would be great. Thanks!

If you want to use custom font for Navigation, just copy - paste the following codes. Add code to Home > Design > Custom CSS 92 Templates Navigation Link Color - Hover - Active Color Avenue @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav nav ul li a { font-family: your-font-name; } Aviator @font-face { font-family: your-font-name; src: url(enter your font name url here); } nav#main-navigation ul li a { font-family: your-font-name; } Bedford Template Family Include: Anya, Bedford, Bryant, Hayden, Bedford @font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a { font-family: your-font-name; } Brine Template Family Include: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West, Brine. @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item { font-family: your-font-name; } Farro Include: Farro, Haute @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item { font-family: your-font-name; } Five @font-face { font-family: your-font-name; src: url(enter your font name url here); } nav#main-navigation ul li a { font-family: your-font-name; } Flatiron @font-face { font-family: your-font-name; src: url(enter your font name url here); } ul#nav li a { font-family: your-font-name; } Forte @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a span { font-family: your-font-name; } Ishimoto @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav #nav li a { font-family: your-font-name; } Momentum @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a { font-family: your-font-name; } Montauk Template Family Include: Julia, Kent, Montauk, OM @font-face { font-family: your-font-name; src: url(enter your font name url here); } #topNav ul li a { font-family: your-font-name; } Native @font-face { font-family: your-font-name; src: url(enter your font name url here); } #navBlock ul li a { font-family: your-font-name; } Pacific Template Family Include: Bryler, Charlotte, Fulton, Horizon, Naomi, Pacific @font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a { font-family: your-font-name; } Skye Template Family Include: Foundry, Indigo, Ready, Skye, Tudor @font-face { font-family: your-font-name; src: url(enter your font name url here); } .nav-blocks-wrapper div a span { font-family: your-font-name; } Tremont Template Family Include: Camino, Carson, Henson, Tremont @font-face { font-family: your-font-name; src: url(enter your font name url here); } #mainNavigation div a span { font-family: your-font-name; } Wells @font-face { font-family: your-font-name; src: url(enter your font name url here); } div#topNav ul li a { font-family: your-font-name; } Wexley @font-face { font-family: your-font-name; src: url(enter your font name url here); } div#topNav ul li a { font-family: your-font-name; } York Template Family Include: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, Taylor, York @font-face { font-family: your-font-name; src: url(enter your font name url here); } .site-navigation div a span { font-family: your-font-name; } Squarespace 7.1 Include: Novo, Pazari, Nolan, Utica, Cami, Matsuya, Nevins, Kester, Gates, Zion, Classon, Hawley, Suhama, Elliott, Otto, Tepito, Balboa, Beaumont, Quincy, Talva, Minetta, Falodu, Hester, Crosby, Ventura, Maru, Tresoire, Almar, Alameda, Patil, Stanton, Paloma, Fillmore, Palmera, Souto, Brower, Merida, Grove, Harman, Rivoli, Noll, Bergen, Degraw, Corrigan, Sackett, Lakshi, Pulaski, Suhama, Cailles, Colima, Barbosa, Clune, Irving, Suffolk, Clarkson, Lusaka, Bailard, Malone, Roseti, Euclid, Carmine, Wycoff, Harbor, Ocotillo, Fayette, Roseti, Dario, Soria, Morena, Rey, Lenoix, Bleecker, Vandam, Cruz, Kitui, Waverly, Vance, Orina, Chotto, Auburn, Juniper, Palmer, Atlantic, Iduma, Pine, Eldridge, Pulsaki, Amal, Suhama, Hart, Carroll, Noll, Hidano, Palermo, Cailles, Archer, Kearny, Sellwood, Essex, Mason, Gramercy Studio, Cole, Devoe, Randi, Zorayda, Manor Studios, Grant, Toledo, Hoyd, Troutman, Tantillo, Maqueda, Hemlock, Bogart, Florence @font-face { font-family: your-font-name; src: url(enter your font name url here); } .Header-nav-item a { font-family: your-font-name; } Made by Tuan

Hello! I am using a simple Squarespace template. I would like for the type in the "work" page to rollover to white because when the image shows it makes the type impossible to read. Please see the animation I posted. Thank you SquarespaceHelp.mp4

Hi there. I'm working on a bilingual text on a website. For this I created an English text style (h3) and a Spanish one (h4) with the same specifications as h3, except for a color change, and insert it on the page with a code block. h4 has been set to match the size of h3 on full width but for obvious reasons it won't resize on smaller screen sizes. Any idea how to solve this? Here's a link to the page. Thanks!

Hi community, I'm using a custom font and I've been able to change the h1,h2,.. styles into the correct font with CSS...but I can't do the same for the product titles. I need urgent help. Thanks in advance!!

Hey Guys! I've already used custom CSS to adjust the mobile fonts on my site, however, I can't figure out how to adjust the size of the product titles in mobile view. I'm using the Jaunt template. Any help would be great...thanks!

Hello, I would like to code a custom font into the header of the mobile view of my website. I have done so successfully for the regular view but it defaults into standard font when i switch to mobile view. Any ideas? This is what I have for the desktop version and it works great: @font-face { font-family: 'retro_computer_personal_use'; src: url(https://static1.squarespace.com/static/5c253509f8370a48f3940027/t/5e16848141d1895d960adb21/1578534017904/retro_computer_personal_use.ttf), } .Header-branding { font-family: retro_computer_personal_use, sans-serif !important; }

Is there a way or some custom css code that'll allow me to change the font spacing of the Shopping Cart font in Mobile view for the Rally template? For some reason, in Mobile view, the font gets really spaced out and causes the information to look strange and continue pass the edge of the screen when an item is in the cart. The same problem occurs in the shop's store front with the "categories" drop down menu and on the site's contact form. Everything looks normal in tablet and desktop mode. The website: https://www.ladieslifeguide.com/

I am new to squarespace but not new to designing websites, I have been doing it for quite a while now. On this first experience I am finding my way to adjust to its limitations and understand how this works. However, now I have a problem that I am not sure how to solve: The headlines of my site are sometimes not rendering using the correct font: Neue Hass Grotesk. The only way I can fix the issue is going to the config mode/design/fonts, when I am in that section of the config mode the site fixes the issue, however if I move away from that mode there is a big chance it won't load the correct font and will default on the next one. Any one had an issue like this before? Thanks!

Hi all, sorry to be a bother. Is it possible for someone to provide the custom css code that I could use to ensure my website navigation bar starts with a capital letter. On the mobile navigation it's fine. Template: ethan. Website link: www.triggersanj.com Thanks in advance.

I'm using Bedford and looking to change both the title (bold) and text (no formatting) that appear in a banner. I'd like to use CSS to do this, because I'm using custom fonts that I uploaded, and they don't appear in the site styles dropdown lists. Thanks in advance! www.middle.st

Hi I'm trying to change the MOBILE version of the font size on product names in my store but can't find a setting for this for mobile or desktop. The product names are really big in mobile and splitting across the screen at weird places. I'm a novice so hoping this doesn't require code writing? Thanks for anyone who can help.

Is it possible to change the X and Y axis label font within a chart block in the Avenue template? I successfully changed the caption using "chart-block-caption" in my custom CSS but can't seem to find the right div controlling the labels.

Hi there, Hoping someone has insight on the coding to change the title font style that is defaulted on image overlaps. I can't figure out where to change the font style in the Brine template. But I do have custom fonts uploaded, that I would rather work with.