TinyMCE Style_SELECT-追加类

时间:2014-05-07 作者:Howdy_McGee

TL;DR Question

<如何使用创建类的子菜单style_format?

Style Select Drop Down Menu

上面的图片正是我想要的。我可以通过这个过滤函数添加类-The problem 它删除了所有预定义的菜单项(通过对齐标题),并将它们替换为“我的类”。

function myformatTinyMCE($in) {
    $style_formats = array(
        array(  
            \'title\' => \'Blue Color\',
            \'selector\' => \'p,strong,u,em,ul,ol,a\',
            \'classes\' => \'blueColor\',
            \'wrapper\' => false,
        )
    );  
    $in[\'style_formats\'] = json_encode( $style_formats );

    return $in; 
}
add_filter(\'tiny_mce_before_init\', \'myformatTinyMCE\' );
我看了看TinyMCE style_formats Documentation 尝试和复制他们所做的,但看起来他们可能有预定义的样式连接到关键字,比如对齐,所以我不确定这是否可行。我能够复制子菜单,但无法应用它,因为它是一个类,而不是直接style="" 总体安排

function myformatTinyMCE($in) {
    $style_formats = array(
        array(
            \'title\' => \'Classes\',
            \'items\' =>  array(  
                array(
                    \'title\' => \'Blue Color\',
                    \'icon\' => \'alignleft\',
                    \'format\' => \'blueColor\'
                )
            )
        )
    );  
    $in[\'style_formats\'] = json_encode( $style_formats );

    return $in; 
}
add_filter(\'tiny_mce_before_init\', \'myformatTinyMCE\' );

1 个回复
最合适的回答,由SO网友:Howdy_McGee 整理而成

EDIT

快速简便的方法只是一个简单的设置:style_formats_merge...

function myformatTinyMCE($in) { 
         $style_formats = array(
            array(
                \'title\' => \'Classes\',
                \'items\' =>  array(  
                    array(
                        \'title\' => \'Blue Color\',
                        \'selector\' => \'p,strong,u,em,ol,ul\',
                        \'classes\' => \'blueColor\'
                    )
                )
            )
        );
        $in[\'style_formats_merge\'] = true;
        $in[\'style_formats\'] = json_encode( $style_formats );

        return $in; 
    }
    add_filter(\'tiny_mce_before_init\', \'myformatTinyMCE\' );
低于这一点的一切都是一个更长的路要走,但可能对未来的观众有帮助,所以我将保留它。


在我问了这个问题之后,我在TinyMCE表格上找到了答案:Adding Class to TinyMCE style_formats - 不是代码的最后一行。WordPress格式如下所示:

function myformatTinyMCE($in) { 
     $style_formats = array(
        array(
            \'title\' => \'Classes\',
            \'items\' =>  array(  
                array(
                    \'title\' => \'Blue Color\',
                    \'selector\' => \'p,strong,u,em,ol,ul\',
                    \'classes\' => \'blueColor\'
                )
            )
        )
    );  
    $in[\'style_formats\'] = json_encode( $style_formats );

    return $in; 
}
add_filter(\'tiny_mce_before_init\', \'myformatTinyMCE\' );
不幸的是,它仍然清除了所有旧的TinyMCE菜单项。然后我用style_format docs 重新创建菜单项。长版本如下所示(没有类)。

function myformatTinyMCE($in) { 
     $style_formats = array(
        array(
            \'title\' => \'Headers\', 
            \'items\' => array(
                array(
                    \'title\' => \'Header 1\', 
                    \'format\' => \'h1\'
                ),
                array(
                    \'title\' => \'Header 2\', 
                    \'format\' => \'h2\',
                ),
                array(
                    \'title\' => \'Header 3\', 
                    \'format\' => \'h3\'
                ),
                array(
                    \'title\' => \'Header 4\', 
                    \'format\' => \'h4\'
                ),
                array(
                    \'title\' => \'Header 5\', 
                    \'format\' => \'h5\'
                ),
                array(
                    \'title\' => \'Header 6\', 
                    \'format\' => \'h6\'
                )
            )
        ),
        array(
            \'title\' => \'Inline\', 
            \'items\' => array(
                array(
                    \'title\' => \'Bold\', 
                    \'icon\' => \'bold\', 
                    \'format\' => \'bold\'
                ),
                array(
                    \'title\' => \'Italic\', 
                    \'icon\' => \'italic\', 
                    \'format\' => \'italic\'
                ),
                array(
                    \'title\' => \'Underline\', 
                    \'icon\' => \'underline\', 
                    \'format\' => \'underline\'
                ),
                array(
                    \'title\' => \'Strikethrough\', 
                    \'icon\' => \'strikethrough\', 
                    \'format\' => \'strikethrough\'
                ),
                array(
                    \'title\' => \'Superscript\', 
                    \'icon\' => \'superscript\', 
                    \'format\' => \'superscript\'
                ),
                array(
                    \'title\' => \'Subscript\', 
                    \'icon\' => \'subscript\', 
                    \'format\' => \'subscript\'
                ),
                array(
                    \'title\' => \'Code\', 
                    \'icon\' => \'code\', 
                    \'format\' => \'code\'
                )
            )
        ),
        array(
            \'title\' => \'Blocks\', 
            \'items\' => array(
                array(
                    \'title\' => \'Paragraph\', 
                    \'format\' => \'p\'
                ),
                array(
                    \'title\' => \'Blockquote\', 
                    \'format\' => \'blockquote\'
                ),
                array(
                    \'title\' => \'Div\', 
                    \'format\' => \'div\'
                ),
                array(
                    \'title\' => \'Pre\', 
                    \'format\' => \'pre\'
                )
            )
        ),
        array(
            \'title\' => \'Alignment\', 
            \'items\' => array(
                array(
                    \'title\' => \'Left\', 
                    \'icon\' => \'alignleft\', 
                    \'format\' => \'alignleft\'
                ),
                array(
                    \'title\' => \'Center\', 
                    \'icon\' => \'aligncenter\', 
                    \'format\' => \'aligncenter\'
                ),
                array(
                    \'title\' => \'Right\', 
                    \'icon\' => \'alignright\', 
                    \'format\' => \'alignright\'
                ),
                array(
                    \'title\' => \'Justify\', 
                    \'icon\' => \'alignjustify\', 
                    \'format\' => \'alignjustify\'
                )
            )
        )
    );  
    $in[\'style_formats\'] = json_encode( $style_formats );

    return $in; 
}
add_filter(\'tiny_mce_before_init\', \'myformatTinyMCE\' );
您只需将第一个函数中的classes数组附加到此现有函数中,即可将其添加为最后一个菜单项。这是精简版,包含以下类别:

function myformatTinyMCE($in) { 
     $style_formats = array(
        array(\'title\'=>\'Headers\',\'items\'=>array(array(\'title\'=>\'Header 1\',\'format\'=>\'h1\'),array(\'title\'=>\'Header 2\',\'format\'=>\'h2\',),array(\'title\'=>\'Header 3\',\'format\'=>\'h3\'),array(\'title\'=>\'Header 4\',\'format\'=>\'h4\'),array(\'title\'=>\'Header 5\',\'format\'=>\'h5\'),array(\'title\'=>\'Header 6\',\'format\'=>\'h6\'))),array(\'title\'=>\'Inline\',\'items\'=>array(array(\'title\'=>\'Bold\',\'icon\'=>\'bold\',\'format\'=>\'bold\'),array(\'title\'=>\'Italic\',\'icon\'=>\'italic\',\'format\'=>\'italic\'),array(\'title\'=>\'Underline\',\'icon\'=>\'underline\',\'format\'=>\'underline\'),array(\'title\'=>\'Strikethrough\',\'icon\'=>\'strikethrough\',\'format\'=>\'strikethrough\'),array(\'title\'=>\'Superscript\',\'icon\'=>\'superscript\',\'format\'=>\'superscript\'),array(\'title\'=>\'Subscript\',\'icon\'=>\'subscript\',\'format\'=>\'subscript\'),array(\'title\'=>\'Code\',\'icon\'=>\'code\',\'format\'=>\'code\'))),array(\'title\'=>\'Blocks\',\'items\'=>array(array(\'title\'=>\'Paragraph\',\'format\'=>\'p\'),array(\'title\'=>\'Blockquote\',\'format\'=>\'blockquote\'),array(\'title\'=>\'Div\',\'format\'=>\'div\'),array(\'title\'=>\'Pre\',\'format\'=>\'pre\'))),array(\'title\'=>\'Alignment\',\'items\'=>array(array(\'title\'=>\'Left\',\'icon\'=>\'alignleft\',\'format\'=>\'alignleft\'),array(\'title\'=>\'Center\',\'icon\'=>\'aligncenter\',\'format\'=>\'aligncenter\'),array(\'title\'=>\'Right\',\'icon\'=>\'alignright\',\'format\'=>\'alignright\'),array(\'title\'=>\'Justify\',\'icon\'=>\'alignjustify\',\'format\'=>\'alignjustify\')))
        ,array(
            \'title\' => \'Classes\',
            \'items\' =>  array(  
                array(
                    \'title\' => \'Blue Color\',
                    \'selector\' => \'p,strong,u,em,ol,ul\',
                    \'classes\' => \'blueColor\'
                )
            )
        )
    );   
    $in[\'style_formats\'] = json_encode( $style_formats );

    return $in; 
}
add_filter(\'tiny_mce_before_init\', \'myformatTinyMCE\' );

结束