Font Feature Settings — is it possible?

[johnszetho_]

hello,

Fairly new to the coding world but I am trying to get CSS 'font-feature-settings' working on my website. The webfont I am using is 'Wallop Medium' by Displaay which I have uploaded within my Lay Theme as a .woff.

I inserted the following code into the custom CSS section. However, it doesn't work...

.sitetitle-txt-inner _Default {
font-feature-settings: "ss01", "ss10", "ss13", "ss14", "ss15", "liga", "swsh", "liga" 0, "dlig" 0;
}

When I use the same code in the Chrome developer tools section under 'element.style {', it works.

Can anyone help?

Site URL: johnszetho.com

[mariusjopen]

Dear @johnszetho_
I cannot see it work in inspector. Can you send a screenshot when the snippet is active?

Best!

Marius

[edgrbnz]

If you want all these features to be applied to the whole site the best would be to add that to your body, like so:

body {
-moz-font-feature-settings: "ss01", "ss10", "ss13", "ss14", "ss15", "liga", "swsh", "liga" 0, "dlig" 0; 
-ms-font-feature-settings: "ss01", "ss10", "ss13", "ss14", "ss15", "liga", "swsh", "liga" 0, "dlig" 0; 
-o-font-feature-settings: "ss01", "ss10", "ss13", "ss14", "ss15", "liga", "swsh", "liga" 0, "dlig" 0; 
-webkit-font-feature-settings: "ss01", "ss10", "ss13", "ss14", "ss15", "liga", "swsh", "liga" 0, "dlig" 0; 
font-feature-settings: "ss01", "ss10", "ss13", "ss14", "ss15", "liga", "swsh", "liga" 0, "dlig" 0;
}

If you only want to apply these settings to your _Default class you should also be able to add that after the body-tag like so: body _Default {…

If you want to check which font feature does what and get the corresponding code I’d recommend to go to this site choose your (local) font and play around with the settings and copy the code as soon as the typeface does what you desire.

If you want to read about all possible open type features I’d recommend to check out this site.

Hope this helps — Cheers!

[johnszetho_]

@edgrbnz thanks for the tip!

It worked when I applied the code solely to the body tag.

Really helpful, cheers again.

John

[edgrbnz]

You are very welcome!
Happy it works! 💐💐💐

[johnszetho_]

@mariusjopen

This one did the trick:

Although, worth noting that it shows an error message despite that it works.

Thanks for your help!

[mariusjopen]

Dear @johnszetho_
ah great! Thank you for sharing!!!

Best!

Marius