Jump to content

Custom Font for Paragraphs

Recommended Posts

Posted

Site URL: https://www.dbtherd.com/

I've scoured the web trying to figure out how to add a custom font to my site (*edited to add: I'm using version 7.1). I learned how to add a custom CSS to change the heading fonts, but I can't figure out how to change all of the other text fonts (namely the paragraphs, links, and blog post titles). Any and all help is greatly appreciated!

  • Replies 9
  • Views 16.5k
  • Created
  • Last Reply
Posted

Hey @dbtherd! This is a great question, and it all comes down to the element name.

In pretty much all  sites, all paragraph text is p and all links are a as in active link.
Blog post titles are different for some theme families, and 7.1 is a whole different ball game.

On the off chance you are using a Brine theme, the blog post itself are .BlogItem-title and in an on page summary. it's called .BlogList-item-title

In Bedford & Pacific , it's .entry-title and for Five, its .entry-title a because why make things easy?? Haha! 😝

Anywho, I hope this info helps you get going in the right direction. Feel free to reply if you are using a different theme family and need some helping tracking those code names down. Always up for solving a good mystery 🙂 

All my best - Becca

🤓 Creator of InsideTheSquare.co
SQUARESPACE CIRCLE LEADER SQUARESPACE EXPERT SQUARESPACE EMPLOYEE EDUCATOR CERTIFIED CUSTOM CODE EXPERT

🗺️ New to Squarespace? Get your free roadmap: insidethesquare.co/roadmap
🙋‍♀️ New to CSS? Learn the basics for free: insidethesquare.co/learn
️ Ready to go pro? Get my custom code collection: insidethesquare.co/css

 

BeccaHarpain.gif.236d6ddd88c7d637645b762799f501a8.gif

 

  • 2 months later...
Posted

@inside_the_square Do you by any chance know if you can alter the custom font by p1, p2, p3 and p4. I see how you can customise font for p, it looks like p1 for example doesn't work like 'h1' would. If you're able to help that would be 🤩

Posted

Hey @rkho - i have the codes your looking for! 😄 In 7.1 sites, large paragraph goes by the code name ".sqsrte-large", Medium paragraph text is the normal "p" and small paragraph text goes by ".sqsrte-small"

Why? I have no idea, but that's what works for my 7.1 sites! Haha

I also have a list of all the other text types like quotes, forms, button types, images, etc on pages 16 - 26 in my CSS cheat sheet if you have a copy of that. Plenty of other text code names to work with 👍👍

🤓 Creator of InsideTheSquare.co
SQUARESPACE CIRCLE LEADER SQUARESPACE EXPERT SQUARESPACE EMPLOYEE EDUCATOR CERTIFIED CUSTOM CODE EXPERT

🗺️ New to Squarespace? Get your free roadmap: insidethesquare.co/roadmap
🙋‍♀️ New to CSS? Learn the basics for free: insidethesquare.co/learn
️ Ready to go pro? Get my custom code collection: insidethesquare.co/css

 

BeccaHarpain.gif.236d6ddd88c7d637645b762799f501a8.gif

 

  • 2 weeks later...
Posted

I tried doing "p" for paragraph 2, but it changes my praragraph 3 as well. Do you know why it could be?

On 5/11/2020 at 1:44 PM, inside_the_square said:

Hey @rkho - i have the codes your looking for! 😄 In 7.1 sites, large paragraph goes by the code name ".sqsrte-large", Medium paragraph text is the normal "p" and small paragraph text goes by ".sqsrte-small"

Why? I have no idea, but that's what works for my 7.1 sites! Haha

I also have a list of all the other text types like quotes, forms, button types, images, etc on pages 16 - 26 in my CSS cheat sheet if you have a copy of that. Plenty of other text code names to work with 👍👍

 

  • 5 months later...
Posted
On 5/11/2020 at 1:44 PM, inside_the_square said:

Hey @rkho - i have the codes your looking for! 😄 In 7.1 sites, large paragraph goes by the code name ".sqsrte-large", Medium paragraph text is the normal "p" and small paragraph text goes by ".sqsrte-small"

Why? I have no idea, but that's what works for my 7.1 sites! Haha

I also have a list of all the other text types like quotes, forms, button types, images, etc on pages 16 - 26 in my CSS cheat sheet if you have a copy of that. Plenty of other text code names to work with 👍👍

thanks so much for this!

  • 5 weeks later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.