1. //php代码如下:
    //向文章编辑器的Visual区添加自定义按钮,js文件存放在wp-content/plugins/文件夹下
  2. add_action('admin_head', 'my_custom_mce_button');
  3. function my_custom_mce_button() {
  4. if ( !current_user_can( 'edit_posts' ) && !current_user_can( 'edit_pages' ) ) {
  5. return;
  6. }
  7. if ( 'true' == get_user_option( 'rich_editing' ) ) {
  8. add_filter( 'mce_external_plugins', 'my_custom_tinymce_plugin' );
  9. add_filter( 'mce_buttons', 'my_register_mce_button' );
  10. }
  11. }
  12. function my_custom_tinymce_plugin( $plugin_array ) {
  13. $plugin_array['my_mce_button'] = plugins_url().'/mce-button.js';
  14. return $plugin_array;
  15. }
  16. function my_register_mce_button( $buttons ) {
  17. array_push( $buttons, 'my_mce_button' );
  18. return $buttons;
  19. }

  以下为JS代码:

  1. (function() {
  2. tinymce.PluginManager.add('my_mce_button', function( editor, url ) {
  3. editor.addButton( 'my_mce_button', {
  4. icon: 'wp_code',
  5. type: 'menubutton',
  6. menu: [
  7. {
  8. text: '添加样式',
  9. onclick: function() {
  10. editor.windowManager.open( {
  11. title: '添加样式',
  12. minWidth : 700,
  13. body: [
  14. {
  15. type: 'listbox',
  16. name: 'titlewrap',
  17. label: '选择样式',
  18. values: [
  19. {text: 'Error', value: 'notification error'},
  20. {text: 'Success', value: 'notification success'},
  21. {text: 'Info', value: 'notification info'},
  22. {text: 'Question', value: 'notification question'},
  23. {text: 'Waring', value: 'notification waring'}
  24. ]
  25. },
  26. {
  27. type: 'textbox',
  28. name: 'titlecontent',
  29. label: '文本内容',
  30. value: '',
  31. multiline: true,
  32. minWidth: 300,
  33. minHeight: 100
  34. }
  35. ],
  36. onsubmit: function( e ) {
  37. var titlecontent = e.data.titlecontent.replace(/\r\n/gmi, '\n'),
  38. titlecontent = tinymce.html.Entities.encodeAllRaw(titlecontent);
  39. var sp = (e.data.addspaces ? ' ' : '');
  40. editor.insertContent(sp + '<div class="'+ e.data.titlewrap +'">' + e.data.titlecontent + '</div>' + sp + '<p></p>' );
  41. }
  42. });
  43. }
  44. },
  45. {
  46. text: '自定义链接',
  47. onclick: function() {
  48. editor.windowManager.open( {
  49. title: '自定义链接',
  50. minWidth : 700,
  51. body: [
  52. {
  53. type: 'textbox',
  54. name: 'links',
  55. label: '链接地址',
  56. value: 'https://www.drivereasy.com/DriverEasy_Setup.exe'
  57. },
  58. // {
  59. // type: 'textbox',
  60. // name: 'custom_js_code',
  61. // label: '自定义js代码',
  62. // value: 'onclick="ga(\'send\',\'event\',\'download\',\'click\',\'kbde-dedownload-\',1.00,{\'nonInteration\':1});)"',
  63. // multiline: true,
  64. // minWidth: 300,
  65. // minHeight: 100
  66. // },
  67. {
  68. type: 'textbox',
  69. name: 'custom_links_description',
  70. label: '链接名称',
  71. value: '',
  72. }
  73. ],
  74. onsubmit: function( e ) {
  75. var code = e.data.custom_links_description.replace(/\r\n/gmi, '\n'),
  76. code = tinymce.html.Entities.encodeAllRaw(code);
  77. var sp = (e.data.addspaces ? ' ' : '');
  78. 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>');
  79. }
  80. });
  81. }
  82. },
  83. {
  84. text: '超链接',
  85. onclick: function() {
  86. editor.windowManager.open( {
  87. title: '超链接',
  88. minWidth : 700,
  89. body: [
  90. {
  91. type: 'textbox',
  92. name: 'links',
  93. label: '链接地址',
  94. value: 'https://www.drivereasy.com/DriverEasy_Setup.exe'
  95. },
  96. {
  97. type: 'textbox',
  98. name: 'custom_js_code',
  99. label: '自定义js代码',
  100. value: 'onclick="ga(\'send\',\'event\',\'download\',\'click\',\'kbde-dedownload- \',1.00,{\'nonInteration\':1});)"',
  101. multiline: true,
  102. minWidth: 300,
  103. minHeight: 100
  104. },
  105. {
  106. type: 'textbox',
  107. name: 'code',
  108. label: '链接文本',
  109. value: '',
  110. multiline: true,
  111. minWidth: 300,
  112. minHeight: 100
  113. }
  114. ],
  115. onsubmit: function( e ) {
  116. var code = e.data.code.replace(/\r\n/gmi, '\n'),
  117. code = tinymce.html.Entities.encodeAllRaw(code);
  118. var sp = (e.data.addspaces ? ' ' : '');
  119. editor.insertContent(sp + '<a rel="nofollow" '+e.data.custom_js_code+' href="' + e.data.links +'">' + code + '</a>' + sp + '<p></p>');
  120. }
  121. });
  122. }
  123. }
  124. ]
  125. });
  126. });
  127. })();

  注意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. 极简的css浮动窗口

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta http ...

  2. bootstrap 滚动监听 标签页 和 工具提示

    标签   <div class="container">     <h4>Tabs</h4>     <ul id="myTab ...

  3. SQL Server 2008添加字段成功,但提示列名无效

    在sql后查询,给现有表添加一个字段,即执行sql语句: alter table [sxrq_1108].[dbo].[公司周报表详情] add 总计 int default 0 然后在上述sql查语 ...

  4. 中移动TD-LTE 4G设备招标

    移动这是要干吗呢?2%的份额,公司如果没有其他业务,可以消失了 ------------------------------------------------------ 中国移动已经初步确定了各供 ...

  5. uvm_pkg——老板,打包带走

    Thus spake the master programmer: “After three day without programming, life becomes meaningless.” 编 ...

  6. IOS开发之----详解在IOS后台执行

    文一 我从苹果文档中得知,一般的应用在进入后台的时候可以获取一定时间来运行相关任务,也就是说可以在后台运行一小段时间. 还有三种类型的可以运行在后以,1.音乐2.location 3.voip 文二 ...

  7. SQLServer怎样把本地数据导入到远程服务器上(转载)

    平常用到mssql时间比较少,总是过一段时间就忘记应该怎么操作了.当要做mssq把本地数据导入到远程服务器的时候,就去网上搜索很久都没有图解的,所以今天自己收集一下免得下次又到处去找.希望对自己,同时 ...

  8. Slacklining 2017/2/6

    原文 Get ready for a different kind of challenge What happens when mountain climbers take a day off?Ap ...

  9. Servlet The Filter

    The Filter Filter不会产生Request或者是Response, 但是会在两者访问资源时, 对其作出改变.其可以作用于静态资源和动态资源. LifeCycle Filter会和Serv ...

  10. js 下载文件/导出

    const url = '/sasd/fsd/xxxx/exportMailData2Excel'this.downloadFile(url, 'blob', this.isSearch) // 调用 ...