CKEditor 4

Table Tools

Are you tired of working with annoying tables? Rows and columns just don’t stay as you want them to? Table Tools saves the day!
Just install Table Tools and receive a full range of possibilities to build a table of any complexity effortlessly.
 
The plugin has its own library that allows any table transformations including creating rows and columns, swapping places, merging and splitting cells.
You can configure styles, classes and cell attributes and apply them to the whole table or just a specific column, row or cell.
 
By the way, the set of plugins integrates to Foundation and Bootstrap frameworks. So you just need to select the framework and Table Tools will take into account its specifics automatically.

 

Screenshots

carousel
carousel
carousel

Product Page

Drag and Drop Image Uploads

Hey! 

This was supposed to be deleted, like, a year ago. Yet... still here! 

 

Stop downloadin' it, people.  It no work-y. 

Download Add to my editor
dragdrop

2,009 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 0.1.0

Download• Release notes

Release V.0.1.0

Drag and Drop uploading of Images

Currently Imgur and S3 are the two upload locations supported, but, since uploading files boils down to submitting a POST towards the general direction of a server, new backends are trivial to implement.

Imgur:

CKEDITOR.editorConfig = function( config ) {
  // rest of config
  config.extraPlugins = 'dragdrop';

  // configure the backend service and credentials
  config.dragdropConfig = {
      backend: 'imgur',
      settings: {
          clientId: 'YourImgurClientID'
      }
  }
});

AWS S3:

CKEDITOR.editorConfig = function( config ) {
  // rest of config
  config.extraPlugins = 'dragdrop';

  // configure the backend service and credentials
  // aws requires a few extra.. 
  config.dragdropConfig = {
      backend: 's3',
      settings: {
          bucket: 'bucketname',
          region: 'your-region',
          accessKeyId: 'key',
          secretAccessKey: 'secret-key'
      }
  };
});

Dropdown menu manager

Dropdown menu manager

This plugin adds the feature to describe with the help of the CKEditor's configuration various dropdowns and populate them with desirable items.

Configuration example 
 config.dropdownmenumanager={
        'Widgets': {
          items: [{
            name: 'textWidget',
            label: 'Text Widget',
            command: 'theCommandExecutedOnClick',
            order: 1
            }],
          label: {
            text: 'Widgets',
            width: 45
          },
          iconPath:'/images/widgetIcon.png'
        },
 };

To add the dropdowns on the toolbar use the keys in the 'config.dropdownmenumanager' object , in this case: 'Widgets'

Simple toolbar:

 config.toolbar = [
    ['Widgets']
  ];

In order to show the dropdown menu's label you should not use the default CKEditor iframe functionallity.

Download Add to my editor
dropdownmenumanager

19,841 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 2.1.0

Download• Release notes

Add promise support for the menu items labels

Upload Image

This plugin enables support for uploading images that were dropped or pasted into the editor. See the live demo.

The upload is implemented in a non-blocking way, so while the image is being uploaded the user may continue editing the content.

This plugin can be combined with a file manager such as CKFinder to provide image storage, browser and editor capabilities.

This plugin is based on the Upload Widget plugin which allows to create more upload widgets, for example, for handling different file types.

Download Remove
uploadimage

1,317,751 downloads (view stats)

This is an official plugin provided and supported by CKEditor developers.

You can submit bug reports directly to its GitHub issues tracker and discuss any integration issues on StackOverflow.

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 4.23.0-lts

Download• Release notes

First major release of CKEditor 4.23.0-lts

Version: 4.22.1

Download• Release notes

First minor release of CKEditor 4.22.1

Upload Widget

This plugin implements a base class for creating non-blocking, live upload of files while the user is editing content.

See for instance the Upload Image plugin's demo. When you paste or drop an image, its preview is immediately inserted into the content allowing you to edit content while the file is being uploaded.

The plugin allows to create more upload widgets, for example for handling different file types.

This plugin can be combined with a file manager such as CKFinder to provide file storage, browser and editor capabilities.

Download Required
uploadwidget

1,298,742 downloads (view stats)

This is an official plugin provided and supported by CKEditor developers.

You can submit bug reports directly to its GitHub issues tracker and discuss any integration issues on StackOverflow.

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 4.23.0-lts

Download• Release notes

First major release of CKEditor 4.23.0-lts

Version: 4.22.1

Download• Release notes

First minor release of CKEditor 4.22.1

Text Shadow

Add shadows to your texts without editing the source code!

  • Available in 66 languages

 

DEPENDENCIES:

It requires the following plugins to work: Color Dialog.

 

NOTE: You can send your suggestions, comments, concerns, or inquiries through mj.plugins.info@gmail.com or by filling up the contact form of my website. I'm having trouble using Disqus lol.

Screenshots

carousel
carousel
carousel

Product Page

Semantic Media Embed

This plugin lets you embed media resources with semantic output directly in the editor.

The plugin introduces a widget that allows you to embed resources (videos, images, tweets, etc.) hosted by other services (called the "content providers") in your content. By default, the plugin uses the Iframely proxy service which supports over 1715 content providers such as YouTube, Vimeo, Twitter, Instagram, Imgur, GitHub, or Google Maps.

Note: The default configuration uses the public service provided by Iframely which has some limitations. If you want to continue using Iframely, it is recommended to create your own account and use your API key. Some services (like Google Maps) require setting up your API key, too, and adding it to your Iframely configuration.

See also the Media Embed plugin that creates embedded media resources without a semantic output, i.e. it will include the entire HTML needed to display the resource in the data, and the Auto Embed plugin that automatically turns a media resource URL pasted into the editing area into an embedded resource.

Screenshots

carousel
carousel
carousel
Download Add to my editor
embedsemantic

25,357 downloads (view stats)

This is an official plugin provided and supported by CKEditor developers.

You can submit bug reports directly to its GitHub issues tracker and discuss any integration issues on StackOverflow.

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 4.23.0-lts

Download• Release notes

First major release of CKEditor 4.23.0-lts

Version: 4.22.1

Download• Release notes

First minor release of CKEditor 4.22.1

MJ Breadcrumbs

Add breadcrumbs to your write-ups without editing the source code!

  • Available in 66 languages

For Bootstrap users, see: Bootstrap Breadcrumbs
For Foundation users, see: Foundation Breadcrumbs

 

DEPENDENCIES:

It requires the following plugins to work: Widget and Line Utilities.

 

NOTE: You can send your suggestions, comments, concerns, or inquiries through mj.plugins.info@gmail.com or by filling up the contact form of my website. I'm having trouble using Disqus lol.

Screenshots

carousel
carousel
carousel

Product Page

HTML 5 Validation

The HTML5Validation plugin for CKEditor extends the core Forms plugin adding a Form Validation tab onto several elements. This allows you to add HTML5 Form Validation attributes onto your forms inside of CKEditor.

Features Overview
  • Adds Form Validation tab to textfield, textarea, radio, checkbox, and select form dialogs. The Form Validation tab allows you to set the HTML5 Required & Pattern attributes
  • Adds Form Validation tab to form dialog. This allows you to add a novalidate HTML5 attribute to the form tag to disable HTML5 form validation
Requirements
  1. CKEditor version 4.4.7 or greater http://ckeditor.com/
  2. The Forms plugin for CKEditor (normally installed by default)
Installation Instructions
  1. Extract the downloaded repository
  2. Copy the html5validation folder to your "ckeditor/plugins/" folder
  3. Open the "ckeditor/config.js" file in your favorite text editor
  4. Add html5validation to config.extraPlugins and save your changes. If that line isn't found, add it. EX:

config.extraPlugins = 'html5validation';

Credits / Tribute

This plugin was developed and is maintained by the https://totalwebservices.net/.

A big thanks goes out to the following people & organizations: http://www.websiterelevance.com - for supporting the development of the plugin. http://www.ckeditor.com - For providing CKEditor so we could build this plugin for it. Piotrek Reinmar Koszuliński - A developer on the CKEditor team who pointed us in the right direction with a bug we encountered during development.

License

Licensed under GPL Version 3.0. For additional details please see the LICENSE.md file.

Screenshots

carousel
carousel
Download Add to my editor
html5validation

24,997 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.0.0.4

Download• Release notes

Added German translation (special thanks to Stefan Berger)

MJ Carousel

Add a carousel to your write-ups without editing the source code!

For Bootstrap users see: Bootstrap Carousel

 

DEPENDENCIES:

It requires the following plugins to work: CKFinder, Widget and Line Utilities.

 

NOTE: You can send your suggestions, comments, concerns, or inquiries through mj.plugins.info@gmail.com or by filling up the contact form of my website. I'm having trouble using Disqus lol.s lol.

Screenshots

carousel
carousel
carousel

Product Page

Twitter Facebook Facebook Instagram Medium Linkedin GitHub Arrow down Phone Menu Close icon Check