Archived topic
Can't add custom font
7 replies · Started by Tan on November 15, 2022
I follow this guide. But it doesn't work. I don't know what is wrong.
This is my font link.
I add font face css below:
@font-face {
font-family: 'Boheme Floral';
font-weight: normal;
font-style: normal;
src: url('https://nalyn4ever.com/wp-content/uploads/2022/11/Boheme-Floral.ttf') format('truetype');
}Then in Customizer > Typography > Add Font and I paste the name "Boheme Floral" into the Font Family name field, Google Font is disabled.
But nothing happen when I use Headline block to add this font. (You can see it here)
I use it in the first sentence of this page (she said yes)
Please help me fix this.
Thank you!
Hi there,
try converting the font to a .woff and .woff2 versions and load them instead.
For font conversion, search for Font Squirrel.
Hi David,
I tried. But it is still not working.
Can you move your @font-face CSS to the very top of the Additional CSS, so there is no other CSS before it.
Yes, it works! Thank you so much David! :D
But it doesn't show on the backend. What could I do to show it?
Add this PHP Snippet to your site:
add_filter( 'block_editor_settings_all', function( $editor_settings ) {
$css = wp_get_custom_css_post()->post_content;
$editor_settings['styles'][] = array( 'css' => $css );
return $editor_settings;
} );It will load your Customizer Additional CSS in the editor.
Thank you, David. You're awesome! :D
Glad to be of help!
