PDF de programación - Moodle 1.9: Editor de texto HTML

MOODLE 1.9

EDITOR DE TEXTO HTML





Unitat de Suport Tecnicopedagògic - CAMPUS EXTENS
Universitat de les Illes Balears. Edifici Aulari. Ctra. de Valldemossa Km. 7.5. 07122 Palma (Illes
Balears)
Primera edició: març de 2010
(Versió de Moodle: 1.9)



Aquesta obra està subjecta a una llicència CC - Reconeixement-
No comercial-Sense obres derivades 3.0



<http://creativecommons.org/licenses/by-nc-nd/3.0/es/deed.ca>




EDITOR DE TEXTO HTML

La mayoría de áreas para introducir texto (recursos, mensajes de los foros,
etc.) en Moodle tienen el editor HTML. Éste es un editor gráfico de texto HTML.
Es la manera habitual de trabajar de los procesadores de textos más conocidos
(Word, Corel, WordPerfect, etc.).

Aunque no lo parezca, el texto que introducimos en cualquier lugar de Moodle
es texto plano con marcas HTML. Este editor es una manera cómoda de
maquetar este texto HTML para la web, sin necesidad de conocer ni dominar
este lenguaje.

Además de crear el texto directamente en el editor, también permite copiar y
pegar texto con formatos y estructuras a partir de documentos generados en un
procesador de texto habitual.


Interfície del editor

Cuando el editor de HTML está activo aparece una barra de herramientas en la
parte superior del cuadro de introducción de texto. Si esta barra no aparece es
que el editor no está disponible. La barra de herramientas dispone de los
botones clásicos de cualquier procesador de texto para dar formato al texto
(negrita, cursiva, subrayado, alineación a la derecha, izquierda, centrado,
sangrar, crear listas, etc.).



A continuación explicaremos algunas funciones que sirven para insertar
elementos especiales:



Selección de colores (letra y fondo)

Estos botones activan una paleta de
selección de colores que aparecen en una
nueva ventana. Se tiene que hacer clic en
el botón que nos interesa (o escribir el
código HTML) y la ventana se cerrará
automáticamente aplicando el color a la
selección o a todo el texto, si no había
nada seleccionado.



Insertar una línea horizontal de separación


Crear marcador
Permite establecer vínculos que nos llevan a diferentes partes o
secciones de la página dónde nos encontramos. Posibilita la
navegación dentro de una página.


Insertar enlaces o vínculos


Para crear un vínculo en el documento que creamos, se tienen que

seguir los siguientes pasos:


1. Seleccionar el texto que tiene que servir de enlace.
2. Hacer clic en el botón Insertar un enlace web y aparecerá un

cuadro de diálego como el seguiente:



En este cuadro de diálogo tendremos que introducir los datos que
nos solicita. Tenemos dos opciones:


a. Hacer un enlace a una página web externa. En este
la URL

caso simplemente
completa en el campo de texto indicado para eso.

tenemos que escribir

b. Hacer un enlace a un documento nuestro y que está
subido al servidor. En este caso, tenemos de hacer clic

en el botón Navega. Se abrirá la ventana del gestor de
ficheros y tendremos que elegir el archivo que nos
interese.



Para seleccionar el archivo que nos interesa tenemos
que hacer clic encima del nombre del archivo y
automáticamente esta ventana se cerrará.
En el caso que no tengamos el archivo subido en el
servidor, lo podemos subir haciendo clic en el botón
Examinar, de manera que se nos abrirá una ventana
por tal de poder seleccionar el archivo que queremos
subir de nuestro ordenador. Una vez seleccionado
haremos clic en el botón Sube.


3. En el campo de texto correspondiente a Título tenemos que
poner el texto alternativo que aparecerá cuando pasemos el
ratón por encima del enlace.


4. Este paso ya es opcional. Seleccionar en el menú desplegable
Objetivo, dónde queremos que se vea este enlace. Las
opciones que nos ofrecen son:
o Ninguno: por defecto se abrirá en el mismo marco.
o Ventana nueva: la página vinculada se abrirá en una
o El mismo marco: se abrirá en el marco donde se encuentra
o La misma ventana: se abrirá en la misma ventana de

la página origen, donde hemos creado el vínculo.

ventana nueva del navegador.

manera que desaparecerá toda referencia a Moodle.



5. Este paso se haría en el caso que el vínculo se haga con un
marcador, es decir, con una parte o sección de la página
donde nos encontramos. En el menú desplegable Áncoras
aparecen el nombre de los distintos marcadores o áncoras
que hemos
tenemos que
seleccionar aquella que nos interese.


insertado en esta página, y

Suprimir enlace
Elimina

los vínculos a otras páginas. Primero se

tiene que
seleccionar el vínculo que queremos suprimir y después hacer clic en
el botón Suprime enlace.


Impedir enlaces automáticos


Una de las posibilidades de Moodle es que se creen enlaces
automáticos en los términos definidos en los glosarios. Si no nos
interesara que esto se haga en la página que estamos creando,
tendríamos que hacer clic en el botón Impedir enlaces automáticos.


Inserta una imagen


Permite insertar una imagen en el texto que creamos. Tenemos que
tener en cuenta que, en un documento web, las imágenes no son
realmente insertadas, sino que lo que se hace es insertar un vinculo
en el archivo de la imagen. Este archivo tiene que estar subido al
servidor previamente.

Cuando hacemos clic en el botón Inserta una imagen se abrirá un
cuadro de diálogo que permitirá seleccionar el fichero de la imagen.





Utilizando el Explorador de ficheros podremos buscar la imagen que
queremos insertar. Si hacemos clic sobre el nombre de archivo,
podremos visualizar la imagen.

En el caso que no tengamos la imagen subida al servidor, podemos
usar el botón Examinar, que nos permitirá acceder al disco duro de
nuestro ordenador, seleccionar el fichero que queremos subir y, una
vez seleccionada, hacer clic en el botón Sube.

Cuando selecciona la imagen, automáticamente se escribirá la URL
dónde se encuentra el archivo dentro de nuestro servidor en el
campo de texto URL de la imagen. Es imprescindible poner un texto
alternativo, que es el que saldrá cuando pongamos el cursor sobre la
imagen. Para acabar solo hace falta hacer clic en el botón De
acuerdo.

Una de las posibilidades que permite este cuadro de diálogo es la de
gestionar los ficheros desde el Explorador de ficheros. Nos permite
suprimir, mover, comprimir y cambiar el nombre de los ficheros que,
previamente, habremos seleccionado marcando el cuadro que se
encuentra a la izquierda del nombre del fichero.

Para hacer modificaciones o cambiar cualquier atributo de la imagen

una vez que se ha insertado en la página web, se tiene que
seleccionar la imagen en el editor con el ratón y después hacer clic
sobre el botón Inserta una imagen. Se volverá a abrir el cuadro de
diálogo.


Inserta una tabla


Este botón nos permite insertar una taula HTML en el texto. Cuando
clicamos, aparecerá un pequeño cuadro de diálogo dónde se podrán
especificar las características de la tabla: nombre de filas y columnas
y el ancho total.



En el formato podemos definir la alineación y el grueso del contorno
de la tabla si nos interesa que tenga, sino podemos poner 0 y el
contorno no se verá. En el espaciado, podremos especificar el
espacio que queremos entre celdas y la separación entre el texto y el
contorno.

Para facilitar la tarea de editar una tabla, el editor dispone de una
barra de herramientas específica para el manejo de tablas. Esta
barra está disponible sólo en el editor de HTML en pantalla completa
que aparece cuando hagamos clic en el botón Amplía el editor.







Inserta un carácter especial


Este botón posibilita insertar caracteres especiales. Cuando hacemos
clic, se abre una paleta con el juego de caracteres que utilizamos en
este momento en el navegador. Esto quiere decir que no está
garantizado que otros usuarios vean el mismo carácter que hemos
puesto si no tienen el mismo juego de caracteres.



El proceso es muy sencillo, hacer clic en el carácter que nos interese
y automáticamente se cerrará la paleta.



Buscar y reemplazar
Permite buscar y reemplazar cualquier texto de la página.



Limpieza el HTML del Word
Este botón permite limpiar el código HTML que se ha generado
cuando hemos pegado un fragmento de texto. Está el inconveniente
que, aplicando esta función, puede ocurrir que se pierdan formatos
aplicados al texto (negritas, cursivas...) que se habían preestablecido
en el texto creado en un procesador de texto.

Conmuta con fuente HTML
Como hemos dicho anteriormente, este editor lo que hace es generar
código HTML. Podemos usar este botón para visualizar el código
HTML y editarlo manualmente.


Amplia el editor
Este botón permite activar el editor a pantalla completa. Se abrirá
una nueva ventana del navegador que solo tendrá el editor. Así
podemos trabajar más cómodamente si tenemos que introducir gran
cantidad de texto.


Durante el tiempo que usamos el editor de forma ampliada, el cuadro
de texto original queda inactivo. Para cerrar la ventana haremos clic
en el botón Minimizar el editor

.