//php代码如下:
//向文章编辑器的Visual区添加自定义按钮,js文件存放在wp-content/plugins/文件夹下
add_action('admin_head', 'my_custom_mce_button');
function my_custom_mce_button() {
if ( !current_user_can( 'edit_posts' ) && !current_user_can( 'edit_pages' ) ) {
return;
}
if ( 'true' == get_user_option( 'rich_editing' ) ) {
add_filter( 'mce_external_plugins', 'my_custom_tinymce_plugin' );
add_filter( 'mce_buttons', 'my_register_mce_button' );
}
}
function my_custom_tinymce_plugin( $plugin_array ) {
$plugin_array['my_mce_button'] = plugins_url().'/mce-button.js';
return $plugin_array;
}
function my_register_mce_button( $buttons ) {
array_push( $buttons, 'my_mce_button' );
return $buttons;
}

  以下为JS代码:

(function() {
tinymce.PluginManager.add('my_mce_button', function( editor, url ) {
editor.addButton( 'my_mce_button', {
icon: 'wp_code',
type: 'menubutton',
menu: [
{
text: '添加样式',
onclick: function() {
editor.windowManager.open( {
title: '添加样式',
minWidth : 700,
body: [
{
type: 'listbox',
name: 'titlewrap',
label: '选择样式',
values: [
{text: 'Error', value: 'notification error'},
{text: 'Success', value: 'notification success'},
{text: 'Info', value: 'notification info'},
{text: 'Question', value: 'notification question'},
{text: 'Waring', value: 'notification waring'}
]
},
{
type: 'textbox',
name: 'titlecontent',
label: '文本内容',
value: '',
multiline: true,
minWidth: 300,
minHeight: 100
}
],
onsubmit: function( e ) {
var titlecontent = e.data.titlecontent.replace(/\r\n/gmi, '\n'),
titlecontent = tinymce.html.Entities.encodeAllRaw(titlecontent);
var sp = (e.data.addspaces ? ' ' : '');
editor.insertContent(sp + '<div class="'+ e.data.titlewrap +'">' + e.data.titlecontent + '</div>' + sp + '<p></p>' );
}
});
}
},
{
text: '自定义链接',
onclick: function() {
editor.windowManager.open( {
title: '自定义链接',
minWidth : 700,
body: [
{
type: 'textbox',
name: 'links',
label: '链接地址',
value: 'https://www.drivereasy.com/DriverEasy_Setup.exe'
},
// {
// type: 'textbox',
// name: 'custom_js_code',
// label: '自定义js代码',
// value: 'onclick="ga(\'send\',\'event\',\'download\',\'click\',\'kbde-dedownload-\',1.00,{\'nonInteration\':1});)"',
// multiline: true,
// minWidth: 300,
// minHeight: 100
// },
{
type: 'textbox',
name: 'custom_links_description',
label: '链接名称',
value: '',
}
],
onsubmit: function( e ) {
var code = e.data.custom_links_description.replace(/\r\n/gmi, '\n'),
code = tinymce.html.Entities.encodeAllRaw(code);
var sp = (e.data.addspaces ? ' ' : '');
editor.insertContent(sp + '<a rel="nofollow" href="' + links + '" onclick="ga(\'send\',\'event\',\'download\',\'click\',\'kbde-dedownload- \',1.00,{\'nonInteration\':1});)" >' + custom_links_description + '</a>' + sp + '<p></p>');
}
});
}
},
{
text: '超链接',
onclick: function() {
editor.windowManager.open( {
title: '超链接',
minWidth : 700,
body: [
{
type: 'textbox',
name: 'links',
label: '链接地址',
value: 'https://www.drivereasy.com/DriverEasy_Setup.exe'
},
{
type: 'textbox',
name: 'custom_js_code',
label: '自定义js代码',
value: 'onclick="ga(\'send\',\'event\',\'download\',\'click\',\'kbde-dedownload- \',1.00,{\'nonInteration\':1});)"',
multiline: true,
minWidth: 300,
minHeight: 100
},
{
type: 'textbox',
name: 'code',
label: '链接文本',
value: '',
multiline: true,
minWidth: 300,
minHeight: 100
}
],
onsubmit: function( e ) {
var code = e.data.code.replace(/\r\n/gmi, '\n'),
code = tinymce.html.Entities.encodeAllRaw(code);
var sp = (e.data.addspaces ? ' ' : '');
editor.insertContent(sp + '<a rel="nofollow" '+e.data.custom_js_code+' href="' + e.data.links +'">' + code + '</a>' + sp + '<p></p>');
}
});
}
}
]
});
});
})();

  注意js代码中调用数据时记得加上e.data.name,

效果如下:

WordPress的编译器功能扩展的更多相关文章

  1. VS功能扩展--扩展介绍

    使用Eclipse的朋友都知道Eclipse是一个完全可扩展的IDE,那么在windows程序开发时,我们常使用的IDE(Visual studio)是否具有功能的扩展性呢?毫无疑问,回答是肯定的.我 ...

  2. WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式、水印、Label标签、功能扩展

    一.前言.预览 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要是对文本 ...

  3. (视频) 《快速创建网站》 2.3 WordPress初始化和功能简介

    本文是<快速创建网站>系列的第4篇,如果你还没有看过之前的内容,建议你点击以下目录中的章节先阅读其他内容再回到本文. 访问本系列目录,请点击:http://devopshub.cn/tag ...

  4. C++类功能扩展预留五招

    第一招虚函数 通过派生类来进行功能扩展是基本的面向对象的方式,这种方式大如下: class base { public: virtual ~base(){} virtual void fun() { ...

  5. spring源码深度解析-2功能扩展

    容器功能的扩展ApplicationContext用于扩展BeanFactory中现有的功能.究竟多出了哪些功能,进一步探索.写法上:BeanFactory bf = new XmlBeanFacto ...

  6. C51编译器的扩展关键字

    附表1-1 ANSIC标准关键字 附表1-2 C51编译器的扩展关键字

  7. vs.net 2013 Saffolding功能扩展

    vs.net 2013 Saffolding功能扩展 Asp.net mvc 5 CRUD代码自动生成工具 -Visual Studio.net2013 Saffolding功能扩展 上次做过一个&l ...

  8. Asp.net mvc 5 CRUD代码自动生成工具- vs.net 2013 Saffolding功能扩展

    Asp.net mvc 5 CRUD代码自动生成工具 -Visual Studio.net2013 Saffolding功能扩展 上次做过一个<Asp.net webform scaffoldi ...

  9. 【转】WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式、水印、Label标签、功能扩展

    一.前言.预览 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等. 本文主要是对文本输入控件进行样式开发,及相关扩展功能开发,主要内容包括: 基本文 ...

随机推荐

  1. 实现如下语法的功能:var a = add(2)(3)(4)

    function add(num){ var _add = function(args){ num+=args; return arguments.callee; } _add.toString = ...

  2. 惊人的CSS和JavaScript动画logos例子

    https://codepen.io/lindell/pen/mEVgJP Stack Overflow logo是我最喜欢的logo之一,因为它非常简单,但易于识别.并且这个片段动画点击预览Stac ...

  3. 从零开始利用vue-cli搭建简单音乐网站(五)

    上一篇文章讲到的是如何利用mongoose从数据库读取数据然后更新页面,接下来要实现的就是用户注册登录功能,这个功能涉及到的东西太多了,今天只实现了登录功能,登陆之后更新导航条界面,最后效果如下: 登 ...

  4. Slacklining 2017/2/7

    原文 Proline Slacklining's expansion is still in process,but it already has a professional scene.Some ...

  5. FZU 1977 Pandora adventure (插头DP,常规)

    题意:有一个n*m矩阵,其中有些格子必走,有些格子不可走,其他格子是可走也可不走,问有多少条哈密顿回路? 思路: 本来是一道很简单的题,代码写多了连白痴bug都查不出了,竟然用i>=ex& ...

  6. android-menudrawer-master 使用

    1. 参照例子写, 运行总崩溃, 多半是导库问题... 2. 既然这样不行, 只好将源码全部拷贝到工程中了. 然后修错误, (将需要的res 文件复制过来.主要是value中的几个文件) 3. 在Ma ...

  7. git - GNU 交互工具

    语法 git [options] [path1] [path2] gitps [options] gitview [options] filename 注意 GIT 包 的 主要 配置文件 是 .gi ...

  8. 团队作业-Beta冲刺第三天

    这个作业属于哪个课程 <https://edu.cnblogs.com/campus/xnsy/SoftwareEngineeringClass1> 这个作业要求在哪里 <https ...

  9. ThinPHP5.0 目录结构

    官网文档  https://www.kancloud.cn/manual/thinkphp5/118008 project 应用部署目录├─application 应用目录(可设置)│ ├─commo ...

  10. 【图文并茂】DEV配置NTL库

    一开始根据陈老师的博客:再说如何在DEV C++中搭建NTL库 后来发现自己虽然跟着一步一步来做,还是做错了很多回. 究竟怎么一回事呢?后来我发现一个致命的错误很容易忽视,所以我就重新写一篇博客. 来 ...