Ditch the Upgrade Button: Removing the Upgrade Banner in TinyMCE
Tired of that pesky "Upgrade to TinyMCE Pro" banner cluttering up your TinyMCE editor? This article will guide you through the simple steps to banish the banner and regain control of your editing experience.
The Problem: A Persistent Banner
The "Upgrade to TinyMCE Pro" banner often appears at the top of your TinyMCE editor, encouraging you to upgrade to a premium version. While it's understandable that TinyMCE wants to promote their Pro features, it can be disruptive for users, especially if you are using the free version.
Original Code:
By default, the upgrade banner is activated in the TinyMCE configuration. Here's a snippet of the default configuration:
tinymce.init({
// ...other configuration options...
menubar: 'file edit view insert format tools table help',
plugins: [
'advlist autolink lists link image charmap print preview anchor',
'searchreplace visualblocks code fullscreen',
'insertdatetime media table paste code help wordcount'
],
toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
// ...other configuration options...
});
The Solution: A Quick Fix
The solution is surprisingly straightforward. You simply need to set the promotion option to false in your TinyMCE configuration. Here's an example:
tinymce.init({
// ...other configuration options...
menubar: 'file edit view insert format tools table help',
plugins: [
'advlist autolink lists link image charmap print preview anchor',
'searchreplace visualblocks code fullscreen',
'insertdatetime media table paste code help wordcount'
],
toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
promotion: false, // Disable the upgrade banner
// ...other configuration options...
});
By adding promotion: false, you effectively disable the banner from appearing in your TinyMCE editor.
Why It Works: Understanding the Promotion Option
The promotion option controls the display of various promotional elements within TinyMCE, including the "Upgrade to TinyMCE Pro" banner. Setting it to false disables all promotions, giving you a clean and focused editing environment.
Additional Tips
- Keep your TinyMCE version updated: While this article focuses on the free version, updating your TinyMCE version can often address banner-related issues.
- Explore the TinyMCE documentation: The official TinyMCE documentation offers a wealth of information on configuration options and troubleshooting tips.
Conclusion
By simply adding the promotion: false option to your TinyMCE configuration, you can easily remove the upgrade banner and maintain a distraction-free writing experience. Feel free to explore other configuration options to customize your TinyMCE editor to your liking.
