Wordpress 4.1 TinyMce 按钮插件
Wordpress 4.1 TinyMce button plugin
我正在尝试在 wordpress 的 tinymce 编辑器上添加一个按钮
Wordpress 版本:4.1
我遵循了这个教程:
http://code.tutsplus.com/tutorials/guide-to-creating-your-own-wordpress-editor-buttons--wp-30182
但它不起作用。我在 google 上进行了多次搜索,至少我试图找到一些东西,但没有结果。
谁知道那个教程有什么问题!?
我想做的只是在 tinymce 上添加一个按钮,获取 YouTube url 并在 link 的位置添加自定义 html光标。
提前致谢,我对 php、wordpress、tinymce 真的很陌生。
编辑:
尝试@Kaloyan Ivanov 推荐的教程
Link: https://www.gavick.com/blog/wordpress-tinymce-custom-buttons
我的步数:
1.I 在我的主题 functions.php 末尾添加了前 4 php 个代码
//add custom plugin to tinymce
add_action('admin_head', 'gavickpro_add_my_tc_button');
function gavickpro_add_my_tc_button() {
global $typenow;
// check user permissions
if ( !current_user_can('edit_posts') && !current_user_can('edit_pages') ) {
return;
}
// verify the post type
if( ! in_array( $typenow, array( 'post', 'page' ) ) )
return;
// check if WYSIWYG is enabled
if ( get_user_option('rich_editing') == 'true') {
add_filter("mce_external_plugins", "gavickpro_add_tinymce_plugin");
add_filter('mce_buttons', 'gavickpro_register_my_tc_button');
}
}
function gavickpro_add_tinymce_plugin($plugin_array) {
$plugin_array['gavickpro_tc_button'] = plugins_url( '/text-button.js', __FILE__ ); // CHANGE THE BUTTON SCRIPT HERE
return $plugin_array;
}
function gavickpro_register_my_tc_button($buttons) {
array_push($buttons, "gavickpro_tc_button");
return $buttons;
}
2.Then 我在 functions.php 所在的主题文件夹中创建了一个名为 text-button.js 的文件,并添加了代码
(function() {
tinymce.PluginManager.add('gavickpro_tc_button', function( editor, url ) {
editor.addButton( 'gavickpro_tc_button', {
text: 'My test button',
icon: false,
onclick: function() {
editor.insertContent('Hello World!');
}
});
});
})();
但这不起作用,它从编辑器中删除了所有 tinymce 按钮
终于按照 Kaloyan Ivanov 的建议进行了一点改动:
换行:
$plugin_array['gavickpro_tc_button'] = plugins_url( '/text-button.js', __FILE__ );
与:
$plugin_array['gavickpro_tc_button'] = get_bloginfo( 'stylesheet_directory' ) . '/text-button.js';
感谢 Kaloyan Ivanov 和 gavick。com/blog 这适用于 wordpress 4.1 的新 tinymce 编辑器
查看以下教程,似乎是针对最新版本的 TinyMCE(最近更新)。
https://www.gavick.com/blog/wordpress-tinymce-custom-buttons
您链接的教程可能适用于 WordPress 3.9 之前的 TinyMCE。
编辑:进行了快速测试。似乎在工作。 :)
让它工作的快速指南:
- 打开https://www.gavick.com/blog/wordpress-tinymce-custom-buttons#tmce-section-1
- 将 php 的四个代码粘贴到您的 functions.php 文件中
- 将
plugins_url( '/text-button.js', __FILE__ );
替换为 get_bloginfo('stylesheet_directory') . /text-button.js
(如果文件在子目录中,可能需要调整)。
- 将第五块的 javascript 代码粘贴到您创建的 javascript 文件中。
(请注意,这只是一个在 主题 中实现它的快速示例,因此您可以了解主要思想,如果您实际上正在构建插件,则应该使用 plugins_url( '/text-button.js', __FILE__ )
语法)。
我正在尝试在 wordpress 的 tinymce 编辑器上添加一个按钮
Wordpress 版本:4.1
我遵循了这个教程: http://code.tutsplus.com/tutorials/guide-to-creating-your-own-wordpress-editor-buttons--wp-30182
但它不起作用。我在 google 上进行了多次搜索,至少我试图找到一些东西,但没有结果。
谁知道那个教程有什么问题!?
我想做的只是在 tinymce 上添加一个按钮,获取 YouTube url 并在 link 的位置添加自定义 html光标。
提前致谢,我对 php、wordpress、tinymce 真的很陌生。
编辑:
尝试@Kaloyan Ivanov 推荐的教程 Link: https://www.gavick.com/blog/wordpress-tinymce-custom-buttons
我的步数:
1.I 在我的主题 functions.php 末尾添加了前 4 php 个代码
//add custom plugin to tinymce
add_action('admin_head', 'gavickpro_add_my_tc_button');
function gavickpro_add_my_tc_button() {
global $typenow;
// check user permissions
if ( !current_user_can('edit_posts') && !current_user_can('edit_pages') ) {
return;
}
// verify the post type
if( ! in_array( $typenow, array( 'post', 'page' ) ) )
return;
// check if WYSIWYG is enabled
if ( get_user_option('rich_editing') == 'true') {
add_filter("mce_external_plugins", "gavickpro_add_tinymce_plugin");
add_filter('mce_buttons', 'gavickpro_register_my_tc_button');
}
}
function gavickpro_add_tinymce_plugin($plugin_array) {
$plugin_array['gavickpro_tc_button'] = plugins_url( '/text-button.js', __FILE__ ); // CHANGE THE BUTTON SCRIPT HERE
return $plugin_array;
}
function gavickpro_register_my_tc_button($buttons) {
array_push($buttons, "gavickpro_tc_button");
return $buttons;
}
2.Then 我在 functions.php 所在的主题文件夹中创建了一个名为 text-button.js 的文件,并添加了代码
(function() {
tinymce.PluginManager.add('gavickpro_tc_button', function( editor, url ) {
editor.addButton( 'gavickpro_tc_button', {
text: 'My test button',
icon: false,
onclick: function() {
editor.insertContent('Hello World!');
}
});
});
})();
但这不起作用,它从编辑器中删除了所有 tinymce 按钮
终于按照 Kaloyan Ivanov 的建议进行了一点改动:
换行:
$plugin_array['gavickpro_tc_button'] = plugins_url( '/text-button.js', __FILE__ );
与:
$plugin_array['gavickpro_tc_button'] = get_bloginfo( 'stylesheet_directory' ) . '/text-button.js';
感谢 Kaloyan Ivanov 和 gavick。com/blog 这适用于 wordpress 4.1 的新 tinymce 编辑器
查看以下教程,似乎是针对最新版本的 TinyMCE(最近更新)。
https://www.gavick.com/blog/wordpress-tinymce-custom-buttons
您链接的教程可能适用于 WordPress 3.9 之前的 TinyMCE。
编辑:进行了快速测试。似乎在工作。 :)
让它工作的快速指南:
- 打开https://www.gavick.com/blog/wordpress-tinymce-custom-buttons#tmce-section-1
- 将 php 的四个代码粘贴到您的 functions.php 文件中
- 将
plugins_url( '/text-button.js', __FILE__ );
替换为get_bloginfo('stylesheet_directory') . /text-button.js
(如果文件在子目录中,可能需要调整)。 - 将第五块的 javascript 代码粘贴到您创建的 javascript 文件中。
(请注意,这只是一个在 主题 中实现它的快速示例,因此您可以了解主要思想,如果您实际上正在构建插件,则应该使用 plugins_url( '/text-button.js', __FILE__ )
语法)。