hjl Posted October 25, 2021 Posted October 25, 2021 Site URL: https://www.myliminal.co I'm trying to make the the entire site have a specific custom font except for the header title text which I want to be a different custom font. This is my CSS code: @font-face { font-family: 'JennaSue'; src: url('https://static1.squarespace.com/static/617131152993aa572166f333/t/6176d11e66db235b0a6cf4fb/1635176734215/._JennaSue.ttf'); } @font-face { font-family: 'JennaSueItalic'; src: url(https://static1.squarespace.com/static/617131152993aa572166f333/t/61770dddf22bc004a409c794/1635192286037/JennaSue.ttf); } * { font-family: 'JennaSue' !important; } .header-title-text { font-family: 'JennaSueItalic' } This doesn't seem to work, however. It changes the site-wide font to JennaSue including the header, but the header doesn't change to JennaSueItalic. Any help would be greatly appreciated. Thanks!
Wolfsilon Posted October 25, 2021 Posted October 25, 2021 The above font changes does not reflect the live version. From my end, the website is being entirely displayed in "Times" font. Did you remove the custom font while you're testing? To change the font text for the title only the CSS would be: .header-title-text a { font-family: "YOUR_FONT_HERE"; } "a" - is the name of the element that contains your text For the most part, when changing the font styles for elements it is important to be as specific as you can with targeting the correct selectors.
hjl Posted October 25, 2021 Author Posted October 25, 2021 12 minutes ago, Wolfsilon said: The above font changes does not reflect the live version. From my end, the website is being entirely displayed in "Times" font. Did you remove the custom font while you're testing? Are you sure? I'm looking at the live version right now and it's displaying as my custom font, JennaSue. I want to change the font for the whole website to JennaSue apart from the header title text, which I would like to be an italicized version of JennaSue (in this case, a completely different from, as you can see from above code: 54 minutes ago, hjl said: @font-face { font-family: 'JennaSue'; src: url('https://static1.squarespace.com/static/617131152993aa572166f333/t/6176d11e66db235b0a6cf4fb/1635176734215/._JennaSue.ttf'); } @font-face { font-family: 'JennaSueItalic'; src: url(https://static1.squarespace.com/static/617131152993aa572166f333/t/61770dddf22bc004a409c794/1635192286037/JennaSue.ttf); } I tried your suggestion: 13 minutes ago, Wolfsilon said: To change the font text for the title only the CSS would be: .header-title-text a { font-family: "YOUR_FONT_HERE"; } "a" - is the name of the element that contains your text but it doesn't seem to work either. The whole website including the header title text continues to show in JennaSue
Wolfsilon Posted October 25, 2021 Posted October 25, 2021 Could be on my end, something blocking the src but here's a screenshot. I don't really have an idea of what the font should look like so my apologies if it is looking how it's supposed to.
Recommended Posts
Archived
This topic is now archived and is closed to further replies.