Elementos de las publicaciones
Podemos añadir una amplia variedad de elementos tanto en páginas como en entradas. Se insertan de la misma manera. Estos son algunos de los más comunes:
Columnas
Podemos insertar columnas añadiendo el bloque correspondiente mediante el icono (+). En la pestaña Elementos de diseño, seleccionamos Columnas.
Párrafo
Podemos insertar párrafos añadiendo el bloque correspondiente mediante el icono (+). En la pestaña Bloques comunes, seleccionamos Párrafo.
Imagen
Podemos insertar imágenes añadiendo el bloque correspondiente mediante el icono (+). En la pestaña Bloques comunes, seleccionamos Imagen.Esta acción abrirá una nueva ventana, donde podremos elegir cargar nuestra imagen desde nuestro equipo seleccionando la opción subir, abrir la Biblioteca de medios, para utilizar imágenes ya cargadas en nuestro WordPress o insertar la imagen desde una URL.
Galería
Podemos insertar galerías añadiendo el bloque correspondiente mediante el icono (+). En la pestaña Bloques comunes, seleccionamos Galería.Esta acción abrirá una nueva ventana, donde podremos elegir cargar nuestras imágenes desde nuestro equipo seleccionando la opción subir o abrir la Biblioteca de medios, para utilizar imágenes ya cargadas en nuestro WordPress.
Mediateca
Podemos insertar archivos de la Mediateca añadiendo el bloque correspondiente mediante el icono (+). En la pestaña Bloques comunes, seleccionamos Mediateca.
Se nos mostrarán todos los elementos que tengamos subidos a la Mediateca con la cuenta con que estemos trabajando. Así podremos seleccionar el contenido deseado.
Insertar código HTML
Podemos insertar código HTML añadiendo el bloque correspondiente mediante el icono (+). En la pestaña Formatos, seleccionamos HTML personalizado.
Esta acción abrirá una nueva ventana, donde podremos introducir código HTML.
Pulsando sobre la opción Vista previa, podremos visualizar como va quedando la edición del recurso.
Smart Slider
Smart Slider es un plugin de WordPress diseñado para crear presentaciones estáticas o dinámicas y visualmente atractivas en nuestro sitio web. Con Smart Slider, podemos integrar imágenes, videos, texto y botones con enlaces en nuestras diapositivas (slides). Las presentaciones creadas son responsivas, es decir, se adaptan a cualquier dispositivo, ya sea móvil, tableta u odenador.
Smart Slider ofrece una interfaz intuitiva para la creación de presentaciones y no precisa conocimientos avanzados.
Podemos acceder al panel de control de Smart Slider desde dos sitios.
- Desde el menú superior, pulsando sobre la opción "Smart Slider" (1).
- Desde el "Escritorio", pulsando sobre la opción "Smart Slider" del menú lateral izquierdo (2).
Panel de control
En el panel de control nos encontramos:
- "Nuevo proyecto": opción para crear una nueva presentación (1).
- Nuestros proyectos. (2)
- "Sample Slider": carrusel de ejemplo y sus configuraciones (3)
Nuevo proyecto
Para crear un nueva presentación pulsamos sobre "Nuevo proyecto" y "Crear un nuevo proyecto":
Seleccionamos el "Tipo de proyecto" que queremos crear:
- "Slider": recurso dinámico que permite configurar animación y reproducción automática. Podemos crear varias diapositivas añadiendo imágenes, texto, videos o elementos interactivos y configurar para que cambien automáticamente o mediante la interacción del usuario (por ejemplo, con flechas o puntos de navegación).
- "Bloque": recurso estático que funciona como una sola sección de contenido y no permite configurar animación ni reproducción automática. Esta opción puede ser útil para llamar la atención sobre una información determinada del centro, por ejemplo las jornadas de puertas abiertas.
Seleccionada una de las dos opciones anteriores e introducimos en los "Ajustes" (1) el "Nombre del proyecto", el ancho y el alto y el tipo de diseño. En este último caso podemos seleccionar "Ancho completo" o "Encajonado". Por último pulsamos en "Crear" (2).
Dependiendo del tema que utilicemos en nuestro espacio web, es posible que, aunque configuremos el slider con "Ancho completo", no ocupe todo el ancho de la página, sino el ancho máximo establecido en la plantilla del tema. Las configuraciones del tema siempre prevalecen por encima de cualquier otra configuración.
En la siguiente pantalla podremos "Agregar slide" (1), configurar su presentación (2) y realizar diversas acciones (3).
Agregar slide
En este apartado incluiremos los elementos multimedia (imágenes o vídeos) que queramos mostrar en la presentación.
Pulsamos sobre "Agregar slide", "Imagen" y seleccionamos las imágenes que previamente tuviéramos en la Biblioteca de medios (1) o bien desde nuestro equipo (2).
Una vez subida la imagen, nos posicionamos con el cursor del ratón sobre la diapositiva y pulsamos en "Editar".
Vemos la imagen y desde la barra lateral añadimos elementos para personalizar la diapositiva. Podemos incluir: encabezados (1), textos (2), imágenes (3), botones (4) y/o filas (5). En nuestro ejemplo hemos empleado tres elementos: encabezado, texto y botón.
Para incluir otro slide repetimos el mismo proceso.
Configuración de la presentación
Desde este apartado definimos el comportamiento de nuestra presentación: por ejemplo, que los slides (diapositivas) se muestren de manera automática, cada cuánto tiempo queremos que pase la diapositiva, así como diferentes aspectos de la apariencia de la misma.
De todas las opciones disponibles destacamos lo siguiente:
- Desde la pestaña "General" podremos modificar el tamaño de la presentación y su nombre. Así mismo, también podremos ver el "shortcode" para publicar la presentación en una página o entrada.
- Desde la pestaña "Tamaño" definimos el tamaño (alto y ancho) de la presentación.
- Desde la pestaña "Controles" establecemos la apariencia visual de nuestra presentación, habilitando las siguientes opciones:
- "Flechas" y/ o "Viñetas": si queremos que se muestren flechas y/o viñetas para desplazarse por el carrusel.
- "Barra de texto": muestra el título y la descripción de cada diapositiva y el lugar donde queremos que se muestre.
- "Miniatura": si queremos que se muestren las miniaturas de las diapositivas y la posición de las mismas.
En la siguiente imagen mostramos cómo se vería una presentación en la que hemos configurado tanto las flechas como las viñetas, ocultado la "Barra de texto" y habilitado las miniaturas para que se muestren en la parte inferior. - Activamos la pestaña "Reproducción automática" si queremos que las diapositivas cambien automáticamente, configurando un tiempo para cada transición.
Conforme vayamos realizando los cambios, podremos previsualizarlos pulsando en el icono del ojo (1).
Pulsaremos en "Guardar" (2) para conservar los cambios.
Acciones
La opción "Acciones" nos permite, entre otras opciones, cambiar el tipo de slider, exportarlo, duplicarlo o eliminarlo.
Editar slider
Podemos editar nuestros proyectos en cualquier momento. Para ello nos situamos encima del proyecto de nuestro interés y pulsamos sobre "Editar".
Las opciones de edición nos permiten:
- Editar el orden de presentación de las diapositivas: seleccionamos la diapositiva con el botón izquierdo del ratón y, sin soltar, la movemos a otro lugar.
- Editar cada slide (diapositiva) individualmente.
- Duplicar, copiar, despublicar, establecer como primero o eliminar presentaciones.
Si no queremos que se muestre una diapositiva de la presentación, podemos ocultarla seleccionando la opción "Despublicar". - Modificar la configuración del slider (presentación).
Publicar una presentación (slider)
Para publicar nuestra presentación, debemos acceder a su edición y desde la pestaña "General" copiar su shortcode.
Accedemos a la página haremos lo siguiente para publicar el shortcode:
- Si empleamos el editor HTML, pegamos el shortcode que hemos copiado anteriormente.
- En el caso de emplear SiteOrigin Page Builder, tenemos que emplear el widget "Smart Slider" y seleccionar el proyecto de nuestro interés.
- Si estamos empleando el editor de bloques, localizamos y seleccionamos el bloque "Smart Slider" o el recurso"Shortcode".
En la siguiente imagen podemos ver cómo queda nuestra presentación una vez publicada.