El bloque pestañas nos ayuda a mostrar contenidos organizados en pestañas. Estas pueden estar dispuestas vertical u horizontalmente.
Este bloque permite trabajar de dos formas:
Entradas. Permite seleccionar las entradas de una categoría y visualizar los títulos, dejando el cuerpo o el inicio del cuerpo de la entrada oculto hasta que se selecciona la pestaña correspondiente. Esta modalidad resulta recomendable para presentar información relacionada.
Contenido personalizado. Si se elige contenido personalizado, el componente nos permitirá crear elementos con un título y un contenido que se visualizarán tal y como sucede en el caso de elegir el modelo de entradas. Mostrando el título y ocultando el contenido, que se visualizará al seleccionar la pestaña correspondiente.
Los contenidos personalizados se confeccionan utilizando bloques estándar de gutenberg!
Selección de los colores del contorno y de las pestañas:
La configuración del plugin nos permite seleccionar ambos colores. El color del texto de las pestañas no es configurable. Cambiará automáticamente de negro a blanco en función del fondo escogido, para favorecer el mejor contraste y legibilidad de los textos.
La opción de contenido completo solo está disponible cuando el bloque se inserta en una página y no en una entrada.
Podemos ver un ejemplo de bloque de pestañas de tipo «Entradas» a continuación
En este artículo explicaremos la vista de lista de bloques del editor Gutenberg de WordPress, su utilidad, el funcionamiento del arrastre y reordenación de bloques, y las ventajas específicas cuando se trabaja con bloques contenedores. 1.-Introducción La vista de lista de Gutenberg (o List View) es una de las herramientas más potentes y menos aprovechadas del editor de bloques de
Como sabéis, WordPress ofrece una serie de patrones (o plantillas) genéricos que podemos incorporar a nuestras entradas o páginas. Estos patrones nos ofrecen diseños concretos, elaborados con bloques del editor estándar. Una vez añadidos a nuestro contenido, podremos editarlos y personalizarlos a nuestro gusto. Veamos cómo hacerlo. 1-Acceso a los patrones Cuando creamos una nueva entrada o página, o bien
1-¿Cómo nos ayudan las categorías en wordpress? Las categorías de WordPress nos permiten agrupar las entradas en grandes grupos para poder gestionar o visualizar aquellas entradas relacionadas con esa categoría. Un sitio web puede tener categorizados diferentes temas. Por ejemplo, novedades, secretaría, general, preguntas frecuentes, o niveles educativos como primaria, secundaria, etc… La categorización del contenido es útil en muchos
Hemos incorporado a Portaledu el plugin Blocks Animation, que nos permite dotar de efectos animados a prácticamente cualquier bloque de Gutenberg. En este post os enseñaremos cómo utilizar esta funcionalidad. 1-Animación de textos. Efecto de escritura o tecleo. En los elementos de texto, como párrafo, titular, encabezado, etc., veremos una nueva opción en el menú contextual de opciones del bloque.
Bloque contenedor con titular y botón En este post aprenderemos a utilizar el bloque contenedor para confeccionar un conjunto como el siguiente: Este es un bloque contenedor: Este es un bloque titular Este es un botón En el cual tenemos: Un bloque contenedor padre, que engloba todo el conjunto y que contiene: Una imagen de fondo, así como una capa
La persona con rol direcció, como responsable del sitio web del centro, es quien debe dar de alta los usuarios y asignarles los diferentes roles, en función del papel que deban desempeñar en el portal. Para eliminar usuarios que ya no pertenezcan al centro, deberá ejecutar la sincronización completa (explicada más adelante).
Solo para usuarios con rol direcció.
Desde el escritorio de administración del sitio se puede ejecutar la sincronización de los usuarios del centro.
Para ello hay que navegar al menú: Usuarios > Sincronización
SINCRONIZACIÓN MANUAL (RECOMENDADA)
Seguramente no todo el personal de un centro va a tener tareas de edición en Portaledu. Se puede sincronizar manualmente uno o varios usuarios seleccionando las casillas de cada fila. A continuación habría que desplegar «Acciones masivas» y seleccionar «Sincronizar selección».
SINCRONIZACIÓN COMPLETA
Para iniciar una nueva sincronización de todo el centro hay que pulsar sobre el botón «Sincronización profesorado». Esta acción recuperará todos los profesores de Itaca y les asignará el rol que les corresponda según la configuración establecida por el administrador de la red.
En caso de que haya usuarios no sincronizados o cambios entre Itaca y WordPress, las filas afectadas aparecerán con fondo rojo.
ELIMINACIÓN DE USUARIOSY ASIGNACIÓN DE PERMISOS
La sincronización de usuarios (completa) eliminará del sitio a todo el personal que no pertenezca ya al centro (según conste en Itaca).
La dirección del centro podrá otorgar o remover roles a los miembros del sitio. Todo ello puede hacerse desde la sección de Usuarios –> Todos los usuarios
Se trata de un potente editor visual que se va reforzando constantemente con la incorporación de plugins y desarrollos que aportan nuevos bloques para enriquecer nuestras publicaciones.
Se recuerda a aquellos usuarios de Portaledu en cuyos sitios está todavía activo el editor Beaver Builder (también conocido como editor visual), que deben ir abandonando este editor. Este plugin fue incorporado en los inicios de Portaledu porque ofrecía una forma de edición visual que no aportaba en aquel momento el editor clásico de WordPress, en su versión 4.9. Este plugin ha continuado ofreciendo a algunos usuarios de Portaledu una edición visual y numerosos componentes de visualización, que han sido y son apreciados por ellos. Sin embargo, ese editor resulta excesivamente pesado para asegurar un funcionamiento óptimo de nuestra plataforma. A pesar de ello, se ha mantenido en Portaledu durante varios años, para dar tiempo a una transición paulatina a Gutenberg. Mientras tanto, el editor de bloques de WordPress ha ido evolucionado en funcionalidad.
En este momento, la funcionalidad que ofrece el editor de bloques resulta más que suficiente para satisfacer los requerimientos de cualquier web en Portaledu.
Os recordamos algunas funcionalidades (bloques) disponibles en el editor estándar:
Gutenberg es el editor nativo de WordPress, basado en bloques.
Dadas las limitaciones del editor clásico de WordPress en los inicios de PortalEdu; se decidió añadir Beaver Builder como editor al proyecto.
Ahora, gracias al gran crecimiento en funcionalidad experimentado por el editor nativo de WordPress, dada su mejor integración con la plataforma, que se traduce en un mejor rendimiento y mayor compatibilidad con futuras actualizaciones, es el momento de realizar la transición por parte de aquellos usuarios que aún utilizan Beaver Builder en Portaledu.
Con este artículo se quiere ofrecer información sobre cómo crear contenidos con Gutenberg, para aquellos usuarios habituados a utilizar Beaver Builder, o incluso migrar contenidos realizados con el editor Beaver Builder a Gutenberg.
Pasos para convertir un «Post sencillo»
Por «un post sencillo» nos referimos a entradas/páginas que no hacen uso de los módulos más elaborados de diseño de Beaver como son Contenidodeslizante, Acordeón, Barralateral y Pestañas. Ni tampoco de los elementos dinámicos englobados dentro de la pestaña «Entradas» del editor y que son Carruselde entradas, Controldeslizante y Entradas.
Para convertir este tipo de posts, es suficiente con pulsar en Editar desde el listado de páginas o entradas y en la siguiente pantalla hacer click sobre «Usar el editor estándar» en vez de sobre «Launch Editor Visual». Al hacer esto se cargará el editor Gutenberg que intentará migrar los contenidos automáticamente.
Advertencia: Al hacer esto y darle a guardar, la entrada original creada con el editor visual será reemplazada con la nueva versión en Gutenberg, y no habrá vuelta atrás. Así pues, si se quiere mantener la entrada original mientras se hacen pruebas de conversión del contenido, habría que hacerlo siguiendo los pasos que a continuación se detallan:
En caso de querer mantener la copia original creada con el editor visual, es suficiente con copiar los contenidos de la entrada desde el editor visual (en visualización, no en edición), pegar éstos en un post nuevo creado con el editor estándar y retocar/maquetar lo copiado. Estos son los pasos:
Crear un Nuevo Post en Gutenberg
Ve a «Entradas» en WordPress y crea un nuevo post (o página, según corresponda).
Por defecto, las nuevas páginas y posts se crean con el editor estándar.
Copiar el Contenido desde Beaver Builder
En una pestaña del navegador, abre el post de Beaver Builder que deseas convertir.
Selecciona y copia el contenido relevante que desees convertir.
Pegar y Reestructurar el Contenido
Pega el contenido copiado en el nuevo post Gutenberg.
Convierte cada parte en su bloque nativo correspondiente (párrafo, encabezado, imagen, etc.). La mayoría de estas conversiones serán realizadas automáticamente por Gutenberg para los bloques que sean equivalentes dentro de este editor.
Reemplazo de Elementos Visuales no compatibles
Sustituye los módulos de Beaver Builder con los bloques equivalentes de Gutenberg (ver tabla abajo).
Asegúrate de que los estilos y formatos se mantengan.
Ajustar el Diseño
Gutenberg permite columnas, encabezados, imágenes y botones sin necesidad de un constructor externo.
Utiliza bloques avanzados de Gutenberg como «Grupo«, «Columa» , «Cuadrícula«, «Fondo» para un mejor diseño.
Revisión y Publicación
Una vez completada la conversión, revisa que el diseño y los formatos sean correctos.
Publica el post en Gutenberg cuando estés satisfecho con la conversión.
Pasos para convertir un post con elementos de diseño o dinámicos
La conversión de posts más elaborados que incluyan módulos de diseño o dinámicos, aunque sencilla, no es tan directa como la migración de posts más sencillos.
En este caso en vez de partir de una copia del contenido del post original en Beaver, habrá que ir creando con Gutenberg un post nuevo replicando el post a migrar. Para ello se irán añadiendo los bloques de Gutenberg que proporcionan la misma funcionalidad que los elementos utilizados en Beaver siguiendo la tabla de conversión mostrada a continuación.
Elemento
Módulo de Beaver Builder
Bloque de Gutenberg
Carrusel de contenido propio
Medios / Contenido deslizante
GVA-Bloques – Contenedor animado
Texto / MetaSlider
Acordeón
Diseño / Acordeón
GVA Bloques – Acordeón
Barra lateral
Diseño / Barra lateral
Columnas o Tabla o Cuadrícula
Pestañas
Diseño / Pestañas
GVA Bloques – Pestañas
Carrusel de entradas
Entradas / Carrusel de entradas
GVA Bloques – Carrusel de Entradas
Visualizador de entradas
Entradas / Entradas
GenerateBlocks / Bucle de consulta
Slider
Entradas / Control deslizante
GVA Bloques – Visor deslizante de Entradas
Contenedor con imágenes, texto, botones
Llamada
Bloque contenedor (combinado con otros bloques en su interior como Titular, Imagen, Botón)
Accesible desde la Mediateca, el plugin de reemplazo de ficheros permite sustituir un fichero manteniendo la URL del fichero original. Debido la naturaleza de esta operación, que puede afectar a cualquier documento publicado en la web, es una utilidad disponible sólo para los roles dirección y mantenimiento.
Esta funcionalidad puede resultar útil para actualizar documentación en la web de centro sin necesidad de modificar la entrada/página donde se ha publicado un enlace al documento.
Caso práctico: Si se dispone de un post informativo que enlaza o muestra el menú mensual del comedor (PDF o imagen), bastaría con reemplazar mensualmente el fichero para mantener actualizada la información, sin necesidad de editar la entrada.
Modo de empleo
Acceder a la Mediateca
Seleccionar el fichero a reemplazar haciendo click sobre él
En el diálogo de edición, a la derecha, con los detalles del fichero ahora aparece un nuevo botón Reemplazar archivo.
Tras pulsarlo, en la nueva pantalla, arrastrar o seleccionar el fichero que sustituirá al archivo actual.
Las limitaciones son que solo se pueden reemplazar ficheros que no sean ficheros de imagen. Sí se pueden reemplazar ficheros PDF. El fichero reemplazado solo puede reemplazarse con un fichero del mismo tipo (misma extensión).
Portaledu está aumentando las herramientas disponibles en el editor Gutenberg. Dentro de esta serie de bloques que estamos incorporando, presentamos el bloque visor deslizante de entradas.
Este bloque permite seleccionar las entradas de una categoría y visualizarlas en diapositivas, de una en una, de modo circular, realizando una presentación de las mismas y añadiendo así dinamismo a las páginas. De cada entrada se mostrará, a ancho completo del contenedor, la imagen destacada y, opcionalmente, el extracto de la misma.
Resulta ideal para la presentación visual de categorías como noticias u otros temas, ya que el bloque elegirá las últimas entradas de la categoría seleccionada para su presentación. Podemos ver un ejemplo a continuación 👇🏽
El bloque es fácilmente configurable desde el editor, presentando las siguientes opciones:
Categoría. Al elegir una categoría, las entradas pertenecientes a esta, ordenadas descendentemente por fecha de creación, serán seleccionadas para su visualización
Número de entradas. Número total de entradas seleccionadas para su visualización. Si se deja en su valor por defecto 5, optarán a la visualización las cinco últimas entradas pertenecientes a la categoría elegida.
Duración de cada diapositiva. Tiempo en milisegundos que permanecerá visualizada una diapositiva. Pasado dicho tiempo, el visor mostrará la siguiente.
Mostrar extracto. Indica si en las diapositivas se mostrarán o no las primeras líneas de las entradas.
Fondo Blanco/Negro: Metadatos de la entrada en negro sobre fondo blanco o a la inversa.
Cubrir fondo con la imagen: Esta opción amplia la imagen i la recorta para que ocupe tot el fons del contenidor.
Los elementos que estarán siempre presentes en las dispositivas y cuya presencia no es configurable son:
Imagen destacada de la entrada. En caso de que la entrada carezca de imagen personalizada, se utilizará una imagen por defecto propia del bloque.
Título de la diapositiva
Fecha de su creación
Enlace (leer más) para navegar hasta la entrada.
Podemos también configurar el color de los puntos y flechas de navegación del visor, así como ocultar cualquiera de los elementos.
El bloque acordeón nos ayuda a mostrar contenidos de forma desplegable, permitiendo al lector centrarse inicialmente solamente en los títulos.
Este bloque permite trabajar de dos formas:
Entradas. Permite seleccionar las entradas de una categoría y visualizar los títulos, dejando el cuerpo o el inicio del cuerpo de la entrada oculto hasta que es desplegado por el usuario al hacer click en el «+» a la derecha del título. Esta modalidad resulta recomendable para presentar una serie de artículos a modo de formación.
Contenido personalizado. Si se elige contenido personalizado, el componente nos permitirá crear elementos con un título y un contenido que se visualizarán tal y como sucede en el caso de elegir el modelo de entradas. Mostrando el título y ocultando el contenido, que puede ser desplegado mediante el botón «+» Este componente así empleado es muy típico verlo por ejemplo en páginas de FAQs (Frequently Asked Questions)
Los contenidos personalizados se confeccionan utilizando bloques estándar de gutenberg!
Podemos ver un ejemplo de acordeón de tipo «Entradas» a continuación 👇🏽
Contador de visitas
El plugin: «Contador de Visitas Matomo» tiene como objetivo poder mostrar el número de visitas que se realizan a nuestros sitios web. Este contador de visitas obtiene la información a partir del sistema de analítica llamado Matomo, que aloja los datos de analítica en los servidores de Conselleria, no dependiendo de terceros. 1.-Inserción del contador mediante bloque de Gutenberg (Novedad
Los roles con capacidad para gestionar el sitio web, habitualmente direcció y manteniment, pueden modificar el Nombre del sitio (título) y su descripción (lema). Esta configuración se realiza desde el Escritorio –> Ajustes –> General Desde esa sección, se pueden modificar esos valores, entre otros. Además, es posible modificar los valores para cada idioma. Para ello, es necesario aplicar el
Gravity Forms es un plugin integrado en PortalEdu que permite crear formularios fácilmente para recoger información de los usuarios, como formularios de contacto, inscripciones, solicitudes o encuestas. Con este plugin podemos: Crear formularios personalizados. Recibir notificaciones por correo cuando alguien envía un formulario. Consultar y gestionar las respuestas enviadas. Insertar formularios en páginas o entradas del sitio web. 1. Crear
Cambios masivos en entradas (modificar entradas en lote)
WordPress nos permite realizar ciertas modificaciones sobre un grupo o lote de entradas. Estas modificaciones se aplicarán simultáneamente a todas las entradas seleccionadas. Entre las acciones que podemos aplicar sobre varias entradas a la vez, tenemos: Asignar una categoría Cambiar el estado (pasar a borrador o a publicada) Cambiar el idioma Mostraremos un ejemplo de cómo asignar una categoría a
Se ha añadido en PortalEdu la posibilidad de utilizar breadcrumbs (migas de pan). Esta funcionalidad permite mostrar al usuario la ruta de navegación dentro de la web. ¿Qué son los breadcrumbs? Los breadcrumbs son un elemento de navegación que muestra al visitante en qué lugar de la web se encuentra y cómo ha llegado hasta esa página. Se suelen mostrar
El bloque es fácilmente configurable desde el editor, presentando las siguientes opciones en función del tipo de contenido seleccionado:
Tipo de contenido. Permite seleccionar entre Post / Contenido personalizado. Lo cual hará que el bloque acordeón funcione con entradas ya creadas o bien permita crear nuevo contenido. En función del tipo elegido las opciones del bloque mostradas más abajo variarán.
Categoría. Al elegir una categoría, las entradas pertenecientes a esta, ordenadas descendentemente por fecha de creación, serán seleccionadas para su visualización
Número de entradas. Número total de entradas seleccionadas para su visualización. Si se deja en su valor por defecto 5, optarán a la visualización las cinco últimas entradas pertenecientes a la categoría elegida.
Contenido completo. Indica si al visualizar el desplegable se mostrará el contenido completo de la entrada o bien el primer párrafo de esta más un enlace para seguir leyendo. (La opción de contenido completo solo está disponible cuando el bloque se inserta en una página y no en una entrada)
Tipo de contenido. Permite seleccionar entre Post / Contenido personalizado. Lo cual hará que el bloque acordeón funcione con entradas ya creadas o permita crear nuevo contenido. En función del tipo elegido las opciones del bloque mostradas más abajo variarán.
Añadir nuevo elemento. Añade un nuevo bloque al acordeón. El formulario presentado se divide en Título y Cuerpo. En el cuerpo del ítem o elemento, podemos utilizar bloques estándar.
Portaledu está aumentando las herramientas disponibles en el editor Gutenberg. Dentro de esta serie de nuevos bloques que se van a ir incorporando, presentamos el bloque de carrusel.
Este bloque permite seleccionar las entradas de una categoría y visualizarlas en diapositivas de modo circular, realizando una presentación de las mismas y añadiendo así dinamismo a las páginas.
Resulta ideal para la presentación visual de categorías como noticias u otros temas, ya que el bloque elegirá las últimas entradas de la categoría seleccionada para su presentación. Podemos ver un ejemplo a continuación 👇🏽
El bloque es fácilmente configurable desde el editor, presentando las siguientes opciones:
Categoría. Al elegir una categoría, las entradas pertenecientes a esta, ordenadas descendentemente por fecha de creación, serán seleccionadas para su visualización
Número de entradas. Número total de entradas seleccionadas para su visualización. Si se deja en su valor por defecto 5, optarán a la visualización las cinco últimas entradas pertenecientes a la categoría elegida.
Duración de cada diapositiva. Tiempo en milisegundos que permanecerá visualizada una diapositiva. Pasado dicho tiempo, el carrusel rotará para seleccionar la siguiente.
Entradas por diapositiva. Con un valor mínimo de 2 y máximo de 4. Permite seleccionar cuántas diapositivas mostrará el carrusel simultáneamente.
Mostrar extracto. Indica si en las diapositivas se mostrarán o no las primeras líneas de las entradas.
Mostrar leer más. Se puede ocultar/mostrar el enlace (leer más) para navegar a la entrada.
Mostrar fecha. Se puede ocultar/mostrar la fecha del post.
Los elementos que estarán siempre presentes en las dispositivas y cuya presencia no es configurable son:
Imagen destacada de la entrada. En caso de que la entrada carezca de imagen personalizada, se utilizará una imagen por defecto propia del bloque carrusel.
Título de la diapositiva
También podemos crear un carrusel minimalista, solamente con las imágenes destacadas de los posts. Para hacerlo, activaremos la opción Ocultar información de la entrada y seleccionaremos una proporción de la imagen.
Este bloque comprende toda la funcionalidad del bloque de Últimas Entradas, permitiendo además al usuario un control total de la apariencia.
Si deseas mostrar diferentes entradas en modo de listado o en paneles con varias columnas, te interesa este bloque de generateblocks llamado Query Loop o Bucle de Consulta. Este bloque permite mostrar dinámicamente listas de contenido.
Usando el bucle de consulta, puedes mostrar las entradas más recientes de tu blog o seleccionar entradas de categorías específicas en tu página de inicio o en una sección destacada. Este contenido puede ser personalizado a través de una interfaz intuitiva según las condiciones que establezcamos, como pueden ser el tipo de publicación (entradas, páginas, eventos), categorías, etiquetas o autores.
¿Cómo funciona el bloque de Bucle de Consulta?
Al insertar un bloque de bucle de consulta en una página o publicación de WordPress usando GenerateBlocks, se te ofrecen diferentes plantillas predeterminadas, cuya configuración podrás personalizar después. En este caso, vamos a escoger la plantilla de dos columnas con imagen destacada:
Puedes configurar parámetros como:
Tipo de contenido: Puedes elegir mostrar entradas, páginas o eventos.
Filtros: Seleccionar contenido basado en categorías, etiquetas, autores, fechas, entre otros. Estos filtros ayudan a que la consulta devuelva solo el contenido relevante para el contexto de la página.
Orden y límite: Puedes establecer cómo se ordenarán los resultados y cuántos elementos se mostrarán.
Diseño personalizado: Una de las grandes ventajas de GenerateBlocks es la flexibilidad de diseño. Puedes utilizar otros bloques del plugin, como el bloque de cuadrícula, encabezado o imagen, dentro del bucle de consulta para crear una estructura visual atractiva.
En el ejemplo siguiente, escogeremos que se muestren entradas o posts de una determinada categoría. En primer lugar, escogemos posts como tipo de contenido:
A continuación, deseamos establecer un filtro para que se muestren solamente las entradas correspondientes a una categoría determinada. Para ello, añadiremos un parámetro (taxonomías):
Escogemos Taxonomías:
Seleccionamos Categorías:
Entonces podremos escoger una categoría para mostrar. En la imagen os mostramos cómo queda la configuración completa de nuestro bucle de consulta:
Y a continuación os mostramos cómo queda la visualización:
Ampliar el número de columnas de visualización
Vemos que en la plantilla predeterminada, se visualiza el panel de entradas a dos columnas. Ajustando la plantilla de la entrada, podemos variar el número de columnas de visualización. Para ello, hemos de indicar el porcentaje que ocupa cada entrada en el contenedor. Por defecto está al 50%. Para tres columnas, lo pondremos al 33%, así:
Personalización avanzada del diseño
El poder de GenerateBlocks reside en su capacidad para controlar cada aspecto del diseño. Con el bloque de bucle de consulta, no solo puedes especificar qué contenido se muestra, sino también cómo se muestra. Esto incluye:
Diseño de cuadrícula: Puedes configurar el diseño del contenido en columnas, lo que es ideal para crear portafolios o galerías.
Tipografía y estilos: Cambiar fácilmente las fuentes, colores y espaciados.
Composición flexible: Dado que GenerateBlocks está compuesto por bloques modulares, puedes construir plantillas complejas mezclando el bucle de consulta con otros bloques para lograr diseños únicos.
Te recomendamos que explores cada objeto en la estructura de tu contenido y veas sus opciones de configuración. Sin duda encontrarás todo un mundo de opciones para configurar el aspecto de tu contenido, incluyendo el comportamiento en modo responsivo, para visualización en dispositivos como tabletas y móviles.
A diferencia de las entradas (posts), las páginas en WordPress pueden tener una estructura jerárquica. Esto significa que una página puede ser padre de otra, creando una relación de dependencia.
Por ejemplo, si tienes una página llamada «Proyectos», y dentro de ella quieres incluir una sección para «Europeos», puedes hacer que «Europeos» sea una página hija de «Proyectos». Esto se reflejará en la URL, de la siguiente manera:
Este lloc web utilitza només cookies tècniques necessàries per al seu funcionament. No s’emmagatzemen dades amb finalitats publicitàries ni es comparteixen amb tercers. S’utilitza analítica interna sense cookies, i només es recull la IP amb finalitats de seguretat.