donforello Posted January 23, 2021 Share Posted January 23, 2021 Dear Community, does someone know how to apply a custom font to the Monospace? I was able to successfully apply my custom font to the Headline and Paragraph font, though not on Monospace. Anyone has a clue? Thanks! Link to comment
Solution tuanphan Posted January 31, 2021 Solution Share Posted January 31, 2021 Add to Design > Custom CSS /* monospace */ pre code { font-family: futura-pt !important; } Replace futura-pt with your custom font ec25 and Piebie 2 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
donforello Posted February 1, 2021 Author Share Posted February 1, 2021 @tuanphan thanks! Is it also possible to change the font size? Because the standard monospace font size has the same size as p2, though I'd like to have the p3 size - is that possible? Link to comment
tuanphan Posted February 6, 2021 Share Posted February 6, 2021 add font-size: 20px !important; Piebie and donforello 2 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
donforello Posted February 7, 2021 Author Share Posted February 7, 2021 @tuanphan that's perfect, thank you for all your help. Link to comment
SuperBonjour Posted September 2, 2022 Share Posted September 2, 2022 is there another way to do this? i didn't succeed.... Link to comment
tuanphan Posted September 3, 2022 Share Posted September 3, 2022 21 hours ago, SuperBonjour said: is there another way to do this? i didn't succeed.... Can you share link to page where you use monospace & which exact code did you add? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
jorgiabrows Posted September 13, 2022 Share Posted September 13, 2022 I can't get that to above css to work for my monospace font. Anyone able to assist? Link to comment
tuanphan Posted September 16, 2022 Share Posted September 16, 2022 On 9/13/2022 at 10:30 AM, jorgiabrows said: I can't get that to above css to work for my monospace font. Anyone able to assist? Can you share link to your site? We can check it easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
apesma Posted August 1 Share Posted August 1 On 9/2/2022 at 5:20 AM, SuperBonjour said: is there another way to do this? i didn't succeed.... Hello, I stumbled upon this trying to find a way to replace monospace with my custom font because the descriptions of photos in a gallery are in monospace by default. I added the snippet of code and replaced futura-pt with my custom font, but it didn't work. Can anyone help with this? Link to comment
tuanphan Posted August 2 Share Posted August 2 10 hours ago, apesma said: Hello, I stumbled upon this trying to find a way to replace monospace with my custom font because the descriptions of photos in a gallery are in monospace by default. I added the snippet of code and replaced futura-pt with my custom font, but it didn't work. Can anyone help with this? What is your site url & Which exact code did you use? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
apesma Posted August 2 Share Posted August 2 8 hours ago, tuanphan said: What is your site url & Which exact code did you use? My site url is https://www.aristidispesmazoglou.com/photos, and here is the code I used: /* monospace */ pre code { font-family: futura-pt !important; } Link to comment
tuanphan Posted August 6 Share Posted August 6 On 8/3/2023 at 1:44 AM, apesma said: My site url is https://www.aristidispesmazoglou.com/photos, and here is the code I used: /* monospace */ pre code { font-family: futura-pt !important; } With Gallery Caption, you need to use this code .gallery-caption p.gallery-caption-content { font-family: futura-pt !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
apesma Posted August 20 Share Posted August 20 On 8/6/2023 at 12:16 PM, tuanphan said: With Gallery Caption, you need to use this code .gallery-caption p.gallery-caption-content { font-family: futura-pt !important; } Sorry for the late reply. It worked, thanks! I have one more question. When I access my website from a phone, the navigation menu font does not change to my custom font. Do you have any suggestions? Link to comment
tuanphan Posted August 21 Share Posted August 21 16 hours ago, apesma said: Sorry for the late reply. It worked, thanks! I have one more question. When I access my website from a phone, the navigation menu font does not change to my custom font. Do you have any suggestions? Use this div.header-menu-nav-item * { font-family: futura-pt !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Goood_Studio Posted October 18 Share Posted October 18 Hello. The pre code worked for me but when I reduce the font size the line height stays large. I've tried adding {line-height:normal !important;} but it makes no difference. Here's the page: www.unthinkabledigital.co.uk/case-studies/heart-n-soul Link to comment
tuanphan Posted October 19 Share Posted October 19 16 hours ago, Goood_Studio said: Hello. The pre code worked for me but when I reduce the font size the line height stays large. I've tried adding {line-height:normal !important;} but it makes no difference. Here's the page: www.unthinkabledigital.co.uk/case-studies/heart-n-soul You can use a specific value line-height: 20px !important; Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Goood_Studio Posted October 19 Share Posted October 19 1 hour ago, tuanphan said: You can use a specific value line-height: 20px !important; Thanks tuanphan but when I bring the font size down below 20px the line height doesn't change? This is what I'm using: pre code { font-family: futura, sans-serif !important; font-size: 15px !important; line-height: 5px !important; } Here's the page: www.unthinkabledigital.co.uk/case-studies/heart-n-soul Link to comment
tuanphan Posted October 21 Share Posted October 21 On 10/19/2023 at 3:42 PM, Goood_Studio said: Thanks tuanphan but when I bring the font size down below 20px the line height doesn't change? This is what I'm using: pre code { font-family: futura, sans-serif !important; font-size: 15px !important; line-height: 5px !important; } Here's the page: www.unthinkabledigital.co.uk/case-studies/heart-n-soul Use this pre code { font-family: futura,sans-serif !important; font-size: 15px !important; } pre { line-height: 15px !important; } Goood_Studio 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Goood_Studio Posted November 8 Share Posted November 8 On 10/21/2023 at 7:55 AM, tuanphan said: Use this pre code { font-family: futura,sans-serif !important; font-size: 15px !important; } pre { line-height: 15px !important; } Thanks! Worked a treat 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