WordPress 文章编辑器添加下拉式短代码选择

对于资深站长使用肯定经常 WordPress 文章编辑功能,但是对于幸好经常折腾的博主,就非常清楚 WordPress 默认的编辑器非常差劲,可视化界面显得有点中规中矩使用极其不方便,文本模式又不够强大非常鸡肋,但是幸好 wordprees 为我们提供了强大扩展功能,都喜欢添加自定义丰富主题的功能。以前发布的这些文章添加的按钮大多是通过 QuicktagsAPI 添加的,关于 QuicktagsAPI 大家有兴趣的可以查看下这篇文章>>> 使用 QuicktagsAPI 为 WP 文本编辑器添加快捷按钮 。随着后台文章编辑器添加的功能增多,发现两个问题:① 过多的快捷按钮占用了文章编辑器空间;② 每次都要切换到文本编辑器调用快捷按钮比较麻烦。

如上图编辑器上部一堆按钮,难看不说寻找也比较麻烦,于是决定改变下快捷按钮的显示方式,在后台增加个下拉选择以集合各个快捷按钮,添加完成后文章编辑器显示效果如下:

那么我们就奉上改造代码,直接将代码丢到主题 functions.php 文件中即可:

// 后台编辑器添加下拉式按钮
function wzt_select(){
echo '
<select id="short_code_select">
<option value="请选择一个短代码!!!">插入短代码</option>
<option value="【ghide keyword=\'关键字\' key=\'验证码\']隐藏内容[/ghide]">公众号隐藏</option>
<option value="【pwd_protected_post key=\'保护密码\']您需要选择一个短代码[/pwd_protected_post]">文章密码保护</option>
<option value="【collapse title=\'说明文字\'][/collapse]">展开/收缩按钮</option>
</select>';
}
if (current_user_can('edit_posts') && current_user_can('edit_pages')) {
add_action('media_buttons', 'wzt_select', 11);
}
 
function wzt_button() {
echo '<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#short_code_select").change(function(){
send_to_editor(jQuery("#short_code_select :selected").val());
return false;
});
});
</script>';
}
add_action('admin_head', 'wzt_button');

最后说下按钮的添加,直接复制新增代码中如下语句:

<option value="请选择一个短代码!!!">插入短代码</option>

将 value 值改为你需要填入的短代码,“插入短代码”文字改为你按钮的显示名称即可。

注意引号的转义( ‘ → \’ )

http://xzh.i3geek.com
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,请不要用于商业用途及非法用途,否则后果自负!
3. 如果你也有好源码或者教程,可以到审核区发布,分享有金币奖励和额外收入!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 如遇到加密压缩包,默认解压密码为"qq301.com",如遇到无法解压的请联系管理员!
资源客是一个优秀的分享资源站,本站资源均为各位友友分享而来,特殊原创会标明如有侵犯版权等可联系删除

资源客 » WordPress 文章编辑器添加下拉式短代码选择