Change menu and button fonts with Custom CSS

Site URL: https://magenta-burgundy-9mhs.squarespace.com/about-us-ready

Hi,

I need help. I have managed to change the fonts in my template to a specific one through Custom CSS.

What code do I need to use to be able to change the font in the menu (both tablet and mobile) and also for buttons?

So so thankful if anyone would be able to help me!

Now I solved headings and body text like this:

h1 {font-family: 'brownregular';}
h2 {font-family: 'brownbold';}
h3 {font-family: 'brownregular';}
body {font-family: 'brownregular';}

Your site is private.

Please setup password & share url again.

Thank you!

https://magenta-burgundy-9mhs.squarespace.com/about-us-ready

Password: Blume

Another question...

I started with this template: https://blume-equity.squarespace.com/config/

(Password Blume)

But my client wanted to have a "Hamburger" Menu - do you know if that is even possible?

Add to Home > Design > Custom CSS

/* navigation */
nav#mainNavigation span {
    font-family: 'brownbold' !important;
}
/* button */
.sqs-block-button-element {
    font-family: 'brownbold' !important;
}

17 minutes ago, SannaBuckhoj said:

Another question...

I started with this template: https://blume-equity.squarespace.com/config/

(Password Blume)

But my client wanted to have a "Hamburger" Menu - do you know if that is even possible?

Search on Forum: Force menu squarespace 7.1 on desktop

Thank you so much for your help! Really appreciate it!

Have a great day!

Hi @tuanphan. I am also trying to change my buttons to a custom font. I tried the following coding, and it did not work. Can you please advise? Website is www.flygeorge.com and password is FlyGeorge20!

/* button */
@font-face {
  font-family: 'Tox Typewriter';
  src: url('https://static1.squarespace.com/static/5dbbda2823e1b16011276261/t/5edaa1171dcce83950c55017/1591386391458/Tox+Typewriter.ttf');
}
.sqs-block-button-element {
    font-family: 'Tox Typewriter' !important;
}

I've attempted this code with my custom font and there is a syntax error showing:

@font-face{
  font-family: ‘CHAROE';
src: url('https://static1.squarespace.com/static/59fe3195e45a7c4a1e7b0797/t/5e95c29a8958500b2dff41df/1586872986540/Charoe-SemiBold.ttf');
}
.sqs-block-button-element {
    font-family: 'CHAROE-SEMIBOLD' !important;
}

1 hour ago, jlama said:

I've attempted this code with my custom font and there is a syntax error showing:

@font-face{
  font-family: ‘CHAROE';
src: url('https://static1.squarespace.com/static/59fe3195e45a7c4a1e7b0797/t/5e95c29a8958500b2dff41df/1586872986540/Charoe-SemiBold.ttf');
}
.sqs-block-button-element {
    font-family: 'CHAROE-SEMIBOLD' !important;
}

Can you paste all CSS? We can check easier.

Seems like the syntax error is gone now...weird.