summernote-ext-file

A plugin to add file gestion on Summernote WYSIWYG editor :

  • Creating a new document
  • Importing/Opening a text or xml files
  • Exporting/Saving to text, xml, Word (doc file) or pdf files

Installation

1. Include JS

<!-- Dependency -->
<script src="./summernote-ext-file/vendor/docxtemplater.min.js"></script>
<script src="./summernote-ext-file/vendor/pizzip.js"></script>
<script src="./summernote-ext-file/vendor/nl2br.min.js"></script>
<script src="./summernote-ext-file/vendor/FileSaver.min.js"></script>
<script src="./summernote-ext-file/vendor/jquery.wordexport.js"></script>
<script src="./summernote-ext-file/vendor/html2canvas.min.js"></script>
<script src="./summernote-ext-file/vendor/jspdf.min.js"></script>
<!-- Main file -->
<script src="./summernote-ext-file/summernote-ext-file.js"></script>

2. Initialisation

$(document).ready(function () {
    $('#summernote').summernote({
        height : 300,
        toolbar: [
          ['file', ['fileNew', 'fileOpen', 'fileSave']],
        ],
    });
});

Access by API

You can access to these functionalities through API :

New file

$('#summernote').summernote('file.fileNew');

Opening file

$('#summernote').summernote('file.fileOpen', '%TYPE%' );

%TYPE% can be :

  • txt : File text (.txt)
  • xml : xml file (.smn)

Saving file

$('#summernote').summernote('file.fileSave', '%TYPE%' );

%TYPE% can be :

  • txt : File text (.txt)
  • xml : xml file (.smn)
  • wrd : Word file (.doc)
  • pdf : PDF file (.pdf)

Dependency and tested with

  • Summernote : 0.8.18
  • JQuery : 3.6.0
  • BootStrap : 5.1.1

Greetings

GitHub

View Github