Timestamp (Creating a Most Basic CKEditor 4 Plugin) Documentation

This sample demonstrates the Timestamp plugin that was built in the Creating a CKEditor 4 Plugin in 20 Lines of Code tutorial from the Plugin SDK section of the CKEditor Developer's Guide.

The custom plugin created in the tutorial inserts current date and time into the editing area at the caret position after clicking the new button. This is an example of a most basic CKEditor 4 plugin that you can create in 20 lines of code.

Timestamp is a proof-of-concept plugin that can be downloaded from the repository or created by following the step-by-step tutorial.

Related Features

Get Sample Source Code

Timestamp plugin

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="robots" content="noindex, nofollow">
  <title>Timestamp plugin</title>
  <script src="https://cdn.ckeditor.com/4.25.0-lts/standard-all/ckeditor.js"></script>
</head>

<body>
  <textarea cols="80" id="editor1" name="editor1" rows="10">&lt;p&gt;This is some sample text. You are using &lt;a href="https://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;
</textarea>
  <script>
    CKEDITOR.plugins.addExternal('timestamp', 'https://ckeditor.com/docs/ckeditor4/4.25.0-lts/examples/assets/plugins/timestamp/', 'plugin.js');

    CKEDITOR.replace('editor1', {
      extraPlugins: 'timestamp',
      removeButtons: 'PasteFromWord'
    });
  </script>
</body>

</html>