{"id":156,"date":"2021-06-26T18:47:40","date_gmt":"2021-06-26T16:47:40","guid":{"rendered":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/?p=156"},"modified":"2023-10-11T20:08:36","modified_gmt":"2023-10-11T18:08:36","slug":"exelearning","status":"publish","type":"post","link":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/exelearning\/","title":{"rendered":"eXeLearning"},"content":{"rendered":"<h1>eXeLearning, resumiendo&#8230;<\/h1>\n<p>Es un programa escrito en <strong>python<\/strong> que crea un <strong>sistema de ficheros virtual<\/strong> y lo p\u00fablica mediante un <strong>servidor web propio<\/strong>. El programa usa ese servidor web como <strong>interfaz de usuario<\/strong> donde el usuario puede ver y editar el contenido de un recurso educativo mediante el uso de <strong>HTML+CSS y JavaScript<\/strong>. Ese recurso educativo esta organizado en <strong>p\u00e1ginas<\/strong> en diferentes <strong>niveles<\/strong> y cada p\u00e1gina puede contener <strong>iDevices<\/strong>. Estos iDevices puedes ser de varios tipos (textos, interactivos, juegos, soporte, etc.). El contenido deber\u00e1 estar contenido en alg\u00fan iDevice.<br \/>\nComenz\u00f3 a desarrollarse en la <strong>Universidad de Auckland<\/strong> (Nueva Zelanda) con licencia <strong>GPLv2<\/strong>, del cual a\u00fan se mantienen partes del c\u00f3digo como el archivo \u00abcommon.js\u00bb, obtuvo alg\u00fan premio y se detuvo el desarrollo por parte de la misma en 2005.&nbsp; En 2007 CORE Education contrato a dos de los desarrolladores para seguir con el desarrollo centr\u00e1ndose en la ense\u00f1anza obligatoria. A ra\u00edz de ah\u00ed, se ha seguido desarrollando por otras partes. En 2011 el www.ite.educacion.es y cedec.ite.educacion.es a trav\u00e9s de la empresa open-phoenix.com contin\u00faan con el desarrollo. En la actualidad varias comunidades dan soporte al proyecto como son Andaluc\u00eda, Extremadura, Galicia, Murcia, Madrid y Pa\u00eds Vasco. Y el desarrollo est\u00e1 centralizado en <a href=\"https:\/\/exelearning.net\/\">exelearning.net<\/a>.<\/p>\n<p>El usuario puede crear recursos educativos de forma local (de momento) y puede guardarlo como un archivo ELP (extensi\u00f3n propia de la aplicaci\u00f3n). Adem\u00e1s puede exportarlo a varios formatos (p\u00e1gina web, SCORM para Moodle por ejemplo, EPUB, etc.)<\/p>\n<p>En cuanto al dise\u00f1o CSS de la exportaci\u00f3n como web, el c\u00f3digo generado por eXeLearning con el estilo Educaand est\u00e1 pensado para dos tama\u00f1os de pantalla. Una normal en la que se muestra un men\u00fa a la izquierda y otra peque\u00f1a en la que se oculta el men\u00fa. Adem\u00e1s eXeLearning, a parte de que esta pensado para que el contenido se adapte al ancho de la ventana, usa un espacio con un ancho m\u00e1ximo de 1230 pixeles (descontando m\u00e1rgenes y men\u00fa quedan 900 pixeles para contenido y en el caso de ocultar el men\u00fa colaps\u00e1ndolo quedan 1180 pixeles para contenido).<\/p>\n<h1>Trabajar cooperativa y simultaneamente p\u00e1ginas eXeLearning (script en bash)<\/h1>\n<p>Pues se trata de trocear un elp para poder trabajar a la vez cada p\u00e1gina. Se exporta cada p\u00e1gina en un archivo ELP distinto sobre el que se podr\u00e1 trabajar mientras otras personas est\u00e1n trabajando en otras p\u00e1ginas (ELPs). Despu\u00e9s, cuando se ha terminado el REA, se vuelven a juntar para formar un solo ELP con todas las p\u00e1ginas.<\/p>\n<p>Es muy interesante sobre todo cuando hay varios elaboradores y alg\u00fan o algunos coordinadores por encima que deben supervisar el trabajo. Por que adem\u00e1s de la posibilidad de cooperar los elaboradores con las distintas p\u00e1ginas permite al coordinador supervisar desde que se esta realizando el trabajo. Y no como trabaj\u00e1bamos antes con un documento plantilla donde introduc\u00edan contenido los elaboradores, luego el Inform\u00e1tico pasaba esa plantilla a eXeLearning y entonces era cuando el coordinador pod\u00eda corregir aspectos del contenido que hac\u00edan volver a los elaboradores con la perdida de trabajo y frustraci\u00f3n que ello conllevaba. Esta claro que para adoptar esta soluci\u00f3n es necesario que todos los miembros se manejen al menos con un nivel b\u00e1sico el eXeLearning (lo que no es mucho m\u00e1s complejo que cualquier editor de documentos). Y por supuesto, para aprovechar toda la eficicencia que ofrece este sistema est\u00e1 claro que todos los elaboradores deben llevar un ritmo bastante parecido. Ya que con este sistema o con documentos plantillas, si alg\u00fan miembro se retrasa retrasa a todo el equipo dando igual que el sistema sea m\u00e1s o menos eficiente.<\/p>\n<p>De esta manera se podr\u00eda hacer que tomase los archivos directamente desde una carpeta de la nube de almacenamiento y comprobando si hab\u00edan cambiado regenerar\u00eda el ELP juntando las p\u00e1ginas para formar un solo ELP. Al que a\u00f1adir\u00eda la presentaci\u00f3n para los pdf (imagen primera p\u00e1gina y leyenda) y crear\u00eda los cr\u00e9ditos de forma autom\u00e1tica a partir de otro archivo en la nube con los datos m\u00ednimos. Luego se exportar\u00eda mediante p\u00e1gina web para subirlo al FTP de trabajo y avisara a los miembros del equipo. Para que todos supieran cuando se hab\u00eda cambiado algo.<\/p>\n<p>A continuaci\u00f3n os dejo el script en bash (inicial) para realizar dicha tarea de forma automatizada:<\/p>\n<p><a href=\"https:\/\/sourceforge.net\/projects\/cooperaexe\/\">Descargar<\/a><\/p>\n<h1>Scripts para la creaci\u00f3n la p\u00e1gina de los cr\u00e9ditos a partir del ELP y un archivo conlas URL de los recursos externos v1.1<\/h1>\n<p>Buenas, despu\u00e9s de ver que la versi\u00f3n anterior era poco \u00fatil ya que los recursos no est\u00e1n definidos desde el principio del REA y se van concretando sobre la marcha. He creado un script solo para los cr\u00e9ditos (cosa que se ser\u00eda interesante que a\u00f1adiese eXeLearning, ya que es un trabajo muy tedioso licenciar todos los recursos usados). El script analiza el archivo ELP y busca todos los recursos usados (esta hecho a la ligera, no mira el xml como tal sino como texto plano) y si los encuentra en el archivo de las URL va a esa p\u00e1gina y descarga informaci\u00f3n de la autor\u00eda y de la licencia. Sino esta en el archivo entiende que es un recurso propio. Y crea el c\u00f3digo para insertarlo en la p\u00e1gina de cr\u00e9ditos. He dejado el script antiguo por que todav\u00eda lo uso para el trabajo realizado por la maestra de pedagog\u00eda terap\u00e9utica, crear diccionarios, bocadillos de los t\u00e9rminos y contenido de apoyo, ya que en este caso si sigue siendo \u00fatil.<\/p>\n<p>Adem\u00e1s he a\u00f1adido la creaci\u00f3n de un c\u00f3digo Html para la tabla (hubiera sido mejor una lista anidada por p\u00e1gina e iDevice pero no gust\u00f3) para la gu\u00eda docente con los recursos pdf+odt usados en el REA extra\u00edda directamente de la informaci\u00f3n del ELP.<\/p>\n<p><a href=\"https:\/\/sourceforge.net\/projects\/exeautomaticresources\/files\/\">eXeAutomaticResources<\/a><\/p>\n<h1>Scripts para la inserci\u00f3n de recursos de forma autom\u00e1tica v1.0<\/h1>\n<p>Buenas, os pongo el enlace para descargar unos scripts escritos en bash para generar el c\u00f3digo e insertar de forma autom\u00e1tica recursos medias en eXeLearning. Esta pensado para trabajar en Linux y con la versi\u00f3n 2.6 para snap (que es la \u00fanica que va de momento en Debian 11). La forma de trabajar es las siguiente:<\/p>\n<p>Crear un archivo (texto plano, con cada campo en un linea) de los recursos que se usar\u00e1n en el REA. Si es local el path relativo hasta el recurso y si es remoto la URL. Al pasarle el script \u00abcreaInfRecu.bash\u00bb esto buscar\u00e1 informaci\u00f3n de cada recursos (si son im\u00e1genes remotas de las p\u00e1ginas permitidas, ir\u00e1 a la p\u00e1gina y se descargar\u00e1 la informaci\u00f3n de dicha imagen) creando otro archivo con la informaci\u00f3n que se le ha pasado y la nueva informaci\u00f3n. Este \u00faltimo archivo se le pasar\u00e1 a \u00abcreaRecu.bash\u00bb (debe ser ejecutado como root, almenos con la versi\u00f3n snap) que para los recursos remotos descargar\u00e1 el recurso y lo almacenar\u00e1 en la carpeta \u00abpreview\u00bb de la ejecuci\u00f3n snap del eXeLearning. Y generar\u00e1 los c\u00f3digos para meterlos como HTML en el iDevice que debe estar abierto al ejecutar el script. De esta forma cuando insertemos el contenido HTML generado cargar\u00e1 en el iDevice el nuevo recurso.<\/p>\n<p><a href=\"https:\/\/sourceforge.net\/projects\/exeautomaticresources\/files\/\">eXeAutomaticResources<\/a><\/p>\n<h1 id=\"mejorasEduccand\">Mejoras al estilo Educaand<\/h1>\n<p>Despu\u00e9s de trabajar con eXeLearning y viendo algunas cosillas que cambiar\u00eda me gustar\u00eda dejarlas indicadas a aqu\u00ed. Esto se aplica a la \u00faltima versi\u00f3n del estilo a fecha de 10 del Octubre de 2021. Me gustar\u00eda comentar que tanto para este estilo como para \u00abudl\u00bb se opta por dos maneras de configurar la p\u00e1gina (men\u00fa lateral o encima&#8230;). Y estas var\u00edan con la anchura (del documento html representado en pantalla, que viene dado, en vista maximiza por la anchura de la pantalla) y con la altura (del documento html incluyendo los posibles desplazamientos del scroll, ya no depener\u00e1 de la pantalla). Lo que a mi parecer es un error, depender en definitiva de la altura del contenido.<\/p>\n<p>La mejor forma encontrada para aplicar dichas modificaciones ha sido, siempre que sea posible, usar opci\u00f3n de propiedades del proyecto eXeLearning, desplegar opciones avanzadas y en el apartado para la cabecera. El c\u00f3digo ser\u00eda el siguiente:<\/p>\n<pre><code style=\"font-size: 0.8em\">&lt;style&gt;\r\n  .udl-btn {border-radius: 5px; font-size: 18pt;}\r\n article.iDevice_wrapper &gt; p.toggle-idevice {display: none;}\r\n section.exe-udlContent-block img.contenido { max-width: 97% !important;margin: 5px;box-sizing: border-box;border-radius: 5px;border: 2px solid black;}\r\n div.iDevice &gt; div.iDevice_content img.contenido { max-width: 95% !important;border-radius: 0.3em; box-shadow: rgba(0, 0, 0, 0.8) 0px 0px 5px; margin: 5px;}\r\n @media (max-width: 500px) { .imagenFloat300 { width: 100%; margin: 5px 0px 10px 0px; } }\r\n div.exe-udlContent-content-block ul { overflow: hidden; }\r\n div.exe-udlContent-content-block ol { overflow: hidden; }\r\n article.exe-udlContent-content-simplified p { margin-bottom: 1em; line-height: 24pt; font-size: 14pt;}\r\n article.exe-udlContent-content-simplified span { margin-bottom: 1em; line-height: 24pt; font-size: 14pt;}\r\n article.exe-udlContent-content-simplified li,ol,ul { margin-bottom: 1em; line-height: 24pt; font-size: 14pt;}\r\n article.exe-udlContent-content-simplified img { margin: 10px;}\r\n .definition-tt {font-weight: bold;}\r\n .dImgTxtCen {display: flex; align-items: center;margin: 5px;}\r\n .imgTxtCen {flex-shrink: 0;}\r\n .iDeviceTitle {top: auto;}\r\n img[style*=\"float: left\"] { margin-right: 10px;margin-bottom: 5px;}\r\n img[style*=\"float:left\"] { margin-right: 10px;margin-bottom: 5px;}\r\n img[style*=\"float: right\"] { margin-left: 10px;margin-bottom: 5px;}\r\n img[style*=\"float:right\"] { margin-left: 10px;margin-bottom: 5px;}\r\n div.tabla-centro {overflow-x: auto; justify-content: center;}\r\n div.tabla {display: table; margin: 0 auto; padding: 0;table-layout: fixed;align-self: center;}\r\n div.tabla-fila {display: table-row; margin: 0; padding: 0;}\r\n div.tabla-celda {display: table-cell; margin: 0; padding: 1px; border: 1px solid #000; text-align: center; vertical-align: middle;}\r\n div.tabla-celdaSinBorde {display: table-cell; margin: 0; padding: 3px; text-align: center; vertical-align: middle;}\r\n div.superindice {display: inline-block; vertical-align: top; position: relative; text-align: center;}\r\n div.creditos {display: flex;align-items: center;justify-content: center;flex-wrap: wrap; font-size: 10pt;}\r\n div.creditos figure {text-align: center;margin: 2px;}\r\n div.creditos img {max-width: 200px !important;max-height: 200px !important;border: 2px solid black;border-radius: 4px;background-color: white;}\r\n div.creditos figcaption {width: 200px;text-align: left;margin: 0 auto;white-space: pre-line; word-wrap: break-word;}\r\n img.diccionario {box-sizing: content-box;border: 1px solid #cc6715;border-radius: 5px;margin-bottom: 10px;background-color: white;}\r\n img.bocadillo {box-sizing: content-box;border: 1px solid #f1d031;border-radius: 5px;background-color: white;}\r\n div.inputResponsive input {width:65% !important;}\r\n div.variasFiguras {text-align: center; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}\r\n&lt;\/style&gt;&gt;<\/code><\/pre>\n<p>&nbsp;<br \/>\nAclaraciones:<\/p>\n<ul>\n<li>udl-btn: es el bot\u00f3n cuadrado de los idevices, hacerlo con las esquinas redondas y que pase la auditoria de accesibilidad.<\/li>\n<li>p.toggle-idevice: es el icono del m\u00e1s que aparece arriba a la derecha del idevice para poder colapsarlo. Lo quito en aquellos idevices que no lleven t\u00edtulo.<\/li>\n<li>img.contenido: clase para las im\u00e1genes del contenido las que ir\u00e1n con marco en un iDevice con T\u00edtulo (marco) y; con marco y sombra en uno sin t\u00edtulo.<\/li>\n<li>imagenFloat300: es una clase usada para im\u00e1genes flotantes (izquierda o derecha) dentro de los idevices. Pensada para im\u00e1genes de un ancho hasta 300px que llevan texto alrededor y cuando se ven en pantallas verticales puede afear el aspecto poniendo el texto discontinuo al no caber. Har\u00e1 que estas ocupen el 100% del ancho. Que el men\u00fa se pueda ocultar o visualizar hace poco \u00fatil tener en cuenta la anchura disponible al ver el men\u00fa lateral.<\/li>\n<li>Las etiquetas html \u00abul\u00bb o \u00abol\u00bb se les a\u00f1ade overflow a hidden para que las vi\u00f1etas no se coman la imagen flotante que haya a la izquierda.<\/li>\n<li>exe-udlContent-content-simplified: configura la lectura facilitada. Letra mayor, mayor interlineado y margen de las im\u00e1genes.<\/li>\n<li>definition-tt: para poner negrita el texto con bocadillo<\/li>\n<li>dImgTxtCen: para emparejar una imagen a la izquierda con un texto a la izquierda. Hay que crear un \u00abdiv\u00bb clase \u00abdImgTxtCen\u00bb y luego poner imagen clase \u00abimgTxtCen\u00bb y el texto como \u00abp\u00bb<\/li>\n<li>iDeviceTitle: para evitar que el texto pise el marco del idevice.<\/li>\n<li>img[style*=\u00bbfloat: left\u00bb] y img[style*=\u00bbfloat: left\u00bb] : para fijar el margen derecho e izquierdo de las im\u00e1genes flotantes a la izquierda y derecha.<\/li>\n<li>div.tabla&#8230;: para poder crear tabla con div de forma f\u00e1cil y homog\u00e9nea.<\/li>\n<li>div.superindice: para poder trabajar con las llevadas (superindices).<\/li>\n<li>div.creditos: para visualizar correctamente los recursos usados en cajas de 200x200px de manera fluida seg\u00fan el ancho de la ventana del navegador.<\/li>\n<li>img.diccionario y img.bocadillo: para modificar el margen de estas im\u00e1genes y ponerle borde redondeado.<\/li>\n<li>div.inputResponsive: caja para hacer responsive los input de las actividades rellena los huecos.<\/li>\n<\/ul>\n<p>Adem\u00e1s hay que se\u00f1alar que para los v\u00eddeos es extremadamente importante a la hora de verlos en pantalla verticales quitar la clase \u00abmediaelement\u00bb de la etiqueta video. O desactivar la pesta\u00f1a de \u00abUse JavaScript player\u00bb. Para que este sea lo m\u00e1s responsive posible.<\/p>\n<p>Y para los geogebra se ha puesto a true obligatoriamente en el estilo. As\u00ed que la opci\u00f3n del editor de actividad geogebra de deshabilitar el autoescalado esa inutilizada. Esto se hace para evitar problemas con los iDevice colapsados. Si no fuera as\u00ed una opci\u00f3n ser\u00eda en la cabecera del elp poner:<\/p>\n<pre><code style=\"font-size: 0.8em\">article.GeoGebraIdevice div.iDevice_inner {padding: 5px 5px;}\r\narticle.GeoGebraIdevice div.block {display: inline-block;}\r\narticle.GeoGebraIdevice div.iDevice_content {overflow: hidden;}<\/code><\/pre>\n<h1>Dise\u00f1o Universal para el Aprendizaje<\/h1>\n<p>Presentar los conceptos partiendo desde varios puntos para permitir que una mayor parte de los estudiantes se pueda enganchar a nuestro itinerario de aprendizaje. Ya que no todos tendr\u00e1n el mismo bagaje cerebral de partida, habr\u00e1 que tener m\u00faltiples formas para motivar al estudiante, representar la informaci\u00f3n y asimilar lo aprendido mediante la expresi\u00f3n (<a href=\"https:\/\/redined.educacion.gob.es\/xmlui\/bitstream\/handle\/11162\/190783\/Alba.pdf\" target=\"_blank\" rel=\"noopener noreferrer\">art\u00edculo<\/a>). Esto en eXeLearning se apoya con la creaci\u00f3n del iDevice DUA (UDL), que permite crear contenido que puede permanecer colapsado (oculto) hasta que el estudiante crea oportuno desplegarlo y mostrar su contenido. Por aquello de no distraer y mantener un contenido limpio (sin mostrar las m\u00faltiples formas todas a la vez) y f\u00e1cilmente accesible adaptable a contexto en el que se encuentra el estudiante en cada momento.<\/p>\n<p>Esto t\u00e9cnicamente tiene un gran inconveniente y es que al ocultar c\u00f3digo de la p\u00e1gina, este no ser\u00e1 accesible desde DOM y a la hora de incrustar c\u00f3digo externo hay problemas para detectar el espacio disponible y es necesario recargar el contenido con el c\u00f3digo visible.<\/p>\n<h1>GeoGebra embebido en eXeLearning<\/h1>\n<p>La idea es poder usar GeoGebra dentro de eXeLearning de forma que no se realicen consultas a internet hacia el servidor de GeoGebra y de esta manera poder usarlo sin conexi\u00f3n a internet.<\/p>\n<p>Para ello, es muy \u00fatil la p\u00e1gina del propio GeoGebra sobre como embeber todo lo necesario en una p\u00e1gina HTML.<\/p>\n<p><a href=\"https:\/\/wiki.geogebra.org\/en\/Reference:GeoGebra_Apps_Embedding\">https:\/\/wiki.geogebra.org\/en\/Reference:GeoGebra_Apps_Embedding<\/a><\/p>\n<p>En ella se explica como es necesario cargar el archivo deployggb.js como script de nuestra p\u00e1gina y adem\u00e1s, las librer\u00edas de las que har\u00e1 uso para visualizar los archivos de los ejercicios de GeoGebra. Estos archivos se pueden descargar, como nos dice en la misma p\u00e1gina, desde:<\/p>\n<p><a href=\"https:\/\/download.geogebra.org\/package\/geogebra-math-apps-bundle\">https:\/\/download.geogebra.org\/package\/geogebra-math-apps-bundle<\/a><\/p>\n<p>Copia local: <a href=\"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/files\/2021\/04\/geogebra-math-apps-bundle-5-0-637-0.zip\">geogebra-math-apps-bundle-5-0-637-0<\/a><\/p>\n<p>En este archivo tenemos la licencia para uso no comercial y una carpeta \u00abGeoGebra\u00bb (para el ejemplo, esta carpeta la renombraremos como \u00abggb\u00bb) que contiene el archivo \u00abdeployggb.js\u00bb y una carpeta \u00abHTML5\u00bb con las librer\u00edas necesarias.<\/p>\n<p>Esto es lo que necesitamos para poder usar GeoGebra en nuestras p\u00e1ginas web sin conexi\u00f3n a internet.<\/p>\n<p>Ahora veremos como se incorporan estos archivos a un ELP de eXeLearning.<\/p>\n<p>En principio eXeLearning no contempla la funci\u00f3n de incorporar archivos a sus ELP. As\u00ed que deber\u00edamos incorporarlos de manera manual. A no ser que se encuentre la manera de \u00abpegar\u00bb esos archivos al ELP de forma que eXeLearning los siga manteniendo cuando se guarde el ELP, se exporte como p\u00e1gina web, etc. Y en este caso se ha encontrado la siguiente forma. El archivo ELP es en realidad un archivo ZIP con los dem\u00e1s archivos necesarios para el ELP. As\u00ed que en principio solo har\u00eda falta a\u00f1adirlos a dicho ZIP que es el ELP. Pero eso no basta para que eXeLearning los mantenga a la hora de guardarlo o exportarlo como p\u00e1gina web. Adem\u00e1s de eso hay que hacer referencia a esos archivos dentro del ELP. La forma que se ha encontrado es hacer referencia al archivo \u00abdeployggb.js\u00bb dentro de la cabecera. La aplicaci\u00f3n eXeLearning permite a\u00f1adir un c\u00f3digo en la cabecera de nuestro ELP en propiedades, con el modo avanzado activo, dentro de opciones avanzadas. Ah\u00ed se pondr\u00e1 el c\u00f3digo:<\/p>\n<p><code>&lt;script src=\"ggb\/deployggb.js\"&gt;&lt;\/script&gt;<br \/>\n<\/code><\/p>\n<p>Como se dice anteriormente se renombrar\u00e1 la carpeta \u00abGeoGebra\u00bb, que encontramos al descomprimir el archivo descargado, con el nombre \u00abggb\u00bb. Dentro de esta, estar\u00e1 el \u00abdeployggb.js\u00bb al que hacemos referencia en el c\u00f3digo.<\/p>\n<p>A continuaci\u00f3n se ir\u00e1 a pie del ELP, para ello entramos en propiedades del ELP,&nbsp; y se a\u00f1adir\u00eda el c\u00f3digo para hacer referencia al archivo del ejercicio de GeoGebra, se indica donde estar\u00e1n las librer\u00edas de GeoGebra localmente y por \u00faltimo se indica donde se quiere representar dicho ejercicio dentro del HTML:<\/p>\n<p><code>&lt;script&gt;<br \/>\nvar params1 = {\"id\":\"app1\",\"width\":800,\"height\":400,\"filename\":\"ggb\/prueba.ggb\"};<br \/>\nvar ggbApplet1 = new GGBApplet(params1, '5.0');<br \/>\nggbApplet1.setHTML5Codebase('ggb\/HTML5\/5.0\/web\/');<br \/>\nwindow.addEventListener(\"load\", function() { ggbApplet1.inject('div-ggb-element1');  });<br \/>\n&lt;\/script&gt;<\/code><\/p>\n<p>Es importante, como podemos ver, al indicar el archivo con el GeoGebra, que se encuentra en la misma carpeta donde esta \u00abdeployggb.js\u00bb. De esta forma la carpeta con los ejercicios y los archivos de GeoGebra llamada \u00abggb\u00bb se \u00abpegar\u00e1\u00bb al ELP y ser\u00e1 mantenida por eXeLearning a la hora de guardar o exportar a p\u00e1gina web.<\/p>\n<p>Adem\u00e1s, es necesario a\u00f1adir el elemento DIV de HTML en el que se inyectar\u00e1 el c\u00f3digo para representar el ejercicio de GeoGebra. En nuestro caso, como podemos ver en el c\u00f3digo anterior ser\u00e1 \u00abdiv-ggb-element1\u00bb. Para ello se insertar\u00e1 en alg\u00fan iDevice como c\u00f3digo HTML el siguiente c\u00f3digo:<\/p>\n<p><code>&lt;div id=\"div-ggb-element1\" style=\"display: inline-block; width: 800px; height: 500px;\"&gt;&lt;\/div&gt;<\/code><\/p>\n<p>Si se quiere tener m\u00e1s de un ejercicio solo habr\u00eda que repetir el c\u00f3digo del pie para el nuevo ejercicio de GeoGebra y poner su DIV correspondiente.<\/p>\n<p>Por \u00faltimo una vez configurado el ELP, se guarda y se le a\u00f1ade, con cualquier herramienta que maneje ZIP,&nbsp; la carpeta \u00abggb\u00bb con los ejercicios de GeoGebra, el archivo \u00abdeployggb.js\u00bb y la carpeta \u00abHTML5\u00bb.<\/p>\n<p>De esta forma, a partir de ese momento al guardar o exportar como web el ELP se mantendr\u00e1n los archivos necesarios.<\/p>\n<p>Los ejercicios de GeoGebra a\u00f1adidos de esta manera no ser\u00e1n visibles en modo edici\u00f3n. Para poder ver dichos ejercicios de GeoGebra en nuestro ELP es necesario abir \u00abVisualizaci\u00f3n previa\u00bb en \u00abUtilidades\u00bb o directamente exportar como carpeta web.<\/p>\n<p>Como ejemplo ten\u00e9is a continuaci\u00f3n un ELP donde se puede ver lo explicado:<\/p>\n<p><a href=\"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/files\/2021\/04\/geo_off_file_udl_elp.zip\">geo_off_file_udl_elp.zip<\/a><\/p>\n<p>Nota: este ELP ha sido creado con el estilo EducAnd de la junta de Andalcu\u00eda y con el iDevice \u00abContenido DUA\u00bb. Se ha comprimido con zip, as\u00ed que antes de usarlo descompr\u00edmelo para obtener el ELP.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>eXeLearning, resumiendo&#8230; Es un programa escrito en python que crea un sistema de ficheros virtual y lo p\u00fablica mediante un servidor web propio. El programa usa ese servidor web como interfaz de usuario donde el usuario puede ver y editar el contenido de un recurso educativo mediante el uso de HTML+CSS y JavaScript. Ese recurso &hellip; <a href=\"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/exelearning\/\" class=\"more-link\">Continuar leyendo<span class=\"screen-reader-text\"> \u00abeXeLearning\u00bb<\/span><\/a><\/p>\n","protected":false},"author":5479,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0,"footnotes":""},"categories":[11910],"tags":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/posts\/156"}],"collection":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/users\/5479"}],"replies":[{"embeddable":true,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/comments?post=156"}],"version-history":[{"count":44,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/posts\/156\/revisions"}],"predecessor-version":[{"id":269,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/posts\/156\/revisions\/269"}],"wp:attachment":[{"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/media?parent=156"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/categories?post=156"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogsaverroes.juntadeandalucia.es\/ismo\/wp-json\/wp\/v2\/tags?post=156"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}