Jump to content

Help adding Adobe Font to Header

Go to solution Solved by Jia,

Recommended Posts

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

Hi! I have been browsing the forum and trying a few different things to get an adobe font in my header (I am trying to get the site title in the below font). The custom font works for p1 in the body on my website, but not the header for some reason. I'll share what I've tried below, and would so appreciate any help getting the header font to be: 

Quote

font-family: adobe-caslon-pro,serif;
font-weight: 600;
font-style: italic;

 

The site (unfinished): https://www.allotropique.com/

password: allotropique

 

This is in my code injection:

<link rel="stylesheet" href="https://use.typekit.net/epc2fjz.css">

<style type="text/css">
  
  #block-yui_3_17_2_1_1645847571502_526 p {
      font-family: adobe-caslon-pro,serif !important;
    font-weight: 600;
    font-style: italic;
    font-size: 1.9rem !important;
    color: #00ff3d !important;
  }
  
</style>

 

this is in custom css:

h1 {
  	font-family: adobe-caslon-pro,serif;
	font-weight: 600;
	font-style: italic;
}

p {
	font-family: adobe-caslon-pro, serif;
	font-weight: 600;
	font-style: normal;
}


div#block-yui_3_17_2_1_1645847571502_526 p {
    font-family: adobe-caslon-pro,serif  !important;
      font-weight: 600 !important;
    font-style: italic !important;
}

I've tried adding these into the home page-specific CSS:

<style>
  @import url("https://use.typekit.net/epc2fjz.css");
</style>

<style type="text/css">
  
  #block-yui_3_17_2_1_1645847571502_526 p {
      font-family: adobe-caslon-pro,serif !important;
    font-weight: 600;
    font-style: italic;
    font-size: 1.9rem !important;
    color: #00ff3d !important;
  }
  
</style>

<style type="text/css">
  
  #block-yui_3_17_2_1_1645847571502_526 h1 {
      font-family: 'adobe-caslon-pro,serif' !important;
    font-size: 1.9rem !important;
    color: #00ff3d !important;
  }
  
</style>

<style type="text/css">
  
  #block-yui_3_17_2_1_1645847571502_526 p {
      font-family: 'adobe-caslon-pro,serif' !important;
    font-size: 1.9rem !important;
    color: #00ff3d !important;
  }
  
</style>

 

Link to comment
  • Replies 2
  • Views 496
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

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.