Skip to main content

Font Changes Template draft

Amplify Homepage (add to sitewide advanced preferences before </head> 

<!-- Put this in <head>and SWAP OUT YOUR FONTS -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lexend+Exa:wght@100..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<style>
 

/* Global base swap out your font families, separate if needed*/
body,
.full-poc .body p,
.amplify-meetings .container .meetings-container .no-meetings-text-container p {
  font-family: "Work Sans", sans-serif; /* base */
}

/* Navigation and teaser headings */
.amplify-navigation ul li a,
.amplify-teasers.standard .standard-container .standard-teasers-container 
.standard-teaser-container .standard-teaser-content-container .heading {
  font-family: "Lexend Exa", sans-serif;
}

/* Headings */
h1, h2, h3,
.full-poc .body h3,
.full-poc header h2,
.full-poc .body h4,
.news-cycle-section h5,
.news-cycle-section span,
amplify-header .container nav .secondary-container ul li a,
.amplify-quicklinks-container .container header h3 {
  font-family: "Lexend Exa", sans-serif;
}

/* Legacy notification pieces that must be Lexend Exa */
.legacy-notification a,
.legacy-notification button {
  font-family: "Lexend Exa", sans-serif;
}
</style>

Internal Classic Add to advanced theme editor under styles 

//Updating font to replace with your import
@at-root {
  
@import url('https://fonts.googleapis.com/css2?family=Lexend+Exa:wght@100..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');
}
& {
 font-family: "Work Sans", sans-serif;
font-family: "Lexend Exa", sans-serif;
 }
 //replace with your font families
h2, h3, h4 {
  font-family: "Lexend Exa", sans-serif;
}

.body p {
  font-family: "Work Sans", sans-serif;
}

.full-poc .body p {
  font-family: "Work Sans", sans-serif;
  // font-weight: 400; // or 500
  // font-style: normal;
  // color: $secondary-color;
}

// Headings — Libre Franklin
h1, h2, h3,
.full-poc .body h3,
.full-poc header h2 {
  font-family: "Lexend Exa", sans-serif;
}

.full-poc header h2 {
  // color: #2E7C64 !important;
}

// Specific styles
.full-poc .body h3 {
  font-family: "Lexend Exa", sans-serif;
  // font-weight: 800 !important;
  // color: $primary-color;
}

.full-poc .body h4 {
  font-family: "Lexend Exa", sans-serif;
  // font-weight: 650;
  // color: $secondary-color;
}

// Optional: news cycle fallback usage if needed
.news-cycle-section h5,
.news-cycle-section span {
  font-family: "Lexend Exa", sans-serif;
}

// nav bar internal
// & {
//   font-family: ...;
// }

.navbar-nav li a {
  font-family: "Lexend Exa", sans-serif;
  // color: #fff !important;
  // font-weight: 700;
  // background: #15424A !important;
}

.navbar-nav li a:hover,
.navbar-nav li a:focus {
  font-family: "Lexend Exa", sans-serif;
  // color