Corsi on-line

Summernote: editor WYSIWYG basato su jQuery e Bootstrap

Summernote è un progetto interessante nel già affollato panorama degli strumenti per la produzione di contenuti online, si tratta infatti di un editor di tipo WYSIWYG (What You See Is What You Get) basato sul framework JavaScript jQuery e sul front-end engine Bootstrap; rilasciato sotto licenza Open Source, Summernote richiede il doctype HTML5 per il suo utilizzo e sfrutta il dynamic stylesheet language LESS per le regole di stile CSS.

SummernoteL’installazione dell’editor è molto semplice, ma per il suo funzionamento sono richieste anche alcune librerie a corredo, per cui, dopo aver definito il Document Type necessario:

<!DOCTYPE html>
<html lang="en">
...
</html>

si potrà procedere con l’inclusione delle risorse richieste:

<!-- libries(jQuery, bootstrap..) -->
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script> 
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap.min.css"> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.1/js/bootstrap.min.js"></script> 
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">

<!-- summernote css/js-->
<link href="summernote.css" />
<script src="summernote.min.js"></script>

Summernote fornisce il supporto sia per la versione 2 di Bootstrap che per l’ultima release 3 e mette a disposizione delle scorciatoie da tastiera per l’accesso a tutte le funzionalità principali; la personalizzazione è garantita da un’apposita API (Application Programming Interface), inoltre, l’editor potrà essere facilmente integrato in progetti di applicazioni basate su PHP, Ruby, Django o Node.JS.

Via Summernote

Post correlati
I più letti del mese
Tematiche