CSS to inherit the heading font family

Site URL: https://ukulele-rabbit-z4zx.squarespace.com/

Hello! I'm creating a Squarespace template to sell. 

As the summary blocks aren't possible to change the title to the heading font without code, is it possible to make it so that it just makes the font family whatever the headings are currently set to? 

i.e. 

.summary-title-link {
	font-family: ??inherit??;
}

This is because whoever buys the theme will likely change the font to their own branding, and I don't want to have to get everyone to touch the code in order to change this. 

Thanks!

Site password: pearler

55 minutes ago, pearler1570048501 said:

Site URL: https://ukulele-rabbit-z4zx.squarespace.com/

Hello! I'm creating a Squarespace template to sell. 

As the summary blocks aren't possible to change the title to the heading font without code, is it possible to make it so that it just makes the font family whatever the headings are currently set to? 

i.e. 

.summary-title-link {
	font-family: ??inherit??;
}

This is because whoever buys the theme will likely change the font to their own branding, and I don't want to have to get everyone to touch the code in order to change this. 

Thanks!

Site password: pearler

you can use css variable var() to assign font name dynamically

CSS Variables - The var() function (w3schools.com)

Thanks, @bangank36. That makes sense. As this is new to me, do you have an example of how the code would look for Squarespace? 

I'm unsure what terminology to use. For example, this is what I would do on Shopify:

  font-family:var(--typeHeaderPrimary),var(--typeHeaderFallback);

From what i know so far, i dont think you can create a custom variable for font-family property. I may be wrong. Does anyone know?

@PEARLERwork Did you ever find a solve for this? 🙂

@Stacey_anne Hi! You can use the following: font-family: var(--heading-font-font-family)

@Wallseywalls fantastic! thank-you!