squarecandy

<h4>Overview</h4>
<p>WordPress is awesome, but some of the TinyMCE rich text editing options that come out of the box are not ideal for less web-savvy editors and clients.  This plugin provides some modifications to the standard editor buttons and features that will make it easier for clients to have as all the formatting options that are good for them and remove options that can break a custom site design.</p>
<h4>Features</h4>
<ul>
<li>Removes the toggle advanced button.  This is confusing to many users who can’t find the features they are looking for. Just provides 1 row of editor buttons.</li>
<li>Removes features such as strike through, underline (should be reserved for links online, not emphasis), full justification (generally looks bad online, but clients like to use it), and several other less used and confusing features.</li>
<li>Simplifies the dropdown list of heading and block types available.</li>
<li>Adds several formats that can be added to a paragraph
<ul>
<li>Button – add this format to a paragraph to make the links into “call to action” buttons</li>
<li>Small – a format for create a paragraph of smaller text, such as a “terms & conditions” section.</li>
<li>Big – enlarge the text of a certain paragraph.  This helps client not mis-use heading elements for entire paragraphs when they want slightly larger text for emphasis.</li>
</ul>
</li>
<li>Limits color palette in the text colorpicker to grayscale only by default.</li>
<li>Allows for adding up to 4 custom colors that compliment the site’s design and branding that the user may use. (Under Settings > Writing)</li>
<li>Adds the current theme’s style.css to the editor to make what you see in TinyMCE match the live site better</li>
<li>Allows for adding additional css files to the editor styles.  These could be external resources such as google font stylesheets, additional theme css you want to load in the editor, or a custom stylesheet. Just add the URL you want to add in the Additional CSS field under Settings > Writing. For multiple files separate the files by comma with no spaces.</li>
</ul>
<h4>Scope</h4>
<p>As the description states, this plugin makes <strong>opinionated</strong> changes to the default setup. I don’t plan to grow this into a bulkier plugin that allows you to modify and customize all aspects of TinyMCE.  Try <a href="https://wordpress.org/plugins/tinymce-advanced/" rel="ugc">TinyMCE Advanced</a> or other existing plugins for that purpose.</p>


Square Candy TinyMCE Reboot

An opinionated reconfiguration of the default WordPress TinyMCE settings.

Alex Prokopenko / JustCoded

<p>This plugin controls the TinyMce “style_formats” parameter. It allows adding custom formatters to the Wysiwyg editor.</p>
<p>This is only a user interface to the standard feature, which is disabled by default and explained in the official<br />
documentation on codex.wordpress.org: https://codex.wordpress.org/TinyMCE_Custom_Styles</p>
<h4>Features</h4>
<ul>
<li>Load Settings from DB or .json file from theme</li>
<li>Enable/Disable some style_format features for more clean formatting</li>
<li>Nice interface to quickly add your formats</li>
<li>Ability to apply custom editor css for each rule separately</li>
<li>You can group your styles for more clear usage</li>
<li>Bootstrap preset: pre-defined bootstrap styles for editor.</li>
</ul>
<h4>Example: Custom link class</h4>
<p>For example, you can define an addition dropdown option of the css classes for the link tag.<br />
To do so, create such row formatter:.</p>
<ul>
<li>Title: My Link Style</li>
<li>Selector: a</li>
<li>Classes: my-link-style</li>
<li>Editor CSS: a.my-link-style { color:red; }</li>
</ul>
<h4>Plugin Demo</h4>
<p><iframe loading="lazy" title="WordPress Plugin: Just TinyMCE Custom Styles" width="750" height="563" src="https://www.youtube.com/embed/fljkfet52eg?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></p>
<h4>Presets</h4>
<p>We added special feature called “Presets” – these are pre-defined styles included inside the plugin.<br />
You can import them to your site with a single click.</p>
<p>With presets we plan to add popular CSS framework classes to be able to use them inside the editor.<br />
We started with a Bootstrap preset, because it’s one of the most popular CSS framework right now.</p>
<h4>ISSUES TRACKER</h4>
<p>If you have any feedbacks or bugs found, please write to our GitHub issues tracker:<br />
https://github.com/justcoded/just-tinymce-custom-styles/issues</p>


Just TinyMCE Custom Styles

Easy to use plugin and created for WP developers

Easy to use and developer friendly

Adds dropdown options for custom css classes and attributes for tags in WordPress TinyMCE Editor.

Square Candy TinyMCE Reboot vs Just TinyMCE Custom Styles