I've been following this tutorial, and many like it: http://codex.wordpress.org/TinyMCE_Custom_Buttons
function myplugin_addbuttons() {
// Don't bother doing this stuff if the current user lacks permissions
if ( ! current_user_can('edit_posts') && ! current_user_can('edit_pages') )
return;
// Add only in Rich Editor mode
if ( get_user_option('rich_editing') == 'true') {
add_filter('mce_buttons', 'register_myplugin_button');
}
}
//Should add 'code' to the tinyMce buttons on the rich editor.
function register_myplugin_button($buttons) {
array_push($buttons, "code");
return $buttons;
}
// init process for button control
add_action('init', 'myplugin_addbuttons');
All I want to do is add the "code" button to the rich text editor. It's already in the HTML editor side. From the way the tutorial mentions it, it seems as though I could just write in array_push "code" into buttons. But it doesn't work. What am I doing wrong?
If you have access to add settings to the TinyMCE config (which I'm not sure you do based on your previous comments) then you could add the following.
style_formats : [{title : 'Code', inline : 'code'}]
What this will do is add a "code" item in the Style drop down that will wrap the selected text in the code tags.
If you can't get to the config to add this, then you may need to develop a TinyMCE plugin that registers that format programmatically. BTW, the link to how to develop a TinyMCE plugin on the WordPress article you reference is no longer right. Check out the How-to article instead.
Finally, if all else fails, you could develop a plugin that wraps the selected text (ed.selection.getContent()) in the code and returns it using ed.selection.setContent()
I've written a plugin that does exactly that, i.e. it provides a button named 'codeElement' which users can use to wrap text in a code element or tag.
TinyMCE Plugin page on Sourceforge
direct download
Just stumbled over the http://wordpress.org/plugins/tinymce-code-element/ WordPress plugin, which does the job.
Related
I would like to force TinyMCE for wordpress to stop adding inline CSS for everything I do during edition.
I found this page that says that I should add this snippet
tinyMCE.init({
...
inline_styles : false
});
add to where? The page, and by the way, the entire TinyMCE documentation fails to tell where we should add the valuable snippets they mention.
Any ideas?
I'm not entirely sure that you can disable the inline-styles via TinyMCE, however the filter used to change default TinyMCE settings is: tiny_mce_before_init, so assuming that inline_styles is still a valid option that can be overwritten, you could theoretically do it like this.
function my_format_TinyMCE( $init ) {
$init['inline_styles'] = false;
return $init;
}
add_filter( 'tiny_mce_before_init', 'my_format_TinyMCE' );
There is a note about it in the source code and a bit of documentation here
I'm trying to edit the WordPress TinyMCE editor so all the links has the target = "_blank". I've tried with jquery to set the 'Open link in new tab' checkbox to be always checked but, no results.
Thank you
You can accomplish this with the default_link_target setting in your TinyMCE configuration: https://www.tinymce.com/docs/plugins/link/#default_link_target
Here is a TinyMCE Fiddle of this in action: http://fiddle.tinymce.com/31faab
To do this in Wordpress you will need to create a simple plugin that modifies this setting as TinyMCE is loaded. It would look something like this:
<?php
add_filter('tiny_mce_before_init', 'add_my_options', 1000);
function add_my_options($opt) {
$opt['default_link_target'] = "_blank";
return $opt; //you must return $opt to not break things
}
?>
If you have never created a WP plugin they are not hard to build and there are plenty of examples on the web.
Tinymce offers an inline code formatting option that wraps the <code> tag around content. But WordPress does not include this. I think that there must be an easy way to enable it. I have seen discussing on how to do this in earlier versions of WP (with Tinymce 3) in threads like Add "code" button to wordpress tinyMCE ,
but I can't see how to "translate" this into Tinymce 4.
I tried the following. It gives me the Source Code but not the code tag.
// Add <code> support to the Visual Editor
// Load the code TinyMCE plugin
function my_TinyMCEplugins($plugin_array) {
$plugin_array['code'] = get_bloginfo('template_directory') . '/inc/code/plugin.min.js';
return $plugin_array;
}
add_filter('mce_external_plugins', 'my_TinyMCEplugins');
// Add the code button into the toolbar
function my_TinyMCE($in) {
$in['toolbar2'].=',code';
return $in;
}
add_filter('tiny_mce_before_init', 'my_TinyMCE' );
Thanks for any help!
Actually the TinyMCE code plugin is NOT used to insert <code> tags. It is used to edit the source html code, which is redundant in wordpress since you can just click the 'text' tab.
This wordpress plugin will add that functionality for you: https://wordpress.org/plugins/tinymce-code-button/screenshots/.
I have a wp-network installed with users that can create pages in each site.
Each of those pages get a place in the primary menu, and only one user have permission to create all this menu.
I want to create a user only to be able to edit the content of the pages, but not the title.
How can I disable the title of the page to be edited from the admin menu for a specific user, or (far better) for a capability?
I thought only a possibility, that's editing admin css to hide the title textbox, but I have two problems:
I don't like to css-hide things.
I don't know where is the admin css.
I know php, but don't know how to add a css hide to an element for a capability.
You should definitely use CSS to hide the div#titlediv. You'll want the title to show in the markup so the form submission, validation, etc continues to operate smoothly.
Some elements you'll need to know to implement this solution:
current_user_can() is a boolean function that tests if the current logged in user has a capability or role.
You can add style in line via the admin_head action, or using wp_enqueue_style if you'd like to store it in a separate CSS file.
Here is a code snippet that will do the job, place it where you find fit, functions.php in your theme works. I'd put it inside a network activated plugin if you're using different themes in your network:
<?php
add_action('admin_head', 'maybe_modify_admin_css');
function maybe_modify_admin_css() {
if (current_user_can('specific_capability')) {
?>
<style>
div#titlediv {
display: none;
}
</style>
<?php
}
}
?>
I resolved the problem, just if someone comes here using a search engine, I post the solution.
Doing some research, I found the part of the code where the title textbox gets inserted, and I found a function to know if a user has a certain capability.
The file where the title textbox gets added is /wp-admin/edit-form-advanced.php. This is the line before the textbox
if ( post_type_supports($post_type, 'title') )
I changed it to this
if ( post_type_supports($post_type, 'title') and current_user_can('edit_title') )
That way, the textbox is only added when the user has the capability called "edit_title"
When this IF block ends few lines after, I added:
else echo "<h2>".esc_attr( htmlspecialchars( $post->post_title ) )."</h2>";
To see the page title but not to edit it, when the user hasn't got "edit_title" capability.
Then I had already installed a plugin to edit user capabilities and roles, wich help me to create a new capability (edit_title) and assign it to the role I want.
I need to add a mailto button to TinyMCE in WordPress. Has anybody already done this? Or any tops on how to go about it?
Given you are wanting to put this into WordPress I assume you want to simply insert a href="mailto:" type tag into your document for the currently selected text.
The simplest way is to create a basic plugin. You can do this in the same page that tinyMCE is initialised into. The example below will wrap the currently selected text with a static mailto.
tinymce.create('tinymce.plugins.MailToPlugin', {
init : function(ed, url) {
ed.addCommand('mceMailTo', function() {
var linkText = ed.selection.getContent({format : 'text'});
var newText = "<a href='mailto:foo#bar.com?subject=testing'>" + linkText + "</a>"
ed.execCommand('mceInsertContent', false, newText);
});
// Register example button
ed.addButton('mailto', {
title : 'MailTo',
cmd : 'mceMailTo',
image : url + '/images/mailto.gif'
});
}
});
// Register plugin with a short name
tinymce.PluginManager.add('mailto', tinymce.plugins.MailToPlugin);
You will of course need to create an image (mailto.gif) for the toolbar button.
You then simply add the following to your plugin list
plugins: '-mailto'
and put mailto on the toolbar.
Of course, if you want to allow the end user to specify the email address and subject, then you will need a dialog. There is a good example of how to create a plugin on the TinyMCE site in Creating a Plugin
Unfortunately I can't comment on how you would do either of these in WordPress but I suspect you will need to customise your version of WordPress tinyMCE plugin.
You can use the class I built in WordPress my tutorial and then make the calls to your javascript files through instantiating the class. At least, regarding the reference to adding it to your plugins.
Cheers
First of all, make sure you have tinyMce Advanced plugin installed. Then, you can just use the insert / edit link button from the tinyMce editor. You don't need a different button. In the destination URL add this
mailto:my-mail#my-domain.com