Make WordPress Core

Opened 4 years ago

Closed 22 months ago

#41416 closed defect (bug) (invalid)

styleselect no longer displaying webfont from editor style

Reported by: smerriman Owned by:
Milestone: Priority: normal
Severity: normal Version: 4.9
Component: TinyMCE Keywords: reporter-feedback
Focuses: Cc:


Webfonts enqueued as an editor style no longer render in the styleselect dropdown. They definitely used to; perhaps a change in 4.8.

Steps to replicate:

  • add in the styleselect dropdown and a simple style:
function my_mce_buttons_2( $buttons ){
    array_splice( $buttons, 0, 0, 'styleselect' );
    return $buttons;
add_filter('tiny_mce_before_init', 'my_mce_mod');
function my_mce_mod( $init ) {
    $style_formats = array (
        array( 'title' => 'Test', 'block' => 'p', 'classes'=>'test'),
    $init['style_formats'] = json_encode( $style_formats );
    $init['style_formats_merge'] = false;

    return $init;

  • enqueue an editor style which uses font-face, and apply the styling to the test class.

The font appears fine in the editor, but has a big ugly default in the styleselect dropdown.

I'm hoping there is a solution to this that doesn't include having to repeat the whole font definition in wp-admin itself.

Change History (2)

#1 @azaozz
4 years ago

  • Keywords reporter-feedback added

I think the problem is that the font css is loaded only in the editor iframe, and the styleselect drop-down is outside in the main window. Try to load the webfont in the main window too.

Alternatively can turn off font-family preview in the drop-down, see https://www.tinymce.com/docs/configure/editor-appearance/#preview_styles.

Last edited 4 years ago by azaozz (previous) (diff)

#2 @azaozz
22 months ago

  • Milestone Awaiting Review deleted
  • Resolution set to invalid
  • Status changed from new to closed

No response in quite a while. Considering this needed loading of the font in the main window.

Note: See TracTickets for help on using tickets.