欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

wordpress文本编辑器自定义标签的方法

程序员文章站 2022-04-17 13:21:50
...

效果图

wordpress文本编辑器自定义标签的方法

上图添加了h2、h4、pre标签

 

正文

每次手动在文本编辑器里打出<pre></pre>的时候都觉得很难受,为什么不能像code那样在上方就有个可供选择的标签呢?于是有了这篇文章。非原创,一切教程来自互联网。

首先找到网站的functions.php 文件。两个方法,一个是在网站后台,也就是仪盘表里,外观—编辑,找到functions.php 文件。还有一个方法是打开网站的文件管理器,我用的是cPanel,登录进去直在主题里修改functions.php。个人觉得第一种方法简单快捷。

在文件中添加这样一段代码:

add_action('after_wp_tiny_mce', 'add_button_mce');
function add_button_mce($mce_settings) {
?>
<script type="text/javascript">
    QTags.addButton( 'h2', 'h2', "<h2>", "</h2>" );
    QTags.addButton( 'h4', 'h4', "<h4>", "</h4>" );
    QTags.addButton( 'pre', 'pre', "<pre>", "</pre>" );
</script>
<?php
}

记得确保代码在<?php?>中间。

就可以达到效果图中的效果。

当然,也可以按自己需要来改。addbutton四个参数分别是按钮的ID按钮显示名点一下输入内容再点一下关闭内容(可以为空,即"")。按照上面的例子改动即可。

 

参考资料

wordpress编辑器增加pre自定义标签