Tag: TinyMCE (Page 1 of 2)

TinyMCE and WordPress: Adding User Input

August 6, 2015 / Tom / 0 Comments

In the previous post in this series, I showed how to add content to the post editor using a custom TinyMCE button. The problem with the approach, as we’ve covered thus far, is that the content that we’re adding to the editor is hard-coded.

We’re rarely going to want to be doing this, right? I mean, wouldn’t we rather grab input from the user and then add that to the editor?

My very own copy TinyMCE Editor. Show spectacular.

My very own copy TinyMCE Editor. So spectacular.

For some, this may be creating a shortcode based on some input, for others it may be grabbing input, making an Ajax call, and then putting the result of the request into the editor, or it may be something as simple as taking whatever input the user has provided in a prompt and then adding it to the editor.

Though the latter case is not likely something that is a realistic use case (after all, if they just wanted to put something into the editor, why not just, you know, enter it into the editor?), it’s something that will make rounding out this series a bit more complete because it will show how to connect displaying a prompt to the user, grabbing the input, then using the TinyMCE API to drop the input into the editor.

So that’s what we’ll do.

TinyMCE and WordPress: Using a Button To Add Content

July 28, 2015 / Tom / 0 Comments

If you’ve been following along with this series so far, then you know I’ve been working through a series of posts that aims to show how to integrate your own button into the WordPress post editor.

My very own copy TinyMCE Editor. So spectacular.

When doing this, we’re specifically working with both TinyMCE and WordPress. That is, we’re writing a TinyMCE plugin that is then wrapped in a WordPress plugin that will then allow the user to click on the button and add their own content (whatever that content may be).

In the next couple of articles, we’re going to take a look at how to do exactly that. First, we’ll start with simply connecting the result of clicking on the TinyMCE button with WordPress and then we’ll look at how to do some more advanced work.

Adding a TinyMCE Button to WordPress: The Button

July 22, 2015 / Tom / 0 Comments

Throughout this series, I’ve been talking through the process of how go about adding a TinyMCE button to WordPress – specifically, adding a custom button to the post editor.

Up to this point, I’ve covered a number of different things. Namely:

Stubbing out the plugin and adding the JavaScript
Including any dependent files that you may need in order to power your plugin
And how to bootstrap the plugin so that it is able to be activated from within WordPress

The thing is, we haven’t actually made anything happen in the editor let alone even introduce a button into the actual editor yet.

In this post, we’ll do exactly that.

Adding TinyMCE Dependencies in WordPress

July 17, 2015 / Tom / 0 Comments

If you’ve been following along with previous articles you know that over the last few days I’ve been working through a series on adding a TinyMCE button to WordPress.

Though this post isn’t exactly part of that series, it’s tangentially related and I thought it was something worth covering in case someone else stumbles across their problem in their work or if the code that shows up later in said series shows what’s up but doesn’t do a great job explaining it.

In short, when you have a JavaScript file that is a dependency on the core plugin, there’s another way of adding the dependency that does not include wp_enqueue_script.

Adding a TinyMCE Button to WordPress: The Plugin

July 16, 2015 / Tom / 0 Comments

If you’re interested in adding a TinyMCE button to WordPress, then this series of articles aims to do just that. In the first post of the series, I walked through some of the basic things that need to be done in order to get started with adding a custom button.

My very own copy TinyMCE Editor. So spectacular.

I laid out the file organization, the basic plugin structure, some of the foundational JavaScript, and started working on the hooks that are necessary for adding a custom button.

As it stands right now, the functions responsible for adding a new button aren’t actually defined within the context of a class much less hooked into the plugin itself. So in this post, we’ll take a look at exactly how to do exactly that.