将自定义样式格式添加到TinyMCE(高级自定义字段)

时间:2018-06-18 22:47:07

标签: php wordpress tinymce advanced-custom-fields

我为高级自定义字段创建了一个新的TinyMCE布局,名为"非常简单"我想在特定的WYSIWYG字段上使用。我设法添加了我想要的按钮,我现在正在寻找一种方法来添加自定义样式格式列表作为下拉列表,但我无法弄清楚如何执行此操作。

我现在的代码如下:

// Customize ACF MCE
add_filter( 'acf/fields/wysiwyg/toolbars' , 'new_toolbars'  );
function new_toolbars( $toolbars )
{
    // - this toolbar has only 1 row of buttons
    $toolbars['Very Simple' ] = array();
    $toolbars['Very Simple' ][1] = array('bold' , 'italic' , 'underline', 'link', 'unlink' );

    $style_formats = array(  
        // These are the custom styles
        array(  
            'title' => 'Red Button',  
            'block' => 'span',  
            'classes' => 'red-button',
            'wrapper' => true,
        ),  
        array(  
            'title' => 'Content Block',  
            'block' => 'span',  
            'classes' => 'content-block',
            'wrapper' => true,
        ),
        array(  
            'title' => 'Highlighter',  
            'block' => 'span',  
            'classes' => 'highlighter',
            'wrapper' => true,
        ),
    );  
    // Insert the array, JSON ENCODED, into 'style_formats'
    $toolbars['Very Simple'][1]['styleselect'] = json_encode( $style_formats );

    // return $toolbars - IMPORTANT!
    return $toolbars;
}

未显示样式格式下拉列表。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

styleselect下拉菜单默认情况下是隐藏的,因此要显示任何已注册的格式/样式,您只需激活可视编辑器中的styleselect下拉菜单即可。

以下功能(来自WordPress Codex)可过滤TinyMCE加载的按钮数组,因此只需将其添加到functions.php中即可。我正在使用mce_buttons_2过滤器,使其显示在工具栏的第二行。

// Callback function to insert 'styleselect' into the $buttons array
function my_mce_buttons_2( $buttons ) {
    array_unshift( $buttons, 'styleselect' );
    return $buttons;
}

// Register our callback to the appropriate filter
add_filter( 'mce_buttons_2', 'my_mce_buttons_2' );