Font Awesome fortyTwo

Font Awesome plugin supporting FA v4 through v6, free and pro.

- icon list pulled from FontAwesome CSS file being used
- Brand checkbox

- styling, effects, transformations and animations available in relation to FA version being used:
  - font styles: solid, regular, light, thin, duotone, and newer sharp
  - FA font-sizes
  - rotate, spin, flip, beat, fade, etc..

Installation

Download and extract the plugin. Upload the /fa42 directory to your editor's /plugins/ directory

* fa42 requires the colordialog plugin, download and install if necessary

Add the plugin(s) to your editor config:

config.extraPlugins = 'colordialog,fa42'

CKEditor tends to remove most empty tags. While the "fix" for this is varied, this seems to work. Note to add the removeEmpty before the actual editor config:

CKEDITOR.dtd.$removeEmpty['i'] = 1; // replace or duplicate if you want to use <span> or any other tag instead of <i>

CKEDITOR.editorConfig = function( config ) { 
//...
}

 

Configuration

By default the plugin will use the <i> tag for icons, and Font Awesome version 6.4 Free from CDN. Configuration options are available to change these settings:

config.fa42 = {
  fa42Tag: 'span', // use <span> instead of <i>
  fa42Path: 'path/to/your/fontawesome.css', // link to a different local or remote version
  fa42Version: '8.4.2', // the plugin will try to auto-detect versioning and free/pro, but you can specify version here if auto-detection seems to not work
  fa42Level: 'pro', // free or pro, again in case auto-detection doesn't work
};

 

 

 

Screenshots

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.0.2

DownloadRelease notes

Re-coded ES6 JavaScript, validate plugin with CKBuilder

Chat GPT

Write texts for your websites x10 faster with this ChatGPT CKEditor plugin called Txt42 (TextareaAI before).

You can select some text or just place the caret under some header, just a text, or inside a list (it is very smart to understand what you want) and click on the button to ask AI to generate and insert new text into your content. You can also use "Ctrl+Enter" shortcut for this.

The buttons for the toolbar are: "Txt42", "Txt42Less", "Txt42More".

Screenshots

chat-gpt

293 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 2023.8.1

DownloadRelease notes

Debug version info added

Cowriter

This plugin generates content with the help of artificial intelligence. It is based on the CKEditor 4. It uses the OpenAI API to generate text.

Installation

Installation with npm

  1. Install the plugin with npm:

     npm install ckeditor-cowriter   
    
  2. Enable the plugin by using the extraPlugins configuration setting. For example:

     config.extraPlugins = 'cowriter';
    

Installation from CDN

  1. Add the following script tag to your HTML page:

     <script src="https://netresearch.github.io/ckeditor-cowriter/plugin.js"></script>
    
  2. Enable the plugin by using the extraPlugins configuration setting. For example:

     config.extraPlugins = 'cowriter';
    

Installation from source

  1. Download the latest release of the plugin.

  2. Extract the contents of the archive into the CKEditor 4 plugins directory.

  3. Enable the plugin by using the extraPlugins configuration setting. For example:

     config.extraPlugins = 'cowriter';
    

Configuration

You need to define your OpenAI credentials.

const OPENAI_KEY = 'YOUR-KEY'
const OPENAI_ORG = 'org-YOUR-ORG-KEY'

Usage

  1. Click on the Cowriter button in the toolbar.
  2. Enter a prompt.
  3. Click on the Generate button.
  4. The generated text will be inserted into the editor.

License

Licensed under the terms of the GNU General Public License, version 3 or later.

Credits

Contributing

We welcome contributions to this project. Please see our contribution guidelines for details.

Security

If you discover any security related issues, please email developer@netresearch.de instead of using the issue tracker!

Contact

Netresearch, the company behind this plugin, is a leading European provider of digital solutions and services for the eCommerce industry. We are a team of eCommerce experts, developers, designers, project managers, and consultants. We are passionate about eCommerce and we love to share our knowledge with the community.

Twitter | LinkedIn | Facebook | Xing | YouTube

Screenshots

cowriter

368 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 0.2.7

DownloadRelease notes

Fixed bug with missing translations

HTML <mark> Tag Button

A CKEditor plugin to wrap text with an HTML <mark> Tag

Screenshots

markTag

1,056 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.1.0

DownloadRelease notes

See on GitHub

FontAwesome6

FontAwesome6 (free) allows you to insert formatted Font Awesome 6 into your text in CKEditor.

Install:

  1. add in your html page all.min.css
  2. add in your config.js from ckeditor folder:
  • config.extraPlugins = 'ckeditorfa';
  • config.allowedContent = true;
  • config.contentsCss = '/{your_path}/all.min.css';

CKEDITOR.dtd.$removeEmpty['span'] = false;
 

For Font Awesome 4.7 use this plugin: https://ckeditor.com/cke4/addon/ckeditorfa-0

For Font Awesome 5.15 use this plugin: https://ckeditor.com/cke4/addon/ckeditorfa5

 

Screenshots

ckeditorfasix

2,090 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.8

DownloadRelease notes

Upgrade to Font Awesome 6.4.2

ckeditor add class

This plugin allows you to add class to element. In toolbar you can add dropdown to which can have classes. And on selecting value from dropdown class will be added to current selected element.

Screenshots

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.0.1

DownloadRelease notes

The first minor release 1.0.1

Mathematical Formulas (Tesla)

Introduction:

This plugin is my expansion for current version of Mathematical Formulas plugin. Toolbar is added for creating mathematical formulas faster. Formulas is rended by MathJax. The toolbar UI is based on CodeCogs and modified by us for rendering TeX formulas supported by MathML.

Some features expanded:

+ Toolbar in dialog for create math formulas faster:

  • Create matrix and equation by UI.
  • Insert math symbols easly.
  • ...

+ Fix bug not auto preview in firefox.

Input: laTeX (type or use toolbar)

Output: Use this function in component or script for rendering a formulas

export function formatMathemicalFormulas() {
  (function () {
    // console.log("Style MF called!");
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML";   // use the location of your MathJax

    var config = 'MathJax.Hub.Config({' +
      'extensions: ["tex2jax.js"],' +
      'jax: ["input/TeX","output/HTML-CSS"]' +
      '});' +
      'MathJax.Hub.Startup.onload();';

    if (window.opera) {
      script.innerHTML = config
    } else {
      script.text = config
    }

    script.addEventListener('load', function () {
      window.MathJax.Hub.Queue(["Typeset", window.MathJax.Hub]);
    })

    document.getElementsByTagName("head")[0].appendChild(script);
  })();
}

 

Setup:

After basic installing, please add mathJaxLib to config:

mathJaxLib: '//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-AMS_HTML'

Additional configuration:

config.mathJaxClass - sets the default class for an element that will be converted into a widget.

Bug:

Currently, this version is lack of language translation.

Another informations:

it is not supported in IE 8.

 

Screenshots

nvd_math

1,520 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.0.1

DownloadRelease notes

Fix feature not support in ES6.

Bootstrap 4 Embed Media

Bootstrap 4 Embed Media Dialog for ckEditor 4 based on Fabian Vogelsteller's Embed Media Dialog on https://github.com/frozeman/MediaEmbed

Wrap any embed like an <iframe> in a parent element with .embed-responsive and an aspect ratio. The plugin allows you to insert multiple iframes at the same time, managed as separate elements. Bootstrap classes for responsive embed are applied only to iframe, video, embed and object tags. The other tags are not modified in any way.

Screenshots

Bootstrap-Mediaembed

1,195 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.1

DownloadRelease notes

Correct some bug

Preview In Server

Preview In Server is a simple plugin to view CKEditor text on your web page. The plugin sends to the server via POST or GET a predefined data model.

Screenshots

previewinserver

1,799 downloads (view stats)

Releases

Plugin versions CKEditor versions
4.24 4.23 4.22

Version: 1.1

DownloadRelease notes

Changing the icon

Editor Placeholder

This plugin allows you to display a predefined placeholder text in the editor window if the content is empty. It makes accessing the editor area easier.

Screenshots

editorplaceholder

154,806 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

DownloadRelease notes

First major release of CKEditor 4.23.0-lts

Version: 4.22.1

DownloadRelease notes

First minor release of CKEditor 4.22.1

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