wordpress creaciÓn y dinamizaciÓn ... - gobierno de … · la filosofía de un blog es la de...

58
WORDPRESS: CREACIÓN, ADMINISTRACIÓN Y DINAMIZACIÓN DE UN BLOG EN ECO ESCUELA 2.0 2 ¿Cómo alimentar el blog?

Upload: others

Post on 03-May-2020

3 views

Category:

Documents


0 download

TRANSCRIPT

WORDPRESS: CREACIÓN,

ADMINISTRACIÓN Y DINAMIZACIÓN

DE UN BLOG EN ECO ESCUELA 2.0

2 ¿Cómo alimentar el blog?

1

Contenido

1. Introducción .................................................................................................................................3

2. Entradas o noticias .......................................................................................................................5

¿Cómo escribir una entrada? ...........................................................................................................6

Funcionalidad “Más información” (muy útil) ...................................................................................9

Descripción de los módulos del panel de Edición Entrada ........................................................... 12

Título de la Entrada ................................................................................................................... 12

Editor del contenido de la Entrada ........................................................................................... 12

Iconos del Editor visual.............................................................................................................. 14

Opciones de pantalla ................................................................................................................. 17

Módulo: “Publicar” .................................................................................................................... 18

Módulo: Categorías ................................................................................................................... 20

Módulo: Etiquetas de las entradas ........................................................................................... 21

Módulo: Imagen destacada ....................................................................................................... 22

Módulo de Enviar Trackbacks ................................................................................................... 24

Módulo de campos personalizados (usuarios avanzados) ........................................................ 24

Módulo de Extracto (usuarios avanzados) ................................................................................ 25

Módulo de Comentarios ........................................................................................................... 25

Módulo de Autor ....................................................................................................................... 26

Módulo de Formato .................................................................................................................. 26

Módulo de Revisiones ............................................................................................................... 27

Módulo de Slug o Enlace permanente (conveniente no tocarlo y dejar que lo gestione

WordPress) ................................................................................................................................ 27

Más información ........................................................................................................................... 29

3. Insertar imagen ......................................................................................................................... 29

Insertar una imagen que se ha subido previamente a la galería multimedia de nuestro blog .... 30

Insertar una imagen enlazada desde Internet .............................................................................. 33

Agregar una galería ....................................................................................................................... 34

Edición de una galería ................................................................................................................... 38

Opciones de la galería ................................................................................................................... 39

Código abreviado: [gallery] (Para usuarios avanzados) ............................................................... 40

2

La publicación de imágenes .......................................................................................................... 40

Repositorios de imágenes ............................................................................................................. 41

Los derechos de autor ................................................................................................................... 43

Creative Commons – CPJV ............................................................................................................. 43

Añadir una licencia CC a un blog de WordPress ............................................................................ 46

Más información ........................................................................................................................... 50

4. Cómo crear enlaces o hipervínculos dentro de una noticia ...................................................... 50

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

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

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

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

Enlaces que contengan el símbolo “@” ........................................................................................ 53

5. Escritura libre de distracción ..................................................................................................... 54

Activando la escritura libre de distracciones ................................................................................ 54

Modo de pantalla completa con la escritura libre de distracciones ............................................. 56

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

6. Artículos de lectura y tutoriales publicados en el Blog de los Centros ..................................... 56

3

1. Introducción En este tema abordaremos aquellos aspectos más básicos, pero no por ello menos importantes, con

los que alimentaremos nuestro blog.

El blog, esta visible en la Web y por tanto siempre que accedemos a él lo veremos con el mismo

aspecto con el que lo puede ver cualquier persona que accede a la dirección desde internet. Para

poder escribir una entrada o publicar contenido en nuestro blog tendremos que acceder a la zona de

administración del mismo y para ello tendremos que introducir nuestros datos para que nos permita

acceder a diferentes zonas, dependiendo de los privilegios que tenga nuestro usuario.

Podremos acceder al panel de administración o a la edición de nuestro blog siguiendo unas pautas:

1. Abra el navegador web y escriba la URL de inicio de su blog.

2. Luego acceda a la zona de edición del blog. Para ello se podrán utilizar dos fórmulas:

a. Se buscará el enlace “Acceder” que se encuentra en un Widget lateral llamado

“META” (los widgets o artilugios se suelen colocar en la parte lateral derecha del

blog y tienen diferentes funciones, como enlaces, calendario, buscador, últimas

entradas...).

4

b. Se pondrá al final de la URL de inicio del blog el texto “wp-admin” (de WordPress

Administración). En el caso de un blog del profesor creado en el entorno de la

Consejería de Educación del Gobierno de Canarias “ecoblog” debería quedar algo así

(en los puntos suspensivos se sobrentiende que va la parte personalizada de cada

blog):

“http://www2.gobiernodecanarias.org/educacion/clicescuela20/ecoblog/……/wp-

admin/”

3. Se cargará la pantalla en la que nos solicita nuestras credenciales para dejarnos pasar a la

zona de edición.

4. Introduzca sus credenciales (usuario y contraseña) y pulse en el botón Acceder. En caso de

que no recordar la contraseña pulse sobre “¿Has perdido la contraseña?” y le será enviada

una nueva al correo electrónico con el que se dio de alta en el blog.

5. Una vez introducidos sus datos accederá al panel de administración o al escritorio de edición,

desde donde podrá alimentar y tener acceso a la administración y control de su blog.

Tan pronto se haya validado puede observar que se cargará una barra superior, que en este caso es

negra, en donde se muestran una serie de botones de acceso rápido: Nuestros sitios, Control de

comentarios, “+ Nuevo” para introducir nuevas entradas, páginas,… y en la parte derecha los datos

relativos al usuario.

En la parte izquierda se encuentra el menú lateral con todos los subpaneles de administración y las

diferentes opciones: Entradas, Multimedia, Enlaces, Páginas, Comentarios, Apariencia,...

En la parte central se mostrará la información y los módulos que nos ofrecen las opciones del

escritorio.

En caso de cargar un panel de administración (ejemplo: añadir entrada) en la parte central se

mostrará la pantalla con los diferentes módulos que nos permitirán administrar y gestionar dicho

subpanel.

5

Pantalla de Escritorio

2. Entradas o noticias Como ya se ha mencionado un blog, o en español también una bitácora, es un sitio web

periódicamente actualizado que recopila cronológicamente textos, artículos de uno o varios autores,

apareciendo primero el más reciente, donde el autor conserva siempre la libertad de dejar publicado

lo que crea pertinente. A estos artículos o textos se les conoce como entradas, noticias o post.

Por tanto se podría decir que una entrada es una aportación al blog. Los blog se componen de

numerosas entradas que se visualizan ordenadas de forma cronológica. Todas se almacenan en la

base de datos.

Al ser ordenadas por la fecha de publicación, las entradas van descendiendo y se hace difícil localizar

las más antiguas. Para evitar este problema, en las últimas versiones de WordPress, se han

incorporado utilidades que facilitan la búsqueda de las mismas atendiendo a su clasificación por

etiquetas (son palabras clave con las que definimos la entrada y que facilitan la asociación de las que

están relacionadas con el término), categorías (es una forma de clasificar las entradas que vamos

poniendo en el blog para asociarlas a una estructura que nosotros hemos creado previamente),

menús (es la forma que podemos utilizar para visualizar las entradas asociadas a las categorías), RSS

(nos permite hacer seguimiento de aquellas entradas, categorías o blogs para enterarnos cuando se

hacen nuevas entradas), y otras.

La filosofía de un blog es la de buscar la máxima sencillez a la hora de publicar por lo que el proceso

de publicación de una entrada, post o noticia se debe afrontar sin miedo. A continuación trataremos

de describir los pasos a seguir.

6

¿Cómo escribir una entrada?

Como ya hemos mencionado las entradas se muestran en orden cronológico inverso, en la página de

inicio. A diferencia de las páginas estáticas, las entradas de los blogs suelen tener campos de

comentarios debajo de ellas y se incluyen en la alimentación de su sitio RSS.

Para escribir una entrada:

1. Acceda a su panel de administración o al escritorio de edición de su blog en WordPress.

Para ello se seguirán los pasos mencionados en el apartado anterior.

2. Haga clic en el subpanel Entradas o en el menú desplegable “+ Nuevo”.

3. Haga clic en la opción: Añadir nueva

4. Comience a llenar los espacios en blanco (título y cuerpo de la entrada).

5. Si quiere añadir información adicional a la entrada que le permita una mejor clasificación de

la misma, seleccione una categoría en la caja o módulo lateral “Categorías”. El árbol de

categorías se muestra visible en la pestaña “Todas las categorías”. En caso de no tener

ninguna categoría aparecerá únicamente “Sin categoría”. Puede crear una nueva, sobre la

marcha, como se indica en la imagen siguiente: (1) + Añadir nueva categoría; (2) Escribir el

nombre de la categoría; (3) Seleccionar una categoría superior, en caso de que quisiéramos

anidarla en una categoría más importante ya creada anteriormente. En caso de no

seleccionar ninguna pasará a ser una categoría principal; (4) Finalmente hacemos clic sobre

“Añadir nueva categoría”:

7

6. También se puede añadir otro tipo de información para localizar la notica a través de la nube

de etiquetas. Para ello deberemos añadirle una etiqueta o “tag” en el módulo de “Etiquetas”

7. Podremos añadir más información a nuestra entrada y lo haremos en los otros módulos o

cajas que nos aparecen en la pantalla de “Edición de la entrada”. Algunos de estos módulos

o cajas no e utilizarán muy a menudo, por lo que no vamos a profundizar mucho en su uso.

Durante el curso veremos algunos de ellos y si quieren más información la podrán encontrar

en el “Blog Central de los Centros Educativos“.

8. Si queremos ver como va quedando la entrada que estamos creando lo podrán hacer en el

botón “Vista previa” del módulo “Publicar”.

8

9. En caso de no haber terminado de escribir la entrada o de no estar seguro de la publicación

de la misma puede guardarla como borrador en el botón “Guardar borrador” del módulo

“Publicar”.

10. Cuando esté listo, haga clic en Publicar.

11. A continuación ponemos un ejemplo:

9

Funcionalidad “Más información” (muy útil)

Cuando publicamos entradas en nuestro blog se cargarán por defecto en la página de inicio. Si la

noticia que hemos publicado tiene un texto muy largo pude hacer que parezca que en nuestro blog

no hay más información.

Por ello WordPress incluye, en el editor de la entrada, una funcionalidad que nos resultará muy útil

para poder diseñar la cantidad de texto e información de cada noticia que nos interesa que se cargue

en la página de inicio.

El funcionamiento resulta muy sencillo e intuitivo y consiste en introducir un salto de línea en el lugar

del párrafo donde queremos cortar el texto y adjuntar el mensaje “Sigue leyendo” que incluye un

10

hipervínculo a la noticia desarrollada. Esta funcionalidad es visible en la página de inicio, nunca en la

vista de la entrada completa.

Veamos a continuación como se utiliza esta funcionalidad:

1. Si tenemos una noticia que tiene un texto largo cuando la vemos en la página de inicio se carga

todo el texto y no se ven más noticias.

2. Para dejar menos texto utilizaremos la funcionalidad “Insertar la etiqueta More”. Para ello

tendremos que entrar en la edición de la entrada , seleccionaremos la cantidad de texto

que nos interesa dejar visible en la página de inicio. Colocaremos el cursor en el lugar donde

queremos hacer el corte y buscaremos en la barra superior el icono . En esta posición

situaremos la marca de “Más información”.

11

3. Observaremos que se dibuja una línea de trazo discontinuo en esta posición. Para situarla en otra

ubicación será necesario eliminarla como si se tratase de un texto o imagen.

4. Clic en el botón Publicar o Actualizar.

5. Finalmente accederemos al modo lectura del artículo para observar como se muestra el párrafo y

en el lugar donde hemos cortado el enlace: Sigue leyendo

12

Descripción de los módulos del panel de Edición Entrada

Título de la Entrada

El título de la entrada es el texto que aparecerá remarcado presentando la entrada. Podremos

utilizar cualquier palabra o frase pero trataremos de buscar un mensaje que llame la atención. Evite

usar el mismo título dos veces; puede causar problemas.

En la última versión de WordPress se puede utilizar las comas, apóstrofes, comillas, guiones y otros

símbolos típicos en las publicaciones como “¿Dónde estamos?”, ‘CEIP …’, u otros que en otras

versiones no se podían utilizar.

Editor del contenido de la Entrada

13

Es el espacio en blanco donde se introduce el texto, enlaces, imágenes, contenido multimedia y

cualquier otra información que nos interese mostrar en su sitio.

Cuando se crea una entrada o una página de tu blog de centro, tendremos dos modos de edición

disponibles y podremos utilizar aquel con el cual nos sintamos más cómodos. Podremos utilizar la

edición Visual o la edición HTML para crear o editar nuestras páginas.

El cambio entre los modos de edición visual y edición de HTML es fácil. Sólo tendremos que usar las

etiquetas o pestañas directamente sobre el lado derecho del área de edición. Si no podemos ver la

ficha “Visual“, debemos asegurarnos de que no está desactivada en las opciones personales de

nuestro perfil de usuario.

Editor Visual. Es el modo por defecto para los blogs de WordPress y tiene un aspecto muy

similar a un procesador de textos.

Los iconos del editor visual permiten dar formato al texto, alineación de fuente, insertar viñetas y

listas numeradas, y mucho más.

14

Editor HTML. El editor HTML tiene menos opciones, pero permite editar directamente el código

HTML de nuestras entradas y páginas. Este modo de edición está dirigido a aquellos usuarios que

se sienten cómodos trabajando con el lenguaje HTML. Cuando tengamos la necesidad de añadir

un código corto (shortcode), modificar el estilo de fuente, o pegar código de una fuente externa,

podremos utilizar el editor HTML.

Recordar a aquellos usuarios que se animen a utilizar este lenguaje que el código HTML que

agreguemos debe estar bien formado y debe figurar en la lista de las etiquetas HTML permitidas.

WordPress tiene algunas restricciones de código como la de no tener Javascript, reproductores, o

formularios personalizados.

Iconos del Editor visual

El editor visual ofrece un editor de contenidos semi-WYSIWYG (lo que ves es lo que obtienes) que te

permite crear, editar y formatear el contenido del blog en una vista similar a la de un procesador de

textos.

Este es el modo de edición por defecto de WordPress y el que utilizaremos tanto en el blog del

profesorado como en el blog de los centros, pero si no aparece habilitado, podremos seleccionarlo

en la pestaña “Visual” que está situada en la esquina superior derecha del área de edición, como se

muestra a continuación:

15

Hay dos filas de edición de iconos que figuran en el editor visual. A continuación haremos una breve

descripción para averiguar lo que significan. Cuando estemos trabajando nos aparecerá una ayuda

cada vez que pasemos el ratón por encima de cualquier icono (una pequeña descripción se mostrará

flotando sobre el icono y nos ayudará a recordar para que sirve).

Fila 1: Cuando abra inicialmente el editor visual es probable que se muestre una sola fila de iconos:

Encima de cada icono hemos puesto un número que se relaciona con los epígrafes siguientes:

1. Negrita

2. Itálica

3. Tachado

4. Lista sin ordenar (con viñetas):

Tema 1

Tema 2

5. Lista ordenada

Tema 1

Tema 2

6. Cita (una forma de mostrar el texto de una cita, el estilo de cada tema mostrará esto de

manera diferente.)

Perdona siempre a tus enemigos, nada les molesta tanto.

7. Alinear a la izquierda

8. Alinear al centro

9. Alinear a la derecha

10. Insertar / Editar enlace

11. Quitar enlace

12. Insertar etiqueta “Más”

13. Activar / Desactivar el corrector ortográfico

14. Cambiar a modo de pantalla completa

15. Mostrar / Ocultar botones adicionales (permite mostrar la segunda fila de iconos de

edición)

16

Fila 2: Para mostrar la segunda fila de iconos, seleccione el icono Mostrar / Ocultar botones

adicionales

1. Estilo – diversos estilos de formato definido por el tema

2. Subrayar

3. Alineación completa

4. Elegir el color de texto – cambiar el texto de color

5. Pegar como texto plano (sin formato)

6. Pegar desde Word

7. Eliminar o quitar el formato

8. Insertar caracteres especiales o personalizados

9. Disminuir sangría – mueve el texto más a la izquierda

10. Aumentar margen o sangría – mover el texto más a la derecha

11. Deshacer – deshacer la última acción

12. Rehacer – rehacer la última acción

13. Ayuda – muestra cierta información acerca de cómo utilizar el editor, así como los

métodos abreviados de teclado.

Iconos de alineación. Tanto el texto como las imágenes se pueden alinear con los iconos

correspondientes:

La alineación completa sólo se puede aplicar al texto y se alinean ambos lados del texto.

Menú desplegable de estilos. El menú desplegable de estilos nos permite

cambiar el formato de cualquier texto seleccionado. Incluye diferentes Títulos y

otros estilos predefinidos integrados en el tema.

Una mayor modificación del estilo requiere la actualización del CSS -hoja de

estilos- personalizado (y por tanto de los conocimientos sobre CSS adecuados).

Color del texto. Para cambiar el color del texto en primer lugar hay que

seleccionar o destacar una sección del texto:

Al hacer clic en la flecha hacia abajo, junto al botón Color de texto,

mostrará un selector de color.

La selección de un color aplicará ese color para el texto seleccionado y lo

17

convierte en el color predeterminado para el botón de color. Al hacer clic en el botón de color del

texto en sí se aplicará el color predeterminado anteriormente .

Pegar texto. Si se copia y pega texto de otro lugar, nos encontraremos con que no siempre aparece

exactamente como esperábamos. Si utilizamos el botón Pegar como texto se produce la ejecución de

un proceso de limpieza para eliminar cualquier formato especial y las etiquetas HTML que de otro

modo pueden cambiar el texto.

Una vez hecho clic, aparecerá una ventana donde podremos introducir el texto:

Deberemos comprobar que está marcada la opción de mantener los saltos de línea, para preservar

todos las etiquetas HTML <br/>. Si se desactiva esta opción, las eliminará.

Eliminar formato. Al eliminar el formato de un texto, como era de esperar, se quita todo el formato

(negrita, cursiva, colores, etc.) de la sección de texto seleccionado. Primero, seleccione el texto:

Este es mi pequeño texto formateado

Cuando se pulsa el botón de “Eliminar formato“, todo el formato se elimina:

Este es mi pequeño texto formateado

Nueva línea sin espacio encima. Pulse la tecla “Intro” (Volver/Enter) para terminar el párrafo que

estás escribiendo y comenzar uno nuevo. Si desea iniciar una nueva línea sin crear un nuevo párrafo,

pulse la tecla “Mayúscula” mientras oprime la tecla “Intro” (Mayus + Enter).

Opciones de pantalla

Las Opciones de pantalla nos permitirán configurar aquellos

módulos o secciones que se hacen visibles en la pantalla de

creación/edición de entrada.

Lo ideal es no tener visibles aquellos módulos o funciones que no utilizamos habitualmente. En la

imagen vemos que podemos activar o desactivar los que nos interesan. No es necesario guardar ni

afecta a lo que estamos escribiendo, es decir, en cualquier momento podremos hacer visibles las

secciones que necesitemos activando o desactivando:

18

Esta función nos permitirá dejar un espacio de trabajo mucho menos cargado de información y por

tanto nos dará una mayor sensación de sencillez. Se configura por usuario, es decir que cada usuario

personalizará su espacio de trabajo.

Módulo: “Publicar”

Es la caja desde la cual podremos controlar todos los parámetros de

configuración para publicar una entrada. Podremos visualizar como va

quedando, guardarla como borrador, configura quien la puede ver, es decir

si es pública, privada o visible con una contraseña. En esta sección

podremos programar la fecha y hora de publicación.

Contiene una serie de botones que controlan el estado de nuestra entrada:

Botón “Vista previa”. Permite ver la entrada antes de publicarla oficialmente.

Botón Guardar borrador. Le permite guardar la entrada como un borrador

/ pendiente de revisión en vez de publicar inmediatamente.

Sección de Estado. Para acceder a la misma haremos clic sobre

“Editar”. Los principales estados son publicado, pendiente de revisión, y borrador. Publicado: la

entrada se ha publicado en nuestro blog para que todos la vean. Pendiente de revisión significa

que el borrador está a la espera de revisión por un administrador o editor antes de su

publicación. Borrador significa que el mensaje no ha sido publicado y sigue siendo un proyecto.

Si seleccionamos un determinado estado de publicación y hacemos clic en el botón de

Actualizar o el botón de Publicar, el estado se aplicará de forma automática para la entrada.

Por ejemplo, para guardar una entrada en estado de pendiente de revisión, seleccionaremos

dicha opción en el desplegable de la opción Estado y haremos clic en Guardar borrador.

19

Para acceder a ella de nuevo y localizarla lo haremos desde el subpanel de Entradas Todas

las entradas, la localizaremos y al pasar el ratón por encima se activarán las acciones que

podemos realizar y seleccionaremos → Editar.

Sección Visibilidad. Para acceder a la misma haremos clic sobre

“Editar”. Determina cómo se hará visible nuestra entrada al mundo. La opción “Público” hará

visible la entrada para todos los visitantes del sitio web. La opción Protegida con contraseña,

hará que se publique la entrada, pero los visitantes deben conocer la contraseña para ver el

contenido de esta. Privada, hace que la entrada sea visible sólo para el autor.

Sección Publicar el: Para acceder a la misma

haremos clic sobre “Editar”. Esta opción nos permite programar una entrada para su publicación

en un tiempo futuro o modificar la fecha de publicación (por defecto carga la fecha y hora del

ordenador). Tan pronto editemos la opción se cargará un calendario y un reloj que podemos

modificar, una vez hayamos seleccionado la fecha y hora pulsaremos Aceptar. Podremos

programar una fecha futura o cambiar la fecha de publicación a una fecha en el pasado pero esto

alterará la posición de la entrada. Cuando hayamos completado la entrada podremos hacer clic

en el botón “Publicar” .

Botón Publicar. Publica la entrada en el blog. De forma predeterminada, en

momento del primer auto-guardado en la entrada será la fecha y hora de creación dentro de la

base de datos.

20

Enlace a Mover a la papelera. Envía la entrada o noticia creada a la

papelera para no ser publicada ni guardada como borrador.

Módulo: Categorías

Las categorías nos permitirán ofrecer a la entrada una

información que nos facilite su clasificación tanto de forma

interna (a la hora de gestionarla en la pantalla de la sección

“Todas las entradas” del subpanel “Entradas”), como de forma

visual al poder llamarla desde los menús de navegación que

veremos posteriormente.

La temática general de la entrada que estamos creando se puede clasificar en categorías por su

contenido. Los lectores pueden navegar por categorías específicas para ver todas las entradas que

hemos publicado sobre una temática específica y que previamente hemos marcado con esa

categoria. Al añadir una categoría a una entrada esta se colocará de primera en la página de inicio en

el blog y además se colocará de primera en la categoría que le hayamos asignado (recordemos que en

un blog las últimas entradas son las primeras).

Para añadir una nueva categoría, haremos clic en el vínculo “+ Añadir nueva categoría” de esta

sección. Recordemos que podemos crear subcategorías o categorías anidadas desplegando el combo

–Categoría superior- en el que aparecerán todas las categorías creadas hasta el momento. Si

seleccionamos una automáticamente la nueva que creemos se creará como dependiente de la

misma.

También podremos manejar las categorías desde el subpanel de Entradas → Categorías como vemos

en la imagen siguiente.

21

Módulo: Etiquetas de las entradas

Es otra forma de clasificación de la información que

incorporamos a nuestra entrada. Cuando creamos una

entrada le pondremos pequeñas marcas que luego nos

permitan encontrarla a nosotros o las personas que navegan

por Internet. La etiqueta suele ser una palabra corta (puede

ser una frase) que identifica el contenido de la entrada. Las

etiquetas son otra de las herramientas que pone WordPress a

nuestro servicio para gestionar la información que vamos incorporando a nuestro blog. Todas las

entradas de nuestro blog que posean una etiqueta común estarán unidas entre sí y se mostrarán en

la pantalla cuando un usuario haga clic en una de las etiquetas que se visualizan en la nube de

etiquetas de nuestro blog. Para que las etiquetas estén visibles deben de ser activadas en el “Tema”

para que aparezcan en su posición. Utilizaremos un widget (Subpanel Apariencia → Widgets

Nube de etiquetas). Las entradas filtradas por una etiqueta se mostrarán ordenadas de forma

cronológica por la fecha de publicación.

Para Añadir una etiqueta en la entrada se escribe la palabra o palabras en el recuadro

correspondiente del módulo “Etiquetas”. Se puede poner más de una etiqueta separándolas por

comas. WordPress nos ofrece una ayuda para buscar etiquetas ya creadas que consiste en que al

escribir las tres primeras letras de la etiqueta nos desplegará un combo en el que nos muestra las

etiquetas que ya se han creado y que comienzan por esas letras. También podremos seleccionar las

etiquetas de las existentes a través de la opción “Elige entre las etiquetas más utilizadas“, y hacer clic

en “Añadir“.

22

Podremos administrar (editar, crear, borrar, modificar) las etiquetas de nuestro blog desde el

subpanel de “Entradas” Etiquetas

Módulo: Imagen destacada

La imagen destacada es un módulo que permite

asociar una imagen a una entrada para que el Tema

de WordPress la pueda gestionar en la presentación.

Dependiendo del tipo de Tema que utilicemos se

pueden presentar en la noticia o en la cabecera de las imágenes.

23

Para adjuntar una imagen destacada haremos clic sobre el enlace “Establecer la imagen destacada”,

subiremos la imagen siguiendo el procedimiento de arrastrar o explorar desde el ordenador o desde

una URL y cuando la tengamos en la Galería seleccionaremos sobre el enlace: “Usar como imagen

destacada”

Una vez cargada veremos que en el módulo de Imagen destacada aparecerá la imagen que hemos

seleccionado. Si queremos eliminarla haremos clic sobre el enlace: “quitar la imagen destacada”

24

Módulo de Enviar Trackbacks

Los trackbacks son un modo de avisar a otros usuarios de que les hemos enlazado o mencionado. Si

en nuestra entrada hacemos referencia o enlazamos a otros sitios que hayan sido creados con

WordPress el administrador de ese sitio Web recibirá un aviso automático gracias a los pingbacks. Al

ser otro sitio de WordPress no tendremos que hacer nada, será transparente para nosotros.

El envío de trackbacks es la forma que se utiliza para notificar, a los sistemas que controlan la

información disponible en los blogs, de que algún usuario de la red ha asociado información

publicada en nuestro propio blog.

Los motores de búsqueda premian los blogs que han sido citados y los posicionan mejor en las

búsquedas, por eso es una buena cultura el enviar un trackbacks cada vez que citamos información

de otro blog (los autores lo suelen agradecer).

Como ya hemos mencionado si se enlaza a otros blogs de WordPress, serán notificados

automáticamente utilizando pingbacks, es decir no necesitamos hacer nada. Pero para los enlaces

que no reconocen pingbacks, se debe enviar un trackback al blog mediante la introducción de la

dirección del sitio web donde hemos encontrado la información a la que hacemos referencia o

citamos. Utilizaremos el siguiente cuadro, separando cada una por un espacio.

Módulo de campos personalizados (usuarios avanzados)

Es un módulo al que le pueden sacar partido los usuarios avanzados, pero para los que se inician no

tiene mucho interés. Nos ofrecen una manera de agregar información adicional a nuestro sitio.

25

Antes de seguir, hay que aclarar que WordPress tiene por defecto varios campos generales, entre los

cuales se encuentran, nombre de la entrada, subtítulo de la entrada (slug), fecha de la entrada,

categorías, etiquetas y demás.

Esta cantidad de metadatos es suficiente para la mayoría de los blogueros, pero por suerte y como

WordPress es una herramienta muy completa, permite el agregado de otros campos, dependiendo

de nuestra necesidad y de nuestros conocimientos.

Módulo de Extracto (usuarios avanzados)

El extracto es un resumen destacado de nuestra entrada y se pude hacer visible en la primera página

de nuestro sitio, así como en la categoría, archivos y páginas de búsqueda. Deberemos tener en

cuenta que el extracto no suele aparecer de forma predeterminada. Es decir, lo podemos rellenar

pero no lo veremos de forma automática. Sólo aparece en la entrada si se ha cambiado el archivo

index.php de plantilla para mostrar los Extractos en lugar de los contenidos de un mensaje (esta es

una cuestión para usuarios avanzados). No cabe duda de que le confiere un aire muy periodístico a

nuestro blog.

Si hemos sido capaces de configurarlo, WordPress usará automáticamente las primeras 55 palabras

de su entrada como el Extracto o hasta el uso de la marca Sigue leyendo →.

Si se rellena el campo del extracto utilizará esto, en vez de las 55 primeras palabras de tu entrada.

Módulo de Comentarios

26

Nos permitirá controla la interactividad de nuestro blog y la notificación de nuestros mensajes.

Recordaremos que por defecto en WordPress los comentarios siempre son moderados, es decir no

se publican nunca si el Administrador no los aprueba previamente.

Esta sección alberga dos casillas de verificación: Permitir comentarios de esta entrada y permitir

trackbacks y pingbacks en este post.

Si la casilla “Permitir comentarios” no está marcada, no se podrán enviar comentarios a esta entrada

en particular.

Si la casilla “Permitir trackbacks y pingbacks” no está marcada, no se puede publicar pingbacks o

trackbacks a esta entrada en particular.

Módulo de Autor

Aparecerá un desplegable con la lista de todos los autores del blog. Por defecto carga el nombre del

usuario que se ha autentificado pero se puede seleccionar otro de la lista con el fin de atribuirle o

reconocerla como el autor de la entrada. Para ver la lista de usuarios, consulte la ficha o panel

Usuarios en el margen izquierdo.

Módulo de Formato

Permite incorporar información a WordPress sobre las

características principales que definen a nuestra entrada.

Los Formatos de Entrada son un método que nos permitirá dar

una presentación diferente a cada entrada específica. Con éste

módulo que se añade en la columna de la derecha a la hora de

crear una nueva entrada podremos especificar el “formato” de

dicha entrada. Recordademos que los Formatos de Entrada se

usan para dar estilos diferentes a distintos tipos de entradas.

27

Por ejemplo, si se trata de una galería de imágenes seleccionaremos la opción prevista para una

galería, si es una entrada corriente le aplicaremos la opción “Estándar”, etc… Esto permite dar una

manera rápida y sencilla un estilo diferente a cada tipo de entrada en función de su temática o

contenidos.

Tendremos que tener en cuenta que el funcionamiento de este módulo depende del tipo de Tema

que utilicemos. Es probable que con algunos temas no funcione y no incorpore ningún formato

específico.

Módulo de Revisiones

Permite ver las distintas versiones y cambios que se han realizado en la entrada. En aquellas entradas

que pueden haber sido modificadas por varios autores, quedará registrada grabada la fecha, hora y

usuario que ha realizado la modificación.

Esta función resulta muy interesante pues nos permite recuperar y restaurar una versión más

antigua en el caso de perder información importante.

Módulo de Slug o Enlace permanente (conveniente no tocarlo y dejar que lo gestione

WordPress)

Después de guardar su mensaje, se creará de forma automática el enlace permanente. En el modo de

edición se muestra a continuación del título. El enlace permanente es la dirección con la que se

guarda la noticia y por tanto es la URL que utilizaremos cuando nos interese acceder a la misma.

Cada vez que se cargue la noticia será la dirección que aparece en el explorador.

28

No es conveniente tocar esta opción y deberemos dejar que la gestione WordPress. Para evitar

problemas se debería desactivar en el menú de Opciones de Pantalla.

Esta funcionalidad nos muestra la dirección potencial para la entrada, siempre y cuando tengamos

activado los “enlaces permanentes“. (Para activarlos, vaya al subpanel “Ajustes” → Enlaces

permanentes).

La URL se generará a partir de su título. Las comas, comillas, apóstrofes, y código no HTML se

cambian y se pone un guión entre cada palabra. Si su título es “Mi sitio – Aquí está mirando la

película”, será limpiado para ser “mi-sitio-Heres-aqui-esta-mirando-la-pelicula” como título. Puede

cambiar manualmente esto, y acortar a “mi-sitio-mirando-la-pelicula”.

Nota: Puede ajustar las opciones básicas para la escritura, tales como el tamaño del buzón, como las

etiquetas emoticonos que se convierten, y otros detalles: vaya a Ajustes → Escritura.

29

Más información

La información de este epígrafe ha sido sacada fundamentalmente de la noticia publicada en el Blog

central de los Centros Educativos: “Escribir y publicar entradas”

Para acceder a un sencillo videotutorial: “Cómo crear una entrada en el blog del centro con

WordPress”

Otras noticias publicadas en el Blog central de los Centros Educativos que están relacionadas:

“No quiero que todas las entradas aparezcan en la página de inicio”

3. Insertar imagen Cuando se escribe una entrada en el blog seguramente les surgirá la necesidad de usar imágenes

para decorar o ilustrar la misma.

30

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 que se ha subido 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.

1. 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 Subir/Insertar

:

31

2. Al seleccionar la opción de “Subir/Insertar” 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.

3. 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.

4. 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.

32

5. 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.

6. Si escribimos algún texto en la opción “Leyenda” aparecerá publicado como texto explicativo de

la imagen.

7. 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.

8. Decidiremos la alineación donde nos gustaría que aparezca la imagen en nuestra entrada.

9. 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.

10. Cuando tenemos completados los datos del menú “Añadir una imagen” pulsaremos sobre

“Insertar en la entrada” y regresaremos al menú de “Añadir nueva entrada”

donde acabaremos de organizar y escribir la noticia que vamos a publicar.

11. Ya solo que tenemos que recolocar 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.

12. Como consejo, colocar la foto después de poner el texto.

33

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):

1. Localizamos la imagen en Internet y con el botón derecho copiamos la ruta de la imagen.

2. Colocaremos el curso en el lugar donde queremos insertar la imagen y buscaremos el botón de

Subir/Insertar que aparece en la parte superior del editor de texto.

3. Al seleccionar la opción de “Subir/Insertar” 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 pestaña que pone “Desde una URL” y se desplegará un menú para introducir los datos

de la foto.

34

4. 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 los diferentes datos con el título de la imagen,

texto alternativo, leyenda. Además decidiremos donde queremos que aparezca la imagen:

Ninguno, Izquierda, Centrar o Derecha.

5. Es importante el poner un nombre a la foto. De esta forma hacemos accesible la página a las

personas con discapacidad visual.

6. Una vez se hayan completado todos los datos haremos clic sobre “Insertar en la entrada”

.

Agregar una galería

Otra forma de gestionar las imágenes que queremos poner en las entradas es creando una galería de

imágenes.

Una galería mostrará un conjunto de imágenes en miniatura conectada a una determinada entrada o

página. Si subimos imágenes utilizando el botón agregar una imagen durante la edición/creación de

la entrada o la página, éstas se adjuntarán automáticamente a la galería multimedia de la entrada o

página en cuestión. Con la opción de arrastrar imágenes desde nuestro ordenador que hemos visto

anteriormente se pueden arrastrar varias imágenes juntas que se asociarán a la entrada o página.

En cambio, si se suben imágenes directamente a la biblioteca multimedia mediante el subpanel

Librería Multimedia → Añadir nuevo, las imágenes no estarán asociadas a ninguna entrada o página

por lo que habrá que adjuntarlas si queremos que se visualicen en las mismas o antes de que puedan

aparecer en una galería.

35

A continuación mostramos un ejemplo de una galería de imágenes:

Ejemplo de una galería – en el ejemplo la leyenda contiene un enlace (mediante código HTML). En la

última versión de WordPress esta función está cortada, es decir no se pueden poner enlaces en la

leyenda.

Pasos para crear una galería:

1. Edita una entrada o página. Si se trata de una nueva entrada o página, asegúrate de añadir

un título y guardar borrador al menos una vez antes de intentar una galería. Con esto

conseguiremos que WordPress asocie las imágenes que vayamos subiendo a esa entrada.

2. Haz clic en el botón que se utiliza para añadir una imagen Subir/Insertar.

36

3. Si en la pestaña aparece (0) o (1) no se podrá hacer una galería pues se

necesitan varias imágenes.

4. Selecciona los archivos para cargar, ya hemos mencionado que se pueden seleccionar varias

imágenes y subirlas todas juntas.

5. Al seleccionar varias imágenes se irán subiendo poco a poco.

6. Una vez se hayan subido todas haremos clic en el botón Guardar todos los cambios.

37

7. Observar que ya tenemos cuatro elementos en la galería (4). Procederemos a personalizar la

configuración (tenga en cuenta que puede volver atrás y cambiar la configuración

posteriormente).

8. Haga clic en Insertar galería.

9. Ejemplo de como quedaría la galería que hemos configurado.

Imágenes sacadas de morguefile.com

38

Edición de una galería

1. Primero tendremos que abrir o editar el mensaje o la página en la que se haya insertado la

galería que queremos editar asegurándonos de que estamos en el modo de edición Visual.

2. Luego haremos clic en la galería y clic en el icono Editar galería que aparece.

3. En nuestro caso vamos a ordenar las imágenes por lo que introduciremos un número de

orden junto a cada imagen.

4. Asegúrate de seleccionar la opción de “orden del menú” en la opción “Ordenar imágenes

por:” en las “Opciones de la galería” si desea personalizar la imagen con el pedido (ver

detalles más abajo).

5. Haz clic en Mostrar junto a cada imagen para cambiar el título, la descripción para cada

imagen y/o añadirle una leyenda (admite código HTML).

6. Asegúrate de hacer clic en el botón Guardar todos los cambios antes de intentar actualizar la

configuración de cualquier galería.

7. Haga clic en Actualizar configuración de la galería. Ver los resultados comparados con la

primera galería que hemos subido.

39

Hemos reordenado las fotos a nuestro antojo. (Imágenes sacadas de morguefile.com)

Opciones de la galería

Las opciones de la galería nos permiten controlar varios parámetros al crear la galería de imágenes.

1. Enlazar miniaturas a:

Archivo de Imagen: Un enlace directo a la imagen subida a tamaño completo.

Página de Adjuntos: Una página especializada en su blog que muestra la imagen en su tema

seleccionado.

2. Ordenar imágenes por: las opciones disponibles son “Orden del menú“, “Título“, “Fecha/hora” y

“Aleatorio“.

3. Orden: Ascendente o Descendente

4. Columnas de la Galería: el número de columnas de

imágenes para mostrar. Esto puede verse afectada por la

elección del tema, así que asegúrese de probar un poco

con el tema actual.

Los títulos, texto alternativo, leyenda y descripciones de las

imágenes se gestionan a través del enlace Mostrar/Ocultar

junto a cada imagen o por medio de la biblioteca multimedia.

También puede utilizar los controles de aquí para colocar la

imagen en su entrada por separado de la galería.

40

Código abreviado: [gallery] (Para usuarios avanzados)

El código abreviado (también llamado “shortcode”) de galería es el código HTML con el que

WordPress incrusta una galería en una entrada o página. Se puede utilizar en su forma más simple

que es con la que se incrusta una galería por defecto: [gallery] (este código se mostrará en un línea

sola en el cuerpo de la entrada o de la página y lo podremos ver en el modo de edición HTML).

Los usuarios avanzados que utilicen este tipo de código, para gestionar sus galerías de imágenes,

podrán introducir características que no están disponibles en el modo visual. Pero para ello tendrán

que escribir una serie de consignas dentro del código abreviado o shortcode [gallery] , estas nuevas

instrucciones se irán añadiendo dentro de los corchetes y a continuación una de otra y separadas por

un espacio. Ejemplo: [gallery link=”file” columns=”2” id="123"]

No profundizaremos más sobre el tema pero para aquellos usuarios que tengan interés los dirigimos

a 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 HTML“.

La publicación de imágenes

Todos y todas conocemos los dichos de “una

imagen vale más que mil palabras“, o “una

imagen habla por si sola” y aunque, como

todos ya sabemos, hoy en día tenemos líneas

de conexión a Internet muy potentes, y ya no

prima tanto el peso de las páginas, siempre

hay que tener en cuenta el tamaño y peso de

los archivos gráficos al maquetar nuestras

noticias.

Los estilos minimalistas están de moda. La

sobriedad en nuestras publicaciones suele

primar al carnaval en los diseños Web de hace

Imagen del tigre: ucumari via photopin cc

41

años, pues puede hacer perder seriedad a nuestras publicaciones (e incluso credibilidad), siempre

dependiendo a quién esté dirigido nuestro blog (no es lo mismo un blog en el que nuestro público

sean niños pequeños o que sean otros docentes).

En WordPress tenemos, de antemano, mucho camino recorrido en la elección de nuestro tema. Pero

son las imágenes que vamos incorporando en nuestras entradas, páginas y en la barra lateral

(blogroll, etc…) las que le confieren un diseño atractivo. Ahora con Internet tenemos al alcance de

nuestra mano millones de fotografías, dibujos y vídeos con, por ejemplo, el grandioso servicio de

búsqueda por imagen de Google, repositorios multimedia, fotoblogs, youtube, y en general toda la

Web.

http://youtu.be/t99BfDnBZcI

Pero no es oro todo lo que reluce y debemos de ser muy cuidadosos. El que una imagen esté

disponible en Internet no significa que sea libre para usarla. Una de las prácticas más importantes a

la hora de publicar en Internet es no usar nunca imágenes que tengan derechos de autor y de las

cuales no tengamos permiso para ser utilizadas.

Pero esto no debe amedrentarnos. En muchos casos podremos usar imágenes de nuestra propia

cosecha (hoy en día poca gente no posee cámara digital y tenemos ingentes cantidades de fotos que

podemos utilizar) pero sin vulnerar derechos de imagen de quien pose en ellas y cogiendo la

costumbre de tener los permisos oportunos.

Al principio, lo normal es que tengamos en cuenta esto, pero con el paso del tiempo nos vamos

“relajando” y, con las prisas y el poco tiempo que tenemos para todo, terminamos cometiendo el

error de publicar una imagen con derechos de autor, con los potenciales problemas legales que nos

puede generar.

Repositorios de imágenes

Nuestra primera tarea debería ser familiarizarnos con las licencias de uso libre de contenido como

Creative Commons o similares. Existen multitud de repositorios que contienen imágenes donde sus

42

autores establecen este tipo de licencia de libre uso (con algunas restricciones). Entre todos los que

existe, podemos destacar algunos:

1. PhotoPin, es un motor de búsqueda de

imágenes basado principalmente en

Flickr lo que garantiza una calidad para

las fotos bastante buena, además

cuenta con las opciones de

previsualización y descarga.

PhotoPin, nos permite descargar la

imagen en varios tamaños (75×75, 100×56,…así hasta 6 diferentes) de esa manera nos

ahorramos tiempo en editar el tamaño. También nos proporciona el link de la foto y si lo

deseamos podemos copiar el código html e insertarlo en el blog.

2. MorgueFile, es un directorio de fotografías digitales de media y alta resolución desde donde

puedes descargar y utilizar documentos gráficos. Las fotografías

se pueden utilizar libremente siempre que no se utilicen como

parte de una transacción económica y no se reclame la autoría.

El archivo dispone de gran variedad de recursos clasificados en categorías y subcategorías.

3. Stock.xchng, es un sitio que permite a los fotógrafos compartir sus obras, comentarlas en

fórums y mantenerlos en contacto por chat.

Las fotografías expuestas podrán ser usadas como fondo de

pantalla, para nuestro blog personal… más de 200.000 fotos de

15.000 fotógrafos participantes.

4. 123RF, 123RF.com y sus colaboradores presentan un mundo de

imágenes gratuitas. Usted puede descargar estas imágenes

completamente gratis y no serán contabilizadas en su descarga

mediante créditos ni tampoco afectarán su cuota de descarga para el día.

Podremos descargar y usar las imágenes de resolución web bajo los términos de la Licencia

para imágenes gratuitas (uso limitado a 10,000 copias) de 123RF.com.

5. Let`s CC, que además de buscar imágenes incluye vídeos, sonidos, documentos.

6. Pixabay, es un repositorio donde tendremos la posibilidad de elegir un formato para la web o

la imagen original (posiblemente ocupa un poco más de espacio). Es ideal para descargar

imágenes de “Public Domain” sin copyright lo cual es muy interesante para usar en algunos

trabajos pero sin tener que atribuir datos del creador.

7. Clker, es un sitio web desde donde no solo podemos bajar imágenes gratis de dominio

público sino también cliparts, esto es, diseños o diagramas hechos con vectores y

representando diversas figuras o diseños. La base de datos de cliparts online es útil para usar

en presentaciones pero también en diseños variados.

8. Foter, es un buscador que permite escrutar por licenciamiento de imagen y que además

ofrece un plugin para WordPress con el cual podemos integrar su buscador en el propio

editor de WordPress para facilitar la búsqueda e inserción de imágenes en blog.

9. Photl , ofrece imágenes en baja resolución que se pueden descargar gratis y sirven como

imágenes para blogs o sitios web que pueden ser utilizadas de forma no comercial. Se trata

de un banco de imágenes gratis que ofrece una buena calidad de imagen y una completa

43

base de datos o stock fotográfico para recorrer en sus galerías online. Para imágenes

comerciales se cobra un precio de derechos de autor que no supera los 4 USD.

También existen ciertos repositorios con imágenes vectoriales:

1. Vector Hunter, es un sitio web que justamente ofrece un buscador de vectores gratis o de

licencia libre que se encuentran en la red. El sitio cuenta con un buscador de vectores

organizado por categorías para localizar vectores de todo tipo y descargar vectores gratis.

2. Freepik, es un buscador de fotos y vectores gratis en español. Una buena alternativa para

encontrar gráficos que podemos emplear en nuestros blogs sin problemas de licencia.

Por tanto, nuestra tarea consistirá, entre otras, cosa en utilizar contenido que no vulnere los

derechos de autor.

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

44

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.

45

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

http://youtu.be/OUo3KMkOETY

46

También nos puede resultar útil conocer el significado de cada uno de los dibujos que aparecen en

los distintos logos. Vamos, los tipos de licencias.

http://youtu.be/4g-xejxVfus

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.

47

1. Cuando terminemos, haremos clic en el botón “Escoja una licencia“.

2. 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).

48

3. 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.

4. 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.

49

5. 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.

6. 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.

7. Podemos ver el resultado en nuestro blog:

50

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:

1. “Cómo crear una galería de imágenes con editor en modo de edición HTML “

2. “Gestionar una imagen que ya se ha subido a la librería multimedia”

3. “Incluir y excluir imágenes de una galería”

4. Cómo crear enlaces o hipervínculos dentro de una noticia 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

1. Resaltar el texto que deseamos vincular y cerciorarse de que tenemos seleccionado el editor

Visual.

2. Hacer clic en el enlace de la barra de herramientas del editor de texto: “Insertar / Editar

Enlace” .

3. 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”.

51

4. 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).

5. Hacer clic sobre Añadir enlace

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

1. Resaltar el texto que deseamos vincular y fijarse de que tenemos activado el editor HTML.

2. Hacer clic en el enlace de la barra de herramientas: “link” .

3. 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”.

52

4. 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).

5. Finalmente hacer clic sobre Añadir enlace

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

1. Resaltar el texto que deseamos vincular.

2. 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.

3. 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.

4. 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.

53

5. 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:

6. 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:

54

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.

5. 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.

55

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.

56

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.

6. Artículos de lectura y tutoriales publicados en el Blog de los Centros Relacionados con la creación de Entradas

Revisiones

La escritura libre de distracciones

57

Publicar esto

Formatos de mensaje

Edición en línea

Como publicar entradas en WordPress desde Microsoft Office Word 2010

Editor Visual

Editores

Página de Inicio

No quiero que todas las entradas aparezcan en la página de inicio

Relacionados con las Imágenes

Ajustes » Multimedia

¿Subir desde una URL?

Enlaces » Enlaces de imagen

Imágenes » Edición de imagen

Imágenes » Alineación de la imagen

Imágenes » Insertar una imagen

Incluir y excluir imágenes de una galería

Cómo crear una galería de imágenes con editor en modo de edición Visual

Cómo crear una galería de imágenes con editor en modo de edición HTML

Gestionar una imagen que ya se ha subido a la librería multimedia

Relacionados con la creación de Enlaces

Enlaces » Enlaces a documentos

Enlaces » Enlaces de imagen

Enlaces » Enlaces en la barra lateral en Widget de Texto

Enlaces » Enlaces de correo electrónico (Email) Enlaces

Añadir un vínculo a otra web, blog,… en el menú de Enlaces