CKEditor ChatGPT sample

Play on CodePen All samples on CodePen External link

Demo

HTML

JavaScript

CSS

<h1 class="h5 mb-3">Txt42: CKEditor ChatGPT plugin</h1>

<textarea id="editor"><h2>Test content</h2></textarea>

"use strict";
let editor = CKEDITOR.replace("editor", {
    extraPlugins: "chat-gpt",
    skin: "n1theme",
    toolbar: [
        { name: 'standard', items: ['Link', 'Unlink', '-', 'Bold', 'Italic', '-', 'FontSize', 'Format', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock', '-', 'TextColor', 'BGColor', '-', 'RemoveFormat'] }
    ],
    apiKey: "TXAIAUTO", // use own key
});

body {
  padding: 20px;
  background-color: #F4F4F4;
}

This example illustrates the process of installing the Txt42 ChatGPT plugin into the CKEditor editor by adding buttons to the CKEditor toolbar.

Please remember to replace the apiKey parameter with your own key, which can be found in your Dashboard.