ccc

CKEditor: Añadir fuentes de google fonts a CKEditor

<!doctype html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script type="text/javascript" src="ckeditor/ckeditor.js"></script>
</head>
<body>

<div id="editable" contenteditable="true">
  Aqui el texto a modificar
</div>
<input type="button" value="pulsa" id="editor">

  <script type="text/javascript">
$(document).ready(function(){
CKEDITOR.disableAutoInline = true;

// var editor = CKEDITOR.inline($("#editable")[0]);
$("#editor").on("click",function() {
CKEDITOR.inline($("#editable")[0]);
});

myFonts = ['Aclonica', 'Abel'];  // añado las google fonts que se quiera usar
CKEDITOR.config.font_names = 'serif;sans serif;monospace;cursive;fantasy';

for(var i = 0; i<myFonts.length; i++){
CKEDITOR.config.font_names = CKEDITOR.config.font_names+';'+myFonts[i];
myFonts[i] = 'http://fonts.googleapis.com/css?family='+myFonts[i].replace(' ','+');
// alert(myFonts[i]);
$("head").append("<link rel='stylesheet' href='"+ myFonts[i] +"'>");
}
CKEDITOR.config.contentsCss = ['/ckeditor/contents.css'].concat(myFonts);
});
  </script>
</body>
</html>

1 comentario:

  1. Este código donde lo introduzco? En la página donde tengo el cms?

    Muchas gracias por tu ayuda!!

    ResponderEliminar