fatrat Posted October 27, 2022 Posted October 27, 2022 (edited) Hi all, due to the google font thing going on right now with DSVGO in germany i changed my fonts on the website (https://www.fatrat.de/) It's running on Squarspace 7.0 and the theme is called "Trombone Shorty" If i recall correctly So far I got everything up and running with CSS, Navigation and other texts seem to work just fine, it's only the tag-line under the logo that's causing me a headache right now. With Mozilla Inspector i found tag-line, site-title, title-area, but everything i tried doesn't seem to trigger this exact code snippet (i.e. site-tagline { font-family: 'Hind';} and other variants that seemed logic to me according to the nav# inserts) Can anybody help me out please? This is the code I inserted so far for the other parts of the website:EDIT: just found out that p { font-family: 'Hind' !important; } seems to work, i would just like to know if there's a "better" way of doing it just for the tag-line. //insert Google Font @font-face { font-family: Hind; src: url(https://static1.squarespace.com/static/59e5f5368dd041cf607681d9/t/635a5dbafe2ce0693d5ea65b/1666866620134/Hind-Regular.ttf); } h1 { font-family: 'Hind'; } h2 { font-family: 'Hind'; } h3 { font-family: 'Hind'; } p { font-family: 'Hind'; } nav#main-navigation ul li a { font-family: 'Hind'; } nav#mobile-navigation ul li a { font-family: 'Hind'; } #mobile-navigation-label:after { font-family: 'Hind'; } Thanks a lot in advance! Peter Edited October 27, 2022 by fatrat
Solution Caroline_Smith Posted October 28, 2022 Solution Posted October 28, 2022 (edited) You could use the class selector to select .site-tagline. This will ensure only the tagline is applying the CSS rule instead of all paragraphs, unless you wanted all paragraphs to have that font-family then you would just use your initial code snippet. .site-tagline { font-family: 'Hind' !important; } Edited October 28, 2022 by Caroline_Smith Feel free to email me with any customization inquiries or questions you may have! Free Squarespace Resources: DevTools Minicourse, 11-Step Guide to Improve Custom CSS, Free Product/Pricing Comparison Table Generator
fatrat Posted November 3, 2022 Author Posted November 3, 2022 On 10/28/2022 at 2:58 PM, Caroline_Smith said: You could use the class selector to select .site-tagline. This will ensure only the tagline is applying the CSS rule instead of all paragraphs, unless you wanted all paragraphs to have that font-family then you would just use your initial code snippet. .site-tagline { font-family: 'Hind' !important; } thank you so much, this did the trick!
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment