Archived topic
remote fonts not showing in editor
3 replies · Started by Ben on March 15, 2023
I have fonts hosted at typgraphy.com that are linked to our domain.
The fonts aren't showing in backend editor but are showing in front end.
I'm using an element to have the css linked in header, via wp_head
<link rel="stylesheet" type="text/css" href="https://cloud.typography.com/774752/6209832/css/fonts.css" />
Then font is setup in typography customizer area. All works.
However, fonts are not showing in editor.
I've tried:
add_action( 'after_setup_theme', function() {
add_editor_style( 'https://cloud.typography.com/774752/6209832/css/fonts.css' );
} );
But that doesn't seem to work
Any ideas?
Ben
Hi there,
the block_editor_settings_all filter is the best hook to use to get styles in the editor, as that will also handle responsive views.
To add an external stylesheet try this:
add_filter( 'block_editor_settings_all', function( $editor_settings ) {
$editor_settings['styles'][] = array( 'css' => '@import "https://cloud.typography.com/774752/6209832/css/fonts.css";' );
return $editor_settings;
} );
Perfect, that works, many thanks
Glad to hear that!