Elearning, Herramientas de autor

En unos pocos pasos vamos a ver cómo crear un nuevo conjunto de estilos, la denominaremos plantilla, para que tus contenidos en exelearning estén personalizados con tu logo, tus colores, tipo de letra, etc…

Para crear una nueva plantilla, lo más eficaz es partir de una ya existente, y dado que es muy importante que nuestros contenidos sean adaptables a cualquier dispositivo, nuestra plantilla tendrá que ser de diseño responsive.

En exelerning al conjunto de estilos para dar el aspecto al contenido se denominan Estilos, aunque voy a hacer referencia a ellos como Plantillas.

1.  Elige la  plantilla base

Elegir una de las plantillas que ya existen y que sean de diseño responsive, por ejemplo “EducaMadrid”, “Intef”, “Max (Madrid_Linux)”

2. Localiza la  carpeta de la plantilla

Localizamos la plantilla en la ruta [ruta de instalación]\exelearning\style, por ejemplo la carpeta MAX que corresponde a la plantilla “MAX (MAdrid_Linux)”

[ruta de instalación]\exelearning\style\MAX

3. Duplica la carpeta de la plantilla

Duplicamos esta carpeta y le damos un nuevo nombre, vamos a realizar una plantilla denominada Maiaxia.

[ruta de instalación]\exelearning\style\Maiaxia

Si observamos los ficheros que aparecen esta carpeta, tenemos:

  • Las imágenes de la  plantilla
  • Un fichero de configuración config.xml
  • Dos ficheros de estilos content.css y nav.css
  • Un fichero javascript _max_js.js

4. Modifica el  nombre de la plantilla

Para cambiar el nombre de la plantilla tenemos que editar el fichero config.xml y cambiar:

  • El nombre de la plantilla
  • El autor
  • La versión de la plantilla
  • La licencia, tipo de licencia
  • Descripción de la plantilla
<?xml version="1.0"?>
 <theme>
 <name>Maiaxia</name>
 <version>1.0</version>
 <compatibility>2.0+</compatibility>
 <author>Maiaxia</author>
 <author-url>https://www.maiaxia.com/</author-url>
 <license>Creative Commons by-sa</license>
 <license-url>http://creativecommons.org/licenses/by-sa/3.0/</license-url>
 <description>Plantilla realizada por Maiaxia.</description>
 <extra-head><![CDATA[<meta name="viewport" content="width=device-width, initial-scale=1" />
 ]]></extra-head>
 <extra-body><![CDATA[<script type="text/javascript" src="_max_js.js"></script>]]></extra-body>
 </theme>

 Cerrar exelearning y volver a abrir para que se cargen correctamente los cambios.

5. Personaliza las imágenes

Cambiamos las imágenes por las que queramos para nuestra nueva plantilla, las que afectan a los iDevices de exelearning son:

  • icon_activity.gif
  • icon_casestudy.gif
  • icon_gallery.gif
  • icon_generic.gif
  • icon_objectives.gif
  • icon_preknowledge.gif
  • icon_question.gif
  • icon_reading.gif
  • icon_reflection.gif

Las imágenes que afectan a la cabecera son:

  • _max_cabecera.jpg (se visualiza cuando exportamos el paquete en HTML)
  • _max_titulo_nodo.jpg (se visualiza cuando exportamos el paquete en SCORM)

6.  Personaliza los css

Para cambiar los tipos de letra tamaño y colores hay que cambiar el fichero content.css

Lo mejor es ayudarse de la extensión Firebug de Mozilla Firefox para identificar los nombres de los estilos. Identificar el nombre y cambiar el estilo en el fichero content.css

El fichero content.css tiene los estilos más generales y que afectan a los paquetes SCORM y HTML, mientras que el fichero nav.css tiene los estilos que afectan a la visualización del paquete en HTML

7. Aplica la plantilla al contenido

Aplica la nueva plantilla y a probar el resultado….

8. Distribuye la nueva plantilla

Para distribuir a otras personas la nueva plantilla, solo tienes que copiar la carpeta generada en su instalación de exelearning, recuerda que las plantillas van en la carpeta [ruta de instalación]\exelearning\style

Estos son los pasos más sencillos para crear un nuevo conjunto de estilos en exelarning.