mikemobley Posted February 18, 2020 Share Posted February 18, 2020 Site URL: https://www.austinlifechurch.com Does anyone know how to apply the small caps styling to any font? For example, how using CSS could we say something like this: -Have site title logo font (which is adobe garamond pro) have small caps style applied to it? Then maybe an example for header 1 or header 2 or body? Link to comment
paul2009 Posted February 19, 2020 Share Posted February 19, 2020 There isn't a Site Styles tweak for this, so you need to add some CSS to Design > Custom CSS. Your site logo appears to be an image rather than text, but here's an example to affect the H1 titles: h1 { font-variant: small-caps; } You can make it affect other areas by replacing h1 with the correct selector. You could also add other selectors separated by commas to affect more than one area, for example, "h1, h2, h3". Improve your online store with our extensions.About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links.Buy me a coffee Link to comment
mikemobley Posted February 19, 2020 Author Share Posted February 19, 2020 5 hours ago, paul2009 said: There isn't a Site Styles tweak for this, so you need to add some CSS to Design > Custom CSS. Your site logo appears to be an image rather than text, but here's an example to affect the H1 titles: h1 { font-variant: small-caps; } You can make it affect other areas by replacing h1 with the correct selector. You could also add other selectors separated by commas to affect more than one area, for example, "h1, h2, h3". Ok great thank you. So how then besides h1 would I be able to reference other areas like site title or navigation, etc. ? Link to comment
paul2009 Posted February 19, 2020 Share Posted February 19, 2020 If you want to identify other selectors, you may find these articles helpful. They are a few years old but should still be relevant. Finding CSS ID and Class Selectors Using CSS on Squarespace Improve your online store with our extensions.About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. Content: Links in my posts may refer to SF Digital products or may be affiliate links.Buy me a coffee Link to comment
mikemobley Posted February 20, 2020 Author Share Posted February 20, 2020 Got it, thank you! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment