Archivo del autor

ATE [ecoescuela]

ecoescuela 2.0 es un entorno de trabajo cooperativo y colaborativo que reconduce los procesos tradicionales de profesorado de "Enseñar" y de "Aprender" del alumnado a un nuevo modelo en el que cambia el rol del Profesorado "enseña" y del alumnado (aprende o memoriza) a otro en el que se reinventan y RECREAN los procesos de enseñar y aprender en el que ambos APRENDEN A APRENDER.

Incrustar un archivo pdf mediante el sistema oEmbeb

Insertar un archivo *.pdf subiéndolo a librería multimedia de nuestro blog:

  • Subir el archivo a nuestro blog y situar un enlace al mismo en una entrada.
    • Buscaremos el archivo en nuestro ordenador. Los procesadores de texto y los programas de presentaciones están incorporando la funcionalidad de guardar los archivos en formato .pdf.
    • En el menú lateral izquierda del Escritorio del panel de administración de nuestro blog en WordPress elegiremos la opción Entradas → Añadir nueva 12-03-2014 10-32-17
  • Introducimos un título y un texto.
  • Pulsamos sobre Subir/Insertar, localizamos el archivo en nuestro equipo y arrastramos a la zona de subida de archivos. También podremos utilizar el botón de Elegir Archivos y explorar de forma tradicional [Se permite subir distintos tipos de archivos: imágenes (*.jpg/*.jpeg, *.png y *.gif), documentos PDF (*.pdf), documentos de Word (*.doc y *.docx), presentaciones de Powerpoint (*.ppt, *.pptx, *.pps y *.ppsx), hojas de Exce (*.xls, *.xlsx) y documentos de OpenOffice (*.odt)]. 27-02-2014 14-32-05
  • Cuando se produce con éxito la subida en la parte inferior de este panel se muestran los datos del archivo subido. Introduce un título significativo al documento. Por ejemplo: «Catálogo de Teleformación». Luego pulsaremos sobre «Insertar en la entrada»: 12-03-2014 9-37-17
  • De regreso al editor de la entrada veremos que se ha insertado un enlace con el título al archivo que hemos subido a nuestra librería.
  • Para terminar pulsa en el botón Publicar.

  • Para visualizar el aspecto del artículo haz clic en el botón Ver entrada.

  • Subir el archivo .pdf a nuestro blog y visualizarlo en la propia entrada.
    • Buscaremos el archivo en nuestro ordenador igual que hicimos anteriormente.
    • En el menú lateral izquierda del Escritorio del panel de administración de nuestro blog en WordPress elegiremos la opción Entradas à Añadir nueva 12-03-2014 10-32-17
  • Introducimos un título y un texto.
  • Pulsamos sobre Subir/Insertar, localizamos el archivo en nuestro equipo y arrastramos a la zona de subida de archivos. También podremos utilizar el botón de Elegir Archivos y explorar de forma tradicional. 27-02-2014 14-32-05
  • Cuando se produce con éxito la subida en la parte inferior de este panel se muestran los datos del archivo subido. Introduciremos los datos del archivo. Seleccionaremos la URL del enlace y haremos clic derecho para elegir la opción Copiar. 12-03-2014 9-37-17
  • Para cerrar este panel haz clic en el aspa «x» de la esquina superior derecha o haz clic fuera de este panel.
  • Regresaremos al editor de la entrada y pegaremos la URL en una línea. Nos fijaremos de que está en una línea sola y de que no tiene ningún hipervínculo.
  • Para terminar pulsa en el botón Publicar.
  • Para visualizar el aspecto de la entrada haremos clic en el botón «Ver entrada».

 Insertar un archivo *.pdf que se encuentre en otra página Web:

Si queremos embeber un documento pdf que ya está alojado en otro servidor o página de internet no haría falta subirlo a nuestra galería multimedia. Si tenemos la dirección URL del archivo WordPress hará el resto. Para ello localizaremos el archivo pdf directamente en la web lo abriremos y copiaremos la dirección URL que aparece en el explorador. Luego la incrustaremos en la entrada que estamos creando a través del método oEmbed. Recordamos los pasos:
  • Crearemos una nueva entrada por el método que hemos practicado. Le pondremos un título y un texto explicativo.
  • Iremos a la página en donde está el documento que nos interesa insertar en nuestro blog y copiamos la dirección URL donde se encuentra el documento.
  • Regresaremos al editor de la entrada. Pegaremos la dirección URL en el lugar del editor visual de la entrada en donde nos interesa que se visualice el documento. Nos fijaremos de que está en una línea sola y de que no tiene ningún hipervínculo. La dirección sería algo parecido a esto:
  • Para terminar pulsa en el botón Publicar.

Para visualizar el aspecto de la entrada haremos clic en el botón «Ver entrada».

Incrustar un vídeo con oEmbeb

Hemos visto que ahora puede resultar un poco más sencillo incrustar vídeos de YouTube en nuestro Blog de eco escuela 2.0. Todo lo que necesitamos hacer para integrarlo en una entrada o una página es escribir la dirección URL del vídeo en el editor de contenido de la entrada o la página. Asegurándonos de que la dirección está en una sola línea y de que no hemos creado un hipervínculo.
  • Primero localizaremos el vídeo en YouTube y copiamos la dirección URL que aparece en el explorador o también si buscamos el botón compartir que nos ofrece YouTube veremos que nos ofrece una dirección corta especial para este sistema de embebido.
  • Copiaremos la dirección al portapapeles (ctrl+c).
  • Pegaremos la dirección en el editor de texto de la entrada o de la página fijándonos de que está en una línea independiente (ctrl+v):
  • Para finalizar haremos clic sobre Publicar o sobre vista previa para ver el resultado.
Recordar que para que funcione debe de estar marcada la casilla de verificación «Auto-incrustados» casilla en el escritorio de WordPress: Ajustes > Multimedia. Podemos optar por utilizar la visión HTML del editor de la entrada y pegar la dirección con el siguiente código que permite embeber controlando la altura y la anchura con la que se visualiza en vídeo.

Incrustar o embeber contenido (oEmbeb en WordPress)

Insertar código embebido (etiquetas object e iframe) en todos los blogs de ecoescuela

Ha sido abierta la funcionalidad de insertar código embebido (etiquetas object e iframe) en todos los blogs de ecoescuela. Esta posibilidad, que ya estaba operativa en blog de los Centros (edublogs), ahora se ha abierto para el blog del profesorado (ecoblog) y del aula (aulablog – próximamente disponibles). Pero recuerden, sólo usuarios con perfil de administrador (cada uno de los profes en su propio blog personal) y los editores pueden embeber código en entradas, páginas y widgets de texto, tal como venía sucediendo en blogs/web de los Centros, el resto de usuarios (autores, y suscriptores) lo deben hacer por el método oembed).

¿Qué es oEmbeb?

oEmbeb es un sistema, integrado en WordPress, mediante el cual puedes visualizar contenido multimedia solo con añadir la URL en el editor de texto de WordPress.

Imagen sacada de: http://ayudawordpress.com/insertar-slideshare-con-oembed/

WordPress es una herramienta en constante evolución y en cada una de sus nuevas versiones incorpora mejoras que afectan tanto a la seguridad como a la ergonomía y facilidad de uso. En la última versión de WordPress se ha desarrollado una nueva forma de incrustar vídeos, imágenes y otros contenidos en el blog que tratan de facilitarnos la tarea. Ahora ya no es necesario localizar el código de embeber contenido que se utilizaba en algunas de las herramientas de la Web 2.0 que nos permiten compartir contenido multimedia.

oEmbed

La inserción de contenidos en nuestro blog se ha tratado de simplificar, sobre todo, si se realiza con oEmbed, un protocolo para que el sitio A (como tu Blog del profesorado o el blog de centro) haga una petición al sitio B (como YouTube) para obtener el código HTML (la dirección URL) necesario para integrar el contenido del sitio A (en este caso sería un vídeo) en el sitio B. oEmbed fue diseñado para evitar el tener que copiar y pegar el código HTML del sitio de alojamiento de los medios de comunicación que deseamos incrustar y en lugar del mismo utilizar únicamente la dirección URL del sitio. Es compatible con vídeos, imágenes, texto, y mucho más.

¿Se puede usar cualquier tipo de dirección con el sistema oEmbeb?

Por defecto, no.

Su Blog del profesorado o blog del centro (WordPress) sólo reconocerá e integra aquellas URLs que coincidan con una lista blanca interna. Esto se hace así por motivos de seguridad.

¿Qué sitios puedo incrustar copiándola dirección?

Puede utilizar todos estos que pertenecen a la lista blanca:

¿Cómo puedo añadir soporte para más sitios web?

Para poder añadir soporte para un sitio web adicional que no se encuentra en la lista que hemos mencionado habría que revisar si el sitio es compatible con oEmbed o no. Si un sitio es compatible con oEmbed, para agregar el formato del sitio y la URL a la lista blanca interna, debe ponerse en contacto con los administradores de Blogs de los Centros a través e una incidencia a Cibercentro, para que estos lo estudien y registren.

  • A través de este método, ya se ha creado soporte para Issuu, SlideShare, Scribd y pdf. Pues de forma predeterminada, sólo se puede integrar en sitios web que se enumeran en la lista blanca interna. Esto es para evitar incrustación accidental desde sitios web maliciosos.

¿Cómo funciona oEmbeb?

Todo lo que se necesitamos hacer para integrar algún contenido multimedia en una entrada o una página es escribir la dirección URL en el editor de contenido de la entrada o página. Asegúrese de que la dirección está en una sola línea y no es un hipervínculo.

Por ejemplo: Para insertar un vídeo de YouTube con el editor visual pondríamos únicamente la dirección (ojo tiene que estar en una línea independiente y no puede estar centrado):
http://www.youtube.com/watch?v=_AjpeInA5wQ
Su Blog (WordPress) de forma automática integrará en la noticia este vídeo que está alojado en YouTube cuando se visualiza la entrada. A continuación lo vemos en el ejemplo: En caso de error: En caso de visualizar la notica y observar que no funciona el vídeo que acabos de embeber haremos varias revisiones rutinarias:
  • Que el código está escrito en una sola línea y no tiene ningún código delante o detrás que impida a WordPress reconocerlo, en caso de duda podemos cambiar la modo HTML y visualizarlo desde allí. En la imagen vemos algunos ejemplos de lo que nos puede pasar:

Podemos utilizar oEmbeb con la visión HTML

Para aquellos usuarios que se sientan más a gusto con el editor «Texto» 12-03-2014 10-29-02 pueden optar por utilizar la URL en el código abreviado . Se logrará el mismo efecto, pero no requiere la dirección que en una única línea ni la casilla de «Auto-incrustado» habilitada. También nos permite controlar las dimensiones y establecer un máximo (pero no fijo) ancho y alto. En el ejemplo siguiente veremos como se puede hacer: Ajustando sólo anchura:

<

Ajustando la anchura y altura: En los casos en que WordPress por algún motivo no puede integrar la URL obtendrá un hipervínculo a la dirección.

Añadir ficheros y archivos a nuestra entrada

Cuando estamos creando nuestra entrada o una vez que ya la tenemos creada y la modificamos, podemos añadirle ficheros y archivos. Observaremos que WordPress no gestiona igual todos los archivos. Existen algunos que se pueden mostrar incrustados dentro de la entrada. Esto se hará en aquellos casos en los que se trate de archivos que WordPress reconozca y pueda embeber:
  • Subidos a la librería multimedia: fotos, imágenes, gifs animados, documentos .pdf, archivos de sonido en MP3,
  • Mediante el método oEmbeb. Se trata de contenido embebido o incrustado de la Web 2.0 como vídeos de YouTube o Vimeo, presentaciones de SlideShare, Prezi, Issuu, archivos de sonido, .pdf,…
Existen otro tipo de archivos que al no poder ser reproducidos por WordPress no pueden ser mostrados dentro de la noticia y por tanto se creará un enlace a los mismos para que puedan ser descargados o abiertos por el explorador:
  • Subidos a la librería multimedia: documentos de texto, presentaciones, vídeos,…
Hemos visto que no todos los archivos que subimos a nuestro blog se comportan y se muestran de la misma manera. Hay algunos que tienen un uso más habitual y que por tanto WordPress los reconoce y aquellos que tienen un uso menos acorde a la filosofía de los blogs los incrusta preferentemente a través de las herramientas de la Web 2.0.

A pesar de todo, no queremos dar una imagen poco exacta y nos gustaría aclarar que existen plugins que permiten cambiar las condiciones de funcionamiento de WordPress y algunos archivos que hoy no son soportados por la herramienta podrían ser reconocidos en el futuro.

¿Cómo podemos añadir un archivo en nuestra entrada?

Veremos que la forma de subir archivos o ficheros a nuestro blog se hace siempre de la misma manera. Por lo tanto lo que hemos visto en el apartado de insertar imágenes nos servirá perfectamente para añadir otro tipo de archivos.

Una vez que tenemos la imagen insertada, si pulsamos sobre ella nos aparecerán dos iconos.

El botón con el paisaje, «editar imagen«, que aparece sobre la imagen que vemos en el editor nos permitirá modificar el tamaño, alineación, título, enlace…, es decir, los parámetros que anteriormente le hemos dado a la imagen. El botón de «eliminar imagen« borrará la imagen de la entrada, pero no del servidor (permanecerá en la librería multimedia y asociada a la entrada desde donde la subimos). Otro ejemplo sería la inclusión de un vídeo a nuestra entrada. Podemos enlazar a un vídeo de YouTube pulsando el botón «Add External Media«y rellenaremos el campo Media URL y finalmente pulsaremos el botón Add to library. 12-03-2014 9-22-19 Otro sistema para insertar un video será utilizando el método oEmbeb que veremos con detalle más adelante y que simplemente consiste en copiar su URL en la entrada, así cuando lo visualicemos en lugar de aparecer un enlace al video, nos aparecerá el recuadro del video, donde podremos visualizarlo e interactuar con el directamente.

Modificar el estado y el contenido de una entrada

Existen muchas ocasiones en las que una vez publicada una entrada nos surgirá la necesidad de hacer modificaciones en la misma, para realizar cambios o correcciones, para introducir más información, para modificar y cambiar el estado de la misma, para alterar las fechas de publicación, para modificar las categorías, las etiquetas,… en este epígrafe haremos un repaso de los pasos a seguir para introducir modificaciones en nuestras entradas.  

Modificar el contenido de una entrada

Existen distintos procedimientos alternativos para modificar un artículo ya existente. Para poder transformar una entrada tendremos que estar autentificados con nuestras credenciales y además nuestro usuario deberá de poseer los permisos necesarios para ello. WordPress nos facilitará estas acciones y para ello pone a nuestra disposición diferentes accesos. A continuación comentaremos algunos: Desde el modo de edición. En el Escritorio del panel de administración de WordPress haremos clic en el enlace Entradas:

También podremos acceder desde el menú lateral del panel de administración del blog haciendo clic en el subpanel de Entradas à Todas las entradas.

Desde el modo visual. Cuando navegamos por nuestro blog y previamente nos hemos autentificado como administrador o editor del mismo, dependiendo del estilo definido en el tema de nuestro blog, en cada artículo publicado se mostrará un botón o enlace «Editar» para modificar esa entrada directamente.

Si hemos seguido los dos primeros métodos, es decir buscamos la entrada dese el escritorio del panel de administración de nuestro blog, accederemos a todo el listado de artículos del blog. Buscaremos la entrada que nos interesa editar y haremos clic en el enlace Editar de la entrada correspondiente para acceder a su edición. También podremos hacer un simple clic sobre el enlace situado en el titulo de la Entrada.

En el caso de que el listado de entradas sea muy numeroso, para facilitar la localización del artículo a editar se puede filtrar por fechas, por categorías, etc. Otra opción es realizar una búsqueda por un término que se introduce en la casilla Buscar entradas. También es posible pulsar en el enlace Todos, Borradores, Pendientes de revisión y Publicadas según su estado de publicación.

Cuando localicemos la entrada se abrirá la misma en el modo de edición.

Realizaremos los cambios oportunos en el contenido del artículo y para guardar los cambios pulsaremos en el botón Actualizar (si el artículo ya está publicado) o bien en Guardar borrador (si el artículo está pendiente de publicación).

 

Estados de publicación

Cuando creamos una entrada podremos decidir el estado en el que la hacemos o no visible. Esta función se llama estado de publicación. Podremos alterar el estado de una entrada siempre que nos parezca oportuno. Repasaremos a continuación la clasificación de los diferentes estados de una entrada:
  • Borradores. Son las entradas que no están publicadas. No son visibles para todo el mundo desde la Web, bien porque no se han terminado todavía o bien porque se ha decidido despublicarlas.
  • Pendientes de revisión. La entrada está pendiente de revisión por parte de un usuario gestor del blog con capacidad para editarlo y publicarlo.
  • Publicadas. Son las entradas visibles por los lectores.
  • Programado. No es un estilo definido en WordPress pero se corresponde con una entrada publicada en una fecha posterior a la actual. Se visualizará nuestro blog cuando se alcance la fecha y hora definidas.
 

Eliminar un artículo

En muchas ocasiones necesitaremos borrar alguna entrada de nuestro blog, aunque no esté visible, pues la hemos puesto como borrador puede interesarnos quitarla del listado de entradas. Para eliminar un artículo desde el panel del listado de entradas existen varios procedimientos alternativos.
  • En la entrada que deseamos eliminar haremos clic en el enlace Papelera.
  • También podremos marcar la casilla de verificación de la entrada que nos interesa eliminar y en la lista desplegable «Acciones en lote» elegiremos la opción «Mover a la papelera» y finalmente pulsaremos sobre el botón Aplicar.
Cuando se envía una entrada a la papelera ésta se puede recuperar posteriormente. Se accede a las entradas situadas en la papelera.

Una vez localizada la entrada en la papelera podremos restaurarla o borrarla permanentemente.

Publicar y despublicar

Una vez que se ha publicado una entrada se puede volver a despublicar para que no sea visible por los lectores del blog. El procedimiento pasaría por convertirla en borrador y a continuación repasaremos los pasos a seguir:
  • Accede al listado de entradas del interfaz de administración mediante el subpanel de Entradas à Todas las entradas.
  • Haz clic en el enlace situado en el título de la entrada en la lista.
  • Desde la edición de la entrada, en el panel o caja de Publicar situado a la derecha, haz clic en el enlace Editar que acompaña al Estado: Publicada.

  • En la lista desplegable elige la opción Borrador y pulsa en el botón Aceptar.

  • Se puede publicar un borrador durante su edición pulsando en el botón Publicar o bien modificando su Estado siguiendo un procedimiento similar al descrito para pasarlo a Borrador.
  • Para terminar haz clic en el botón azul Actualizar.

Incrustar contenido multimedia

En este tema exploraremos como podemos compartir archivos en nuestro blog. Una de las características principales que nos han traído los últimos avances tecnológicos es la facilidad para compartir contenidos digitales y multimedia a través de la red y de las redes. Cuando comencemos a publicar entradas en nuestro blog o en el blog de nuestro centro tendremos la necesidad de usar contenidos multimedia y por tanto es interesante explorar algunas de las posibilidades que nos ofrece WordPress para hacerlo. Además, también tendremos la necesidad de compartir diferentes tipos de archivos y también será bueno explorar cuales son es la mejor forma de compartirlos. Sabemos que los blogs institucionales serán gestionados por la persona o personas que se hagan responsables del mismo mediante la correspondiente solicitud y por tanto serán los encargados de hacer un buen aprovechamiento del servicio. Cuando subimos archivos e imágenes a nuestro blog tendremos que tener en cuenta el espacio del que disponemos en el mismo. El blog no funciona como un repositorio de recursos, por lo que no se dispondrá de un espacio indefinido para la subida de archivos. Aunque nos permite adjuntar imágenes y archivos que se gestionarán desde la librería multimedia (algunos se harán visibles dentro del blog y otros serán enlazados) deberemos tomar conciencia de cuales son aquellos archivos que nos interesa guardar en un servidor seguro (el que nos ofrece la Consejería) y cuales podremos subir a los repositorios que nos facilita la Web 2.0. Al igual que hacíamos con las imágenes, en el tema 1, tendremos que decidir que tipo de archivos subimos y almacenamos en la librería multimedia de nuestro blog y cuales subimos a otros repositorios para compartirlos desde ellos. La gran mayoría de la información que compartimos no es sensible de ser privada, por lo que podremos enlazarla e incrustarla en nuestro blog desde los repositorios y herramientas de la Web 2.0 como YouTube, SlideShare, Vimeo, Flickr, Issuu, Slide, Picasa, Prezi,… En ciertas ocasiones nos surgirá la necesidad de compartir documentos institucionales, imágenes o producciones del alumnado (siempre con los correspondientes permisos) y no nos interesará mucho subirlos a espacios que no están muy controlados y que se nos pueden quedar con los derechos de esos archivos subidos. Es en estos casos, es donde cobra especial relevancia el espacio de nuestro blog institucional porque los archivos que subamos al mismo sabemos que no se aloja en servidores externos y por tanto podremos usar las medidas de privacidad que nos ofrece WordPress con total tranquilidad. Hagamos una reflexión a modo de ejemplo: Tengo 20 vídeos realizados con mi alumnado haciendo diferentes observaciones o actividades y quiero compartirlos. Opto por compartirlos a través de mi blog personal o a través del blog del centro pero tengo que decidir donde los subo. Puedo crear un canal en YouTube o Vimeo subirlos y embeberlos en mi blog con lo que se verán perfectamente incrustados en la entrada. La otra opción es la de subirlos directamente a la librería multimedia de mi blog en donde se creará un enlace para ser descargados y es posible que me quede sin espacio para poder subir otro contenido. En algunos casos podremos encontrarnos con cierto tipo de archivos o vídeos que por sus características no me interesa subirlos a ningún repositorio externo (salen imágenes que no me interesa poner en YouTube o Vimeo, contienen contenido privado,…). Este tipo de archivos son los que son susceptibles de ser subidos al blog institucional configurando la entrada como privada o protegida por contraseña para que no pueda acceder todo el mundo. En estos casos si es interesante subir el archivo a la librería multimedia e insertarlo en la noticia desde ella.

Escritura libre de distracción

Escribir es una tarea que requiere concentración y más si lo que vamos a escribir tiene una trascendencia pública. Hay mucho que pensar y tener en cuenta cuando se escribe, y las distracciones constantes pueden hacerlo más complicado. Si tenemos la sensación de que todas las opciones en la pantalla de escritura de WordPress nos impiden centrarnos en la tarea a realizar, deberíamos probar la escritura libre de distracciones. Se esconderán todas las opciones que puede interponerse en el camino de nuestra escritura, y nos ayudará a mantenernos concentrados en lo que estamos haciendo.

Activando la escritura libre de distracciones

Para activar el modo de escritura libre de distracciones, haremos clic en el botón «Cambiar a modo de pantalla completa» en la barra de herramientas (que es el segundo botón de la derecha, en la primera fila), o utiliza el atajo de teclado Alt+Shift+G.

Al conectar por primera vez la escritura libre de distracciones, veremos que nuestro escritorio se transforma de forma minimalista y que solo se quedará visible una barra de herramientas formado con los iconos más utilizados, un recuadro para el título y otro para el contenido de su mensaje (o página). Todo funciona como lo hace en el Editor Visual y se puede utilizar la barra de herramientas o los atajos de teclado para añadir enlaces, imágenes, etc.

Pero, la verdadera magia comienza a suceder cuando soltamos el ratón y empezamos a escribir. La barra de herramientas, los iconos, los pocos textos que nos muestran ayudas de escritura así como las fronteras que enmarcan toda el área de escritura se diluyen. Todo desaparece para dejar paso tan sólo a las palabras. Al empezar a escribir, se desvanece todo. No hay distracciones. Para utilizar la barra de herramientas o comprobar el número de palabras, basta con mover el ratón o acercarlo a la parte superior de la pantalla. Para volver a la pantalla de edición normal haremos clic en «Salir de pantalla completa«.

Modo de pantalla completa con la escritura libre de distracciones

Para llevar el modo de escritura libre de distracciones hasta el límite, Firefox y Chrome tienen una característica incorporada a pantalla completa que hace que la página actual ocupe toda la pantalla (al igual que la mayoría de los navegadores). Con la escritura libre de distracciones, esto significa que el título y el contenido del mensaje o la página que estamos trabajando serán las únicas cosas que veremos. Con el  Guardado automático ni siquiera tendríamos que preocuparnos de guardar lo que acabamos de escribir. Para activar la pantalla completa en Firefox y Chrome, iremos a Ver → Pantalla completa, o usar el atajo de teclado Ctrl+Shift+F (en Windows) o Comando+Mayúsculas+F (en Mac). Para desactivar la pantalla completa, utilizaremos el método abreviado de teclado o moveremos el ratón a la parte superior de la pantalla para revelar el menú. Tenga en cuenta que podremos utilizar esto en cualquier momento, es decir, es independiente de la escritura libre de distracciones.

¿Puedo utilizar la escritura libre de distracciones con el editor de HTML?

Haremos clic en pantalla completa en el editor de HTML para cambiar a la escritura libre de distracciones.

También podremos cambiar entre la edición visual y edición de HTML dentro de la escritura libre de distracciones con los botones Visual y HTML en la barra de herramientas (mueve el ratón, si no puedes ver la barra de herramientas – se oculta automáticamente cuando se escribe). Ver la entrada editores para obtener más información sobre los editores de HTML y visual.

Cómo crear enlaces o hipervínculos dentro de una entrada

Este capítulo está diseñado para ayudarles a introducir enlaces o hipervínculos en nuestras entradas. El lenguaje con hipervínculos es una de las características fundamentales de la Web 2.0, en la medida que vamos leyendo podremos poner enlaces a palabras de nuestro texto para ampliar la información de la noticia que estamos escribiendo. Hay un par de maneras de añadir enlaces a tus entradas o páginas. Podremos utilizar el editor visual o el editor de HTML.

Pasos a seguir para crear un hipervínculo con el editor visual

  • Resaltar el texto que deseamos vincular y cerciorarse de que tenemos seleccionado el editor Visual.
  • Hacer clic en el enlace de la barra de herramientas del editor de texto: «Insertar / Editar Enlace» .

  • En el menú emergente que aparece, introducir la dirección URL a la que se desee establecer el vínculo. Si desea que el enlace se abra en una nueva ventana/pestaña al hacer clic, marcar la casilla «Abrir enlace en una nueva ventana pestaña».

  • Título (opcional) – El título del enlace se hace visible cuando un visitante se cierne sobre el hipervínculo (un texto de ayuda, a modo de nota breve, aparecerá con el título).
  • Hacer clic sobre Añadir enlace
 

Pasos a seguir para crear un hipervínculo con el editor HTML

  • Resaltar el texto que deseamos vincular y fijarse de que tenemos activado el editor HTML.
  • Hacer clic en el enlace de la barra de herramientas: «link» .

  • En el menú emergente que aparece, introducir la dirección URL a la que se desee establecer el vínculo. Si desea que el enlace se abra en una nueva ventana/pestaña al hacer clic, marcar la casilla «Abrir enlace en una nueva ventana pestaña».

  • Título (opcional) – El título del enlace se hace visible cuando un visitante se cierne sobre el hipervínculo (un texto de ayuda, a modo de nota breve, aparecerá con el título).
  • Finalmente hacer clic sobre Añadir enlace
 

Pasos a seguir para crear un enlace o hipervínculo a un lugar del propio blog

  • Resaltar el texto que deseamos vincular.
  • Hacer clic en el enlace de la barra de herramientas: «Insertar / Editar Enlace» si estamos en modo Visual o «link» si estamos en modo HTML.
  • Si en lugar de enlazar a una web se desea vincular a uno de los propios mensajes o páginas que ya están subidos en el blog, utilizar el cuadro de búsqueda para encontrar rápidamente lo que se está buscando. Basta con introducir una o dos palabras clave que aparezcan en alguna parte del mensaje o la página que desea vincular.

  • Hacer clic en el título del mensaje o la página que quieres enlazar, y los campos de URL y el título se llenarán automáticamente.
  • Después de haber introducido la dirección URL, haz clic en el botón «Añadir enlace«. En el modo visual: el texto resaltado cambiará al color azul con un subrayado para indicar un enlace:

  • En el modo HTML: el texto se envuelve con el código HTML necesario para la creación de un enlace a la URL especificada. El siguiente ejemplo es un enlace a WordPress.com:

 

Cómo quitar los vínculos con el Editor Visual

Para eliminar un enlace en el editor Visual, resalte el texto y haga clic en el icono de enlace roto:

 

Enlaces que contengan el símbolo «@»

Cuando creamos hipervínculos o enlaces deberemos de tener en cuenta que en alguna ocasión nos pueden dar problemas porque ciertos símbolos son cortados por seguridad. Si quisiéramos hacer un enlace o hipervínculo a la siguiente dirección que contiene el símbolo «@»:

En este caso la «@» se eliminaría por razones de seguridad y, lamentablemente, este vínculo no funcionaría. Hay un pequeño truco que nos permite evitar este problema y consiste en sustituir la «@» por «&#64;« como mostramos a continuación:

Tenga en cuenta que si se vuelve a modificar el vínculo, la «@» una vez más desaparece por lo que tendrá que volver a hacer lo anterior.

Los derechos de autor

La distribución de materiales multimedia en cualquier formato están sujetos a la misma legislación sobre derechos de autor que el resto de obras: libros, pinturas, música, etc. Esto significa que si decidimos incorporar recursos ajenos (imágenes, audios, vídeos, presentaciones, documentos) a nuestro espacio web debemos conocer y respetar las condiciones de uso que han definido los autores de estos materiales. Y esto es especialmente significativo cuando el material que hemos elaborado supera el contexto de uso particular y se pretende publicar en internet. Es entonces cuando existe posibilidad de ser utilizado por otras personas incluso en clara competencia con el material original. En ocasiones cuando accedemos a un espacio web, su autor explicita la posibilidad de reutilización a cambio de citar la procedencia (derecho de cita) o bien de que no se fragmente su obra (derecho de obra no derivada). Sin embargo cuando esto no se indica o bien se muestra una licencia de copyright (derechos reservados) conviene ser cauteloso. La apropiación indiscriminada de materiales ajenos para elaborar un material propio no se puede justificar desde la ausencia de ánimo de lucro que caracteriza las iniciativas donde participemos. Esta justificación no es suficiente y se hace necesario en estos casos contactar con el autor o autores para obtener su permiso y en caso favorable citar siempre la fuente de procedencia.  

Creative Commons – CPJV

Licencias Creative Commons Creative Commons (http://es.creativecommons.org/) es una organización que ofrece a cualquier usuario la posibilidad de elegir las condiciones en que desea compartir un trabajo publicado en Internet. Para ello debe elegir entre 4 condiciones (información sacada de la página: http://es.creativecommons.org/licencia/). Reconocimiento (Attribution): El material creado puede ser distribuido, copiado y exhibido por terceras personas si se reconoce la autoría en los créditos. No Comercial (Non commercial): El material original y los trabajos derivados pueden ser distribuidos, copiados y exhibidos mientras su uso no sea comercial. Sin Obras Derivadas (No Derivate Works): El material puede ser distribuido, copiado y exhibido pero no se puede utilizar para crear un trabajo derivado del original. Compartir Igual (Share alike): El material puede ser modificado y distribuido pero bajo la misma licencia que el material original. De la combinación de estas condiciones se logran componer los 6 tipos de licencias que se pueden elegir: Reconocimiento (by): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. Se permite cualquier explotación de la obra, incluyendo una finalidad comercial, así como la creación de obras derivadas, la distribución de las cuales también está permitida sin ninguna restricción. Reconocimiento – Sin obra derivada (by-nd): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. Se permite el uso comercial de la obra pero no la generación de obras derivadas. Reconocimiento – No comercial – Sin obra derivada (by-nc-nd) : El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. No se puede obtener ningún beneficio comercial. No se permite un uso comercial de la obra original ni la generación de obras derivadas. Reconocimiento – No comercial (by-nc): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. Se permite la generación de obras derivadas siempre que no se haga un uso comercial. Tampoco se puede utilizar la obra original con finalidades comerciales. Reconocimiento – No comercial – Compartir igual (by-nc-sa): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. No se puede obtener ningún beneficio comercial y las obras derivadas tienen que estar bajo los mismos términos de licencia que el trabajo original. Reconocimiento – Compartir igual (by-sa): El material puede ser distribuido, copiado y exhibido por terceros si se muestra en los créditos. Las obras derivadas tienen que estar bajo los mismos términos de licencia que el trabajo original. Obtener la licencia Cuando hayas hecho tu elección tendrás la licencia adecuada para tu trabajo expresada de tres formas:
  • Commons Deed: Es un resumen fácilmente comprensible del texto legal con los iconos relevantes.
  • Legal Code: El código legal completo en el que se basa la licencia que has escogido.
  • Digital Code: El código digital, que puede leer la máquina y que sirve para que los motores de búsqueda y otras aplicaciones identifiquen tu trabajo y sus condiciones de uso.
Utilizar la licencia Una vez escogida la licencia tienes que incluir el botón Creative Commons «Algunos derechos reservados» en tu sitio, cerca de vuestra obra. Este botón enlaza con el Commons Deed, de forma que todos puedan estar informados de les condiciones de la licencia. Si encuentras que tu licencia ha sido violada, entonces tendrás las bases para poder defender tus derechos. Proponemos la visualización de un interesante vídeo que explica las licencias Creatice Commons Para completar la entrada por si no les queda claro recomiendo ver el vídeo de Pablo Arrieta.  

Añadir una licencia CC a un blog de WordPress

Una licencia Creative Commons permite que nuestros lectores sepan, en concreto, lo que pueden y no pueden hacer con el contenido publicado en nuestro blog del profesorado o en nuestro blog de centro. Si decidimos registrar el contenido de dichos blogs, sería interesante visitar la página «Creative Commons España» en el sitio web oficial de la organización. Para situar una licencia CC (Creative Commons) en la barra lateral de nuestro blog deberemos seguir los siguientes pasos:
  1. Visita la web de Creative Commons: «Escoja una licencia«
  2. Se cargará un formulario que tendremos que completar y, que nos dará el tipo de licencia que mejor se adapta a las necesidades descritas en el mismo.

  • Cuando terminemos, haremos clic en el botón «Escoja una licencia«.
  • Finalmente, selecciona la imagen que deseas utilizar para tu licencia, y copia el código que se encuentra en el cuadro de texto (que se ilustra en la siguiente imagen).

  • A continuación, podremos pegar este código en un widget de texto en la barra lateral del blog. Para ello, en el panel de administración de WordPress, debes de acceder al submenú «Apariencia Widgets» y a continuación elegimos un Widget de «Texto» lo arrastramos y lo soltamos sobre la barra lateral derecha en la zona que nos interesa hacerlo visible.
 
  • En el cuadro de texto Título introduce el texto Licencia Creative Commons. En el cuadro de texto inferior haz clic derecho y elige Pegar para pegar el código HTML que te ha proporcionado el espacio Creative Commons.

  • Para finalizar haremos clic en el botón Guardar. Para cerrar la edición de este Widget pulsaremos en el enlace Cerrar. Para eliminar este Widget haremos clic en el enlace Borrar.
  • Si posteriormente quisiéramos modificar de posición arriba/abajo del gadget que se muestra en pantalla basta con acceder a la zona de Widgets (Apariencia Widgets) pulsar y arrastrar uno respecto al otro sobre la edición de la barra lateral.

  • Podemos ver el resultado en nuestro blog:

 

Más información

La Información de este tema ha sido sacada de la entrada publicada en el Blog central de los Centros Educativos: «Cómo crear una galería de imágenes con editor en modo de edición Visual» Otras noticias publicadas en el Blog central de los Centros Educativos que están relacionadas y nos permitirán ampliar la información:

Insertar una imagen

Cuando se escribe una entrada en el blog seguramente les surgirá la necesidad de usar imágenes para decorar o ilustrar la misma. El uso de las imágenes requerirá una reflexión más detallada que abordaremos un poco más adelante por la importancia que tiene el tomar conciencia sobre el respeto escrupuloso a los derechos de autor. Las imágenes que se adjuntan a una noticia estarán publicadas en la Web y por tanto estaremos expuestos a cualquier tipo de reclamación. Para empezar, habrá que decidir donde queremos tener las imágenes que se van a utilizar en la entrada que se está creando. Podremos tenerlas subidas al espacio que nos ofrece nuestro blog o acceder a ellas desde la Web. Para la segunda opción podremos usar algunos de los servicios gratuitos que nos permiten alojar nuestras colecciones de fotografías o enlazar directamente desde algún repositorio específico o página web (esto tiene el riesgo de que si quitan la imagen que tenemos enlazada del sitio web a donde hemos dirigido el enlace nos quedaremos sin ella en nuestra entrada). Los servicios gratuitos para alojar colecciones de fotografías, tipo Picasa o Flickr,… suelen ser más apropiados para alojar gran cantidad de fotografías, por ejemplo, después de haber hecho una salida con los alumnos para tener un álbum fotográfico virtual. En este apartado del tema trataremos de repasar como podemos insertar una imagen en una entrada desde estas dos perspectivas y cómo podemos crear galerías de imágenes.

Insertar una imagen subiendola previamente a la galería multimedia de nuestro blog

La forma más sencilla y natural será la de subir una foto que se tenga guardada en el propio ordenador.
  • Pondremos el cursor en el lugar donde queremos insertar la imagen y luego buscaremos en la parte superior del editor de texto o del área de edición de la entrada el icono de «Añadir objeto»:
  • Al seleccionar la opción de «Subir archivos» se abrirá un menú que nos permitirá buscar las imágenes dentro del propio ordenador y arrastrarla al espacio que nos indica. Una vez se arrastra la imagen se comienza a subir de forma automática. 27-02-2014 14-32-05
  • WordPress también nos permite utilizar la función de «Elegir archivos» y explorar de forma normal en búsqueda de la imagen que está guardada en el propio equipo. En este caso, cuando se tenga la imagen seleccionada se debe hacer clic sobre Subir.

27-02-2014 14-30-01

  • Una vez se haya subido la imagen en la galería multimedia se cargará de forma automática el menú con las opciones de la imagen que hemos subido.
  • Rellenaremos aquella información asociada a la propia imagen. Pondremos el título de la imagen, el texto alternativo y una breve descripción. Estos datos no son imprescindibles pero facilitan la accesibilidad de nuestro sitio.
  • Si escribimos algún texto en la opción «Leyenda» aparecerá publicado como texto explicativo de la imagen.
  • Observaremos el apartado de URL del enlace, es la dirección que WordPress le ha dado a esta imagen y siempre o archivo y siempre que la escribamos veremos la imagen.
  • Decidiremos la alineación donde nos gustaría que aparezca la imagen en nuestra entrada.
  • Podremos modificar el Tamaño de la imagen seleccionando entre Miniatura y Tamaño completo. Tendremos que tener en cuenta como es la plantilla que estamos utilizando para que la imagen se adapte al espacio que tenemos asignado para las entradas.
  • Cuando tenemos completados los datos del menú pulsaremos sobre «Insertar en la entrada» y regresaremos al editor de la nueva entrada, donde acabaremos de organizar y escribir la noticia que vamos a publicar. 27-02-2014 14-35-31
  • Ya solo que tenemos que colocar la imagen. La seleccionamos y con la herramienta Alinear texto la colocamos en el centro, izquierda o derecha. Jugando con estas opciones, podemos colocar el texto al lado de la foto.
  • Como consejo, colocar la foto después de poner el texto.
 

Insertar una imagen enlazada desde Internet

Otra forma que podremos utilizar es la de insertar una foto que ya está en Internet. Puede que la tengamos subida un alojamiento propio o que la enlacemos directamente desde otro lugar de la Web (tendremos que tener mucho cuidado con los derechos de autor):
  • Localizamos la imagen en Internet y con el botón derecho copiamos la ruta de la imagen.
  • Colocaremos el curso en el lugar donde queremos insertar la imagen y buscaremos el botón de «Añadir objeto» que aparece en la parte superior del editor de texto.
  • Seleccionar la opción de «Subir archivos» y al seleccionar el botón de «Selecciona archivo» se abrirá el menú que nos permitirá buscar las imágenes dentro del propio ordenador y arrastrarla al espacio que nos indica. Tendremos que buscar la opción que pone «Insertar desde URL» y se desplegarán las opciones para introducir los datos de la foto.
  • En este menú introducimos la dirección donde está la imagen en Internet (la que hemos copiado en el portapapeles en el paso 1) y completaremos la leyenda.
    27-02-2014 14-49-49

    Fotografia de ejemplo: Mont Saint Michel por Benito Roveran, CC

  • Es importante el poner un nombre a la foto. De esta forma hacemos accesible la página a las personas con discapacidad visual.
  • Una vez se hayan completado todos los datos haremos clic sobre «Insertar en la entrada» .

 ¿Subir desde una URL?

Ejemplo de imagen subida desde URL remota

¿A que no sabías que el cargador de imágenes de WordPress es capaz de subir y guardar imágenes que cargues desde la red?. Pues si, puede, y es muy fácil hacerlo.

1. Ir a EntradasAñadir nueva o a Páginas Añadir nueva, o abrir una entrada existente en el modo de edición.

2. Coloca el cursor donde deseas que aparezca la imagen, y haz clic en el icono «Añadir objeto» que se encuentra directamente por encima de su editor.

28-02-2014 9-20-56

3. Haz clic en el botón «Selecciona archivos» (como vimos en un apartado anterior) y elije el archivo de imagen desde tu ordenador.

28-02-2014 9-24-41

4. En vez de guardar una imagen en tu ordenador y luego subirla pega la URL de la imagen en la caja de la ruta del archivo y haz clic en OK.

28-02-2014 9-33-14

WordPress guarda la imágen y te la muestra lista para insertarla en la entrada, tal como hemos hecho con esta foto de jfelias en morgueFile.com.

(Nota: este truco solo funciona en Windows, en Mac no hay caja para introducir la ruta)

Fuente: Ayuda WordPress