- This topic has 11 replies, 4 voices, and was last updated 2 years, 11 months ago by David.
-
AuthorPosts
-
October 31, 2020 at 12:55 pm #1512793Matthieu
Hello, is it possible to add a google font that is not available on generatepress ?
ThanksOctober 31, 2020 at 6:30 pm #1512957LeoStaffCustomer SupportHi there.
This should help:
https://docs.generatepress.com/article/customizing-the-google-font-list/Let me know ๐
November 1, 2020 at 5:15 am #1513269MatthieuHello, thank you for your answer. The css code to add is added directly in: Appearance> Customize> Additional CSS ?
ThanksNovember 1, 2020 at 7:52 am #1513493DavidStaffCustomer SupportHi there,
the code in the article Leo provided is PHP.
This article explains how to add PHP:November 1, 2020 at 7:56 am #1513498MatthieuHello yes I saw that it was in php. On the other hand, I installed the snippet code extension in order to add the code to integrate my typo chosen on google font (Cormorant Garamond) :
add_filter ('generate_typography_customize_list', 'tu_add_google_fonts'); function tu_add_google_fonts ($ fonts) { $ fonts ['Cormorant_Garamond'] = tableau ( 'name' => 'Cormorant_Garamond', 'variantes' => array ('300', '300i', '400', '400i', '500', '500i', '600', '600i', '700', '700i'), 'category' => 'serif' ); renvoie $ fonts; }
It does not work. Does the piece of code need to be modified ?
ThanksNovember 1, 2020 at 1:21 pm #1513787LeoStaffCustomer SupportCopy the exact code here and paste it in Code Snippet:
add_filter( 'generate_typography_customize_list', 'tu_add_google_fonts' ); function tu_add_google_fonts( $fonts ) { $fonts[ 'cormorant_garamond' ] = array( 'name' => 'Cormorant Garamond', 'variants' => array( '300', '300i', '400', '400i', '500', '500i', '600', '600i', '700', '700i' ), 'category' => 'serif' ); return $fonts; }
November 1, 2020 at 1:53 pm #1513804MatthieuIt’s perfect ! Thanks !
November 2, 2020 at 9:47 am #1514913LeoStaffCustomer SupportNo problem ๐
December 23, 2020 at 11:33 pm #1592828PhilippeHi there,
I have a few problems with that.
Here is the code I added to a custom plugin:add_filter( 'generate_typography_customize_list', 'tu_add_google_fonts' ); function tu_add_google_fonts( $fonts ) { $fonts[ 'Petrona' ] = array( 'name' => 'Petrona', 'variants' => array( '100', '100i', '200', '200i', '300', '300i', '400', '400i', '500', '500i', '600', '600i', '700', '700i', '800', '800i', '900', '900i'), 'category' => 'serif' ); $fonts[ 'Barlow' ] = array( 'name' => 'Barlow', 'variants' => array( '100', '100i', '200', '200i', '300', '300i', '400', '400i', '500', '500i', '600', '600i', '700', '700i', '800', '800i', '900', '900i'), 'category' => 'serif' ); $fonts[ 'Barlow Condensed' ] = array( 'name' => 'Barlow Condensed', 'variants' => array( '100', '100i', '200', '200i', '300', '300i', '400', '400i', '500', '500i', '600', '600i', '700', '700i', '800', '800i', '900', '900i'), 'category' => 'serif' ); $fonts[ 'Barlow Semi Condensed' ] = array( 'name' => 'Barlow Semi Condensed', 'variants' => array( '100', '100i', '200', '200i', '300', '300i', '400', '400i', '500', '500i', '600', '600i', '700', '700i', '800', '800i', '900', '900i'), 'category' => 'serif' ); return $fonts; }
After having done that I can now choose the font. The problem is that the variants are not loaded:
https://pasteboard.co/JGnaswD.pngIt should look like that. (Ubuntu as example)
https://pasteboard.co/JGnbaDg.pngSince there are no variants I can’t choose different variants for example in the headings.
The other thing is: I tried deactivating and reactivating my plugin. But I noticed that the fonts were still there after deactivating and they now appear twice on the list after reactivating. That looks messy.
Can you help me?
Merry Christmas
PhilippeDecember 24, 2020 at 3:37 am #1592994DavidStaffCustomer SupportHi there,
Petrona is one of Googles Variable fonts which requires a different way to load the font.
Go to the fonts google page:https://fonts.google.com/specimen/Petrona?query=Petrona&sidebar.open=true
Select the Styles you want, in the sidebar it will generate a Link like this:
<link rel="preconnect" href="https://fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css2?family=Petrona:wght@100&display=swap" rel="stylesheet">
You can then Hook this into the
wp_head
hook using a Hook element:https://docs.generatepress.com/article/hooks-element-overview/
May 12, 2021 at 5:09 am #1775706MatthieuHello, is it possible to add a font that is not on google font ?
Thanks
May 12, 2021 at 5:12 am #1775710DavidStaffCustomer SupportHi there,
you would need to install the fonts locally:
-
AuthorPosts
- You must be logged in to reply to this topic.