De-couple Shortcake from the Media Library

[danielbachhuber]

Let's make it possible to use Shortcake independently of the Media Library. There should be an "Add Post Element" button which appears alongside "Add Media". In the Media Library, we should still have an "Insert Post Element" link in the side nav.

Discussion in https://wordpress.slack.com/archives/feature-shortcode/p1429556818000361

Previously #153

[zu]

I'd support the idea of having the chance to use shortcake without the "Add Media.." button but rather for each element having a button or a dropdown in the editor toolbar. As for example a quote (as is in the example) is not a "media" and it's really not intuitive at all to find this kind of shortcode in the media gallery.

[bobbingwide]

Why does it have to be a button next to Add Media?
My dialog for inserting shortcodes is accessed via a toolbar button for TinyMCE and a quicktag for the HTML editor.
http://www.oik-plugins.com/wordpress-plugins-from-oik-plugins/oik-base-plugin/oik-options/oik-options-buttons/oik-shortcodes-button/
I haven't changed it much since April 2012... waiting for someone to develop a better UX :-)

With over 100 shortcodes active I wouldn't want a button for each shortcode, though it does make sense to have a different dialog depending on the shortcode and its possible parameters.

[0aveRyan]

@danielbachhuber aesop-core takes this approach, but there is a small UX curveball. Think either approach is fine from UX viewpoint.

One sore point I found with Aesop is if users are accustomed to inserting photos / videos via Add Media button, they interchange and confuse Add Media --> Image with Add Component --> Image. Might be nice to have an optional hook to disable Add Media entirely when Shortcake is active?

I've used a snippet like this with aesop on such occasions.

function RemoveAddMediaButton(){
    if ( class_exists('Aesop_Core') ) {
        remove_action( 'media_buttons', 'media_buttons' );
    }
}
add_action('admin_head', 'RemoveAddMediaButton');

[mrjarbenne]

I'd like to make a case for the Add Media button being the only means of accessing Shortcake (I recognize you aren't removing it from there, merely making an alternative means of accessing it). Forcing user to access Shortcake under Add Media, particularly if Shortcake moves into core, could be the catalyst for better standardization of the process of adding/embedding elements in a post. Take the Desire2Learn "Insert Stuff" modal as an example in the wild, which, like the WP Add Media button, starts out as a mechanism to insert media from a computer, but is then the only mechanism available to developers to add additional items (note additional Youtube, Flickr etc. buttons)

In comparison, without a recognized standard, plugin authors place their buttons either beside the Add Media button, or within the TinyMCE menu, which -- particularly on smaller screens -- creates a pretty crowded interface.

Centralizing Shortcodes within the Add Media space would be a good exemplar for others.

Additionally, a tool like the new Press This doesn't surface those buttons traditionally found above the post field, doesn't utilize the TinyMCE tool bar, but does summon the Add Media window when you select the bottom left add media button, and therefore works perfectly with Shortcake where it currently resides.

I recognize you aren't suggesting that Shortcake is removed from the Add Media space, but I think decoupling it from that space might mean missing a chance to provide some needed standardization. This is the kind of important plugin that could spark that conversation.

Just 2 cents.

[danielbachhuber]

Bumping to v0.5.0, as it's too late for v0.4.0

[goldenapples]

Thanks to everyone who weighed in on the discussion here. We should revisit this discussion in the context of the way that UI concepts in core have evolved.

Shortcake is still in the Media Library, but we added a new way of opening the UI in #551 with the "Add Post Element" buttons. I'm closing this issue for now.