Skip to content

Instantly share code, notes, and snippets.

@antxd
Created July 31, 2019 20:29
Show Gist options
  • Save antxd/b9310c82c3bdd8f3193c7af67631ab31 to your computer and use it in GitHub Desktop.
Save antxd/b9310c82c3bdd8f3193c7af67631ab31 to your computer and use it in GitHub Desktop.
Example of wysiwyg-html-editor with Trumbowyg
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo editor</title>
<!-- copiar al principio de detalle -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Trumbowyg/2.15.0/ui/trumbowyg.min.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Trumbowyg/2.15.0/trumbowyg.min.js"></script>
<!-- hasta aqui -->
</head>
<body>
<h1>Edtor</h1>
<form>
<textarea id="editor" name="Descripcion"></textarea>
<button type="submit">Guardar</button>
</form>
<!-- copiar al final de detalle -->
<script type="text/javascript">
// aqui el el nombre de la Variable donde quiero el editor Ejemplo Descripcion
$('#editor').trumbowyg({
btns: [['bold', 'italic'],['h1', 'h2'],['unorderedList', 'orderedList'], ['link'], ['fullscreen'], ['horizontalRule']],
removeformatPasted: true,
autogrow: true
});
</script>
<!-- hasta aqui -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment