Site-wide H1 font different to banner text custom font H1

Hello.... I have a custom font for H1 in Custom CSS which works fine across site (7.0 Brine).

I now need the custom font to be used ONLY for H1 in the page banners (intro area in the bottom header banner). The site-wide H1 will now be a standard font used across the site (editable in Design > Site Styles etc).

Very grateful for help. Thank you.

Can you share link to your site? I can take a look

Hi Tuanphan

The site is at www.kinesiology.com.  As you can see the page banners use the brand font (which is a custom installed font) for the h1 title. We used H2 etc for main page content headers. We are setting up some calendar events and the h1 pulls in the custom font.  So we need a way to use Squarespace fonts for h1 and custom font on banners only.  The solution needs to be site wide so the client can add a page with custom font in banner without coding herself etc. If this is not possible maybe we change the h1 font on the Events page instead? 

Thank you again.

Can you take screenshot h1 in footer banner? I don't see...

2 hours ago, ali.duffell said:

 

Can you share link to page in screenshot? I don't see in contact page

Sorry Tuanphan  my link was wrong.... many apologies - here is correct one: www.kinesiologydubai.com

4 minutes ago, ali.duffell said:

Sorry Tuanphan  my link was wrong.... many apologies - here is correct one: www.kinesiologydubai.com

Add to Home > Design > Custom CSS

div#block-c5fe4fdc11ae8cafe4e7 h1 {
    font-family: fantasy;
}

Thanks for quick reply. I tried code instead of h1 bit of current code - but it de-activates the Apalu font....  here is current code for h1:

@font-face {
font-family: 'Apalu';   
src: 
url(https://static1.squarespace.com/static/5a09e383010027aff70c2776/t/5ce6aff1e2c4835031d1b3d5/1558622193802/Apalu.ttf), 
url(https://static1.squarespace.com/static/5a09e383010027aff70c2776/t/5ce6b021e4966b6a53b8f168/1558622241398/apalu-webfont.woff), 
url(https://static1.squarespace.com/static/5a09e383010027aff70c2776/t/5ce6b02fe79c706322dee943/1558622255776/apalu-webfont.woff2); 
}
h1
{
  font-family: 'Apalu';
}

/* h1 on contact page only */
div#block-c5fe4fdc11ae8cafe4e7 h1 {
    font-family: 'Apalu' !important;
}

Hi TP thanks! But it is site wide requirement not page only. Site-wide H1 in banners.

Quote

The solution needs to be site wide so the client can add a page with custom font in banner without coding herself etc.