This is a utility plugin that will allow other plugins and themes to swap out shortcodes with custom images, in the same way that WordPress’ native gallery shortcode does this. Replacement images can be clicked to reveal a ‘delete’ button.
This works extremely well when your shortcode already has a tinymce button, but does work for manual shortcodes too.
This plugin does not support multi-line shortcodes or non-self-closing shortcodes (e.g. it supports <code>[foo bar="baz"]</code> but not <code>[foo]bar baz[/foo]</code>). Honestly, I don’t even know what would happen if you tried to use one. It may work, but it’s entirely unsupported.
To add your shortcode, hook onto the filter <code>'jpb_visual_shortcodes'</code>. That filter will pass one array as an argument. Each element of that array is an associative array which must contain values for the following keys:
<ul>
<li><code>shortcode</code> The name of the shortcode to replace</li>
<li><code>image</code> The url of the image to replace the shortcode with.</li>
</ul>
Additionally, the array may contain the optional parameter <code>command</code>, which must be a valid tinymce command. If present, this value will trigger a second UI button (‘Edit’) when the user clicks the replacement image which, when clicked, will execute the tinymce command passed as the value.

Visual Shortcodes

This is a utility plugin that will allow other plugins and themes to swap out shortcodes with custom images, in the same way that WordPress' nati …

Ignacio Cruz Moreno

This plugin simply activates, and makes accessible the ENTIRE Google Webfonts repository. Your visual editor will show a new, third row with an easy drop-down list for choosing fonts.
I also added a box for font size selection… they seem to go hand in hand.
If you like this plugin, Please Leave A Rating. Also, click “works” if you are indeed satisfied with the plugin. Thank you.
<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=A9E5VNRBMVBCS" rel="nofollow ugc">Even the smallest donations will be gratefully accepted if you wish to click here</a>. Donations help to continue and support future upgrades and releases. Please consider donating if you are extremely pleased with this plugin and will continue using it on your site; especially if you are operating a commercial website. Thank you!
<h3>Features</h3>
<ul>
<li>Added all 291 currently available Google Webfonts.</li>
</ul>

Supreme Google Webfonts

Description: Adds all Google Webfonts into your visual editor panel when creating posts or pages.  Now you have access to almost 700 universal, cross- …

Visual Shortcodes vs Supreme Google Webfonts