Jump to content

Add a custom font to the Page Title Overlay and Description in the Tremont Template

Recommended Posts

Site URL: https://tealthomsen.com/

Hello, 

I have added a custom font through CSS that I am using for my Site Title and Tagline. I would like to use this same font for the Page Titles and Descriptions that appear as an overlay in both my gallery pages and regular pages. Examples below - 

Gallery Page - https://tealthomsen.com/spaces - I want to target the page title, "Spaces"  and the text below it to use a custom font. 

Regular Page - https://tealthomsen.com/about - I want to target  the page title, "Info" to use a custom font. 

I have tried .page-title and .page-description but no luck. 

The CSS I am currently using to customize the font fo the site title and tagline is below. 

@font-face {

    font-family: 'PostalServiceOutline';

       src: url('https://static1.squarespace.com/static/54adbf3ce4b02f8ed4174b5d/t/5f1f4ca997bb38421796f203/1595886764469/CN-Postal-Service-Outline.otf');}

@font-face {

    font-family: 'PostalService';

       src: url('https://static1.squarespace.com/static/54adbf3ce4b02f8ed4174b5d/t/5f1f4c9daae24951927da33b/1595886749856/CN-Postal-Service.otf');}


.site-title { font-family: "PostalServiceOutline";}

.site-tagline { font-family: "PostalService";} 

 

 

Link to comment

You can use this selector

.page-title { font-family: "PostalServiceOutline" !important;}

.page-desc { font-family: "PostalService" !important;} 

 

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.