Google Syntax Highlighter 与WordPress的兼容性
Google Syntax Highlighter 与 tinyMCE 的兼容性
当我们在WordPress中写日志,要插入一段php代码的时候,在HTML视图下,可以如下
<pre name="code" class="php">
code....
</pre>
但当我们恢复到可视化的时候,代码就会变成
<pre class="php">
code....
</pre>
此时, Google Syntax Highlighter 便识别不出来了。
因为 Google Syntax Highlighter 是通过 pre的 name 熟悉来识别的。
出现这样的情况,是因为 WordPress 采用的 tinyMCE 编辑器。而 tinyMCE编辑器默认 给 pre 没有添加 name 属性。
所以,我们只需要更改下 tinyMCE的初始化部分的代码即可。
在 wp-admin/includes/post.php 里面
找到如下代码
$initArray = array (
'mode' => 'specific_textareas',
'editor_selector' => 'theEditor',
'width' => '100%',
'theme' => 'advanced',
'skin' => 'wp_theme',
'theme_advanced_buttons1' => "$mce_buttons",
'theme_advanced_buttons2' => "$mce_buttons_2",
'theme_advanced_buttons3' => "$mce_buttons_3",
'theme_advanced_buttons4' => "$mce_buttons_4",
'language' => "$mce_locale",
'spellchecker_languages' => "$mce_spellchecker_languages",
'theme_advanced_toolbar_location' => 'top',
'theme_advanced_toolbar_align' => 'left',
'theme_advanced_statusbar_location' => 'bottom',
'theme_advanced_resizing' => true,
'theme_advanced_resize_horizontal' => false,
'dialog_type' => 'modal',
'relative_urls' => false,
'remove_script_host' => false,
'convert_urls' => false,
'apply_source_formatting' => false,
'remove_linebreaks' => true,
'gecko_spellcheck' => true,
'entities' => '38,amp,60,lt,62,gt',
'accessibility_focus' => true,
'tabfocus_elements' => 'major-publishing-actions',
'media_strict' => false,
'paste_remove_styles' => true,
'paste_remove_spans' => true,
'paste_strip_class_attributes' => 'all',
'wpeditimage_disable_captions' => $no_captions,
'plugins' => "$plugins"
);
这个 $initArray 变量就是用来初始化 tinyMCE的。我们只需要给其添加上一个变量 即可:
‘extended_valid_elements’ => “pre[name|class]”
添加后 的完整代码如下:
$initArray = array (
'mode' => 'specific_textareas',
'editor_selector' => 'theEditor',
'width' => '100%',
'theme' => 'advanced',
'skin' => 'wp_theme',
'theme_advanced_buttons1' => "$mce_buttons",
'theme_advanced_buttons2' => "$mce_buttons_2",
'theme_advanced_buttons3' => "$mce_buttons_3",
'theme_advanced_buttons4' => "$mce_buttons_4",
'language' => "$mce_locale",
'spellchecker_languages' => "$mce_spellchecker_languages",
'theme_advanced_toolbar_location' => 'top',
'theme_advanced_toolbar_align' => 'left',
'theme_advanced_statusbar_location' => 'bottom',
'theme_advanced_resizing' => true,
'theme_advanced_resize_horizontal' => false,
'dialog_type' => 'modal',
'relative_urls' => false,
'remove_script_host' => false,
'convert_urls' => false,
'apply_source_formatting' => false,
'remove_linebreaks' => true,
'gecko_spellcheck' => true,
'entities' => '38,amp,60,lt,62,gt',
'accessibility_focus' => true,
'tabfocus_elements' => 'major-publishing-actions',
'media_strict' => false,
'paste_remove_styles' => true,
'paste_remove_spans' => true,
'paste_strip_class_attributes' => 'all',
'wpeditimage_disable_captions' => $no_captions,
'plugins' => "$plugins",
'extended_valid_elements' => "pre[name|class]"
);
保存后 再试试吧。
Google Syntax Highlighter 就与WordPress完美兼容了。
Google Syntax Highlighter 就与tinyMCE完美兼容了。