Saltar navegación

Activa JavaScript para disfrutar de los vídeos de la Mediateca.

Curso Wordpress básico. Tutorial 11. Creando una galería

Ajuste de pantalla

El ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:

Subido el 16 de enero de 2019 por Jose Tomas A.

80 visualizaciones

Vídeo tutorial que explica cómo crear una galería de imágenes con el plugin Photo Gallery

Más información Transcripción

Descargar la transcripción

Bienvenidos a este nuevo tutorial, hoy vamos a aprender a crear una galería de imágenes. 00:00:11
Bueno, pues lo primero que vamos a hacer va a ser bajar a seleccionar el plugin que gestiona nuestras galerías de imágenes. 00:00:17
Se llama Fotogalerie, tenemos que hacer clic en él, y aquí al hacer clic nos muestra las galerías que actualmente ya tenemos creadas en la página web. 00:00:25
De una forma muy sencilla, tan solo tendríamos que dar al botón añadir nueva, aquí. 00:00:35
ponemos el título de la galería 00:00:42
y en principio no vamos a hacer nada más 00:00:48
no vamos a previsualizar ninguna imagen ni nada sino que vamos a 00:00:51
seleccionar las imágenes 00:00:55
bueno pues 00:00:57
vamos a dar aquí al botón añadir imágenes 00:00:58
y se nos abre esta ventana 00:01:03
que es un explorador de 00:01:05
del plugin este de fotografía 00:01:08
son unas carpetas que se crean directamente 00:01:11
en este plugin 00:01:15
y esto se utiliza para no mezclar con el editor de medios que es donde tenemos 00:01:16
todas las fotografías de la página web, los iconos, 00:01:21
las imágenes de las entradas o noticias 00:01:26
entonces aquí las tenemos un poquito apartadas y no se nos mezclan 00:01:29
entonces lo que podemos hacer muy rápidamente sería crear primero una 00:01:32
carpeta donde vamos a subir las fotografías que queremos poner en la galería bueno pues 00:01:38
para crear una carpeta vamos aquí a este icono damos un título y aceptamos aquí tenemos la 00:01:44
carpeta que se nos ha creado ahora lo que tenemos que hacer sería meternos dentro de esta carpeta 00:01:57
con doble clic ya estamos dentro de la carpeta que ahora mismo está vacía bueno pues aquí le 00:02:02
damos al botón subir archivos. Podemos arrastrar las imágenes que queremos subir. Bueno, voy 00:02:11
a subir algunas imágenes desde mi explorador, seleccionamos todas estas imágenes que hay 00:02:20
en esta carpeta y arrastramos aquí. Aquí se están subiendo todas las imágenes y aquí 00:02:42
aparecen las que ya se han ido subiendo. Las procesa durante unos segundos para reducir 00:02:56
un poquito su tamaño sin perder calidad y aquí tenemos las imágenes en nuestra carpeta, podemos navegar por ejemplo si subimos un nivel 00:03:01
volvemos a entrar en la carpeta pruebas y efectivamente aquí tenemos las imágenes, bueno pues estas imágenes que acabamos de subir 00:03:11
vamos a incrustarlas o añadirlas a nuestra galería de pruebas, pues entonces le vamos a seleccionar todo y al botón añadir las imágenes 00:03:21
a la galería desde la que estamos trabajando, y aquí vemos como tenemos todas las imágenes que ya pertenecen a nuestra galería prueba, en este momento ya sí que podríamos poner 00:03:31
una imagen carátula de la galería, entonces la seleccionamos lógicamente de una de las que acabamos de subir, esto está en la carpeta de pruebas, por ejemplo, esta, 00:03:46
Ahora lo que vamos a hacer, si bajamos aquí estas opciones de avanzado, podríamos poner una descripción a nuestra galería y en principio también podríamos ir poniendo descripciones y cambiar el título a cada una de las imágenes. 00:04:03
Esto es un trabajo ya ir imagen por imagen y ir poniendo las descripciones. 00:04:25
En principio como no vamos a meternos en tanto detalle, ya hemos añadido las imágenes, solo tenemos que guardar los cambios en nuestra galería. 00:04:33
Para guardar los cambios nos vamos aquí y hay un botón que debe estar mal traducido que pone tasar, le damos a tasar y ya hemos guardado nuestra nueva galería, se ha guardado, para comprobarlo podemos ir a la base de nuestro plugin, aquí, y ya vemos nuestra galería prueba. 00:04:42
Bueno, otra cosa que podemos crear son grupos de galerías. Vamos a suponer que queremos crear galerías de actividades deportivas y dentro de esas actividades deportivas habría una galería de excursión a la nieve, otra galería de piragüismo del 2017, etc. 00:05:08
Entonces para eso lo que hacemos es venir aquí a la opción de grupos de la galería, ahora mismo tenemos dos y voy a crear un nuevo grupo, por ejemplo este título, bien ya hemos puesto un título al grupo y ahora lo que habría que hacer sería añadir galerías de las que tenemos ya creadas que queremos que pertenezcan a este grupo, 00:05:29
Yo le voy a añadir dos, por ejemplo esta y la que acabamos de crear de prueba, no, vamos a añadir esta de piragüismo y esta que acabamos de añadir de prueba, agregamos al grupo de la galería. 00:06:04
Ya sabemos que entonces tenemos que el grupo de prueba contiene dos galerías, piragüismo y prueba, tan solo tenemos que dar a este botón de tasar para que se guarden los cambios. 00:06:22
Muy bien, pues ya tenemos creado el contenido, la galería o el grupo de galerías. 00:06:35
Ahora nos toca ver cómo publicar estos contenidos. 00:06:42
Bueno, pues lógicamente las galerías tienen que ir incrustadas dentro de un contenido, 00:06:45
una entrada, como pues en una noticia, o directamente en una página. 00:06:51
Vamos a hacer el ejercicio con una página de pruebas que tengo aquí. 00:06:56
me meto y aquí ahora voy a proceder a incrustar mi galería, bueno pues voy a eliminar esto y vamos a hacer que esta fila tenga una sola columna 00:07:04
bien, pues comenzamos añadiendo un bloque de texto, ¿por qué un bloque de texto? porque la forma de publicar las galerías es mediante shortcode 00:07:18
Añadimos el bloque de texto, borramos este texto ejemplo y ahora vamos a darle a o bien este icono o bien este botón, que hacen el mismo efecto. 00:07:32
Aquí nos generaría el shortcode y aquí directamente nos pregunta por qué galería queremos incrustar la fotografía. 00:07:46
Vamos a verlo, nos sale esta ventana, elegimos primero qué aspecto queremos que tenga la galería. 00:07:53
Como no hemos comprado este plugin solo nos ofrece estas tres opciones, o bien miniaturas que es lo más común que solemos hacer, o bien galería que solo aparezca una fotografía y al ir pasando a izquierda y derecha aparezcan las siguientes, un navegador o un estilo de blog que van una a continuación de la otra. 00:08:01
voy a elegir miniaturas, tengo que aquí definir qué galería quiero incluir 00:08:23
pues aquí tengo la galería prueba 00:08:28
así aquí el tema light que solo hay dos, el oscuro y el claro 00:08:30
que sería que quiero que aparezca de fondo si una pantalla negra o una pantalla blanca 00:08:36
cuando veo la galería, bueno voy a ponerla en blanco de momento 00:08:41
y en principio no habría que hacer nada más 00:08:45
inserto la publicación 00:08:48
y a mi me ha quedado en esta publicación este icono 00:08:50
si yo guardo los cambios 00:08:53
y actualizo la página 00:08:56
vamos a ver como se muestra esta galería 00:08:58
aquí efectivamente están todas las imágenes de la galería 00:09:05
si yo hago clic en una imagen 00:09:15
como he elegido el entorno blanco, luminoso 00:09:20
pues de fondo aparece el blanco, aquí tengo para ir pasando izquierda y derecha todas las fotografías de la galería 00:09:25
aquí tengo para cerrar esto y volver a la pantalla donde se veían todas las miniaturas 00:09:32
si abro una imagen y aquí le doy a maximizar se ve a pantalla completa 00:09:37
si dentro de esta pantalla le doy al botón, o dentro o fuera, si yo ahora lo minimizo y le doy al botón play 00:09:45
pues cada 3 segundos va a ir cambiando la fotografía 00:09:54
y no tengo que estar yo tocando botones de avanzar izquierda y derecha 00:10:00
voy a pausarlo, si le doy a la I de información me mostrará 00:10:05
aquí abajo el título o la descripción 00:10:10
lo que haya yo puesto en las propiedades de esta imagen 00:10:13
bueno pues entonces vamos a cerrar el contenido 00:10:18
y vamos a ver cómo podríamos también mostrar una galería, que es simplemente, en lugar de mostrar todas las imágenes directamente, 00:10:23
es mostrar la portada de la galería. Vamos a ir a editar esto, borramos el contenido de nuestra shortcode y aquí nos aparecen las mismas opciones de antes. 00:10:33
En lugar de elegir el tipo de vista miniatura, podría mostrar el tipo galería. 00:10:53
Entonces guardamos los cambios, actualizamos y en la visualización en el entorno real, 00:11:01
Ahora ya no se ve en las miniaturas 00:11:11
Sino que se ve una imagen con unos pequeños botones 00:11:18
Para ir pasando de imágenes en imágenes 00:11:24
Esa sería otra forma de ver la galería 00:11:28
Bueno, pues si en lugar de ver directamente la fotografía 00:11:31
Quisiéramos acceder al grupo de galerías 00:11:37
Lo podríamos hacer del siguiente modo 00:11:41
En esta ocasión voy a borrar el shortcode y a crear uno nuevo para que veáis cómo se realiza con este icono en lugar de con este botón 00:11:43
Si le doy aquí, se abre una ventana similar 00:11:53
Y ahora lo que queríamos era añadir un grupo de galerías 00:11:58
Bueno, pues entonces aquí tenemos la otra pestaña, grupo de galerías 00:12:03
El modo de la vista podría ser compacto para que solo me muestre la portada de todas las galerías que tiene en su interior el grupo. 00:12:06
Masonry que es una especie de cuadrícula pero con distintos tamaños de las fotografías o de las fotografías de las portadas de cada una de las galerías. 00:12:17
Y extendido que es ocupar todo el ancho de pantalla. 00:12:29
Bueno, yo le voy a mostrar de modo compacto y que me muestre el grupo de prueba. 00:12:33
El tema ahora lo voy a mostrar a lo oscuro para que veáis cómo funciona y voy a insertarlo en la publicación. 00:12:39
Se me ha creado este shortcode, que aquí me figura como un icono, que por dentro lo que tiene es este shortcode. 00:12:47
Bueno, guardamos los cambios en el bloque de texto, actualizamos la página 00:12:55
y vamos a ver como la ha creado, actualizo esto y efectivamente aquí vemos el aspecto que le ha dado a nuestro grupo de galerías, 00:13:01
si yo le doy aquí a esta galería se abren todas las imágenes que tiene dentro la galería de piragüismo, 00:13:16
Si hago clic en una imagen, pasamos como veíamos en la explicación anterior, lo único que con un fondo negro, porque ahora tenemos el entorno de fondo negro. 00:13:26
Si yo cierro aquí, tengo aquí todas las imágenes y con el botón atrás volvería a todas las del grupo de galerías. 00:13:38
Así es como funciona. Es bastante sencillo de utilizar y a la hora de organizar las imágenes es bastante cómodo el tenerlas por carpetas en nuestro plugin. 00:13:50
Bueno pues hasta aquí la explicación de este tutorial. Seguimos. 00:14:05
Idioma/s:
es
Materias:
Informática, Tecnologías de la Información
Autor/es:
José Tomás Alonso García
Subido por:
Jose Tomas A.
Licencia:
Reconocimiento - Sin obra derivada
Visualizaciones:
80
Fecha:
16 de enero de 2019 - 0:24
Visibilidad:
Público
Enlace Relacionado:
irfb.es
Centro:
IES RAFAEL FRUHBECK DE BURGOS
Descripción ampliada:
Vídeo tutorial creado para el apoyo a Proyecto de Formación en el Centro para el profesorado
Duración:
14′ 13″
Relación de aspecto:
1.78:1
Resolución:
1920x1080 píxeles
Tamaño:
97.01 MBytes

Del mismo autor…

Ver más del mismo autor

EducaMadrid, Plataforma Educativa de la Comunidad de Madrid

Plataforma Educativa EducaMadrid