EDITOR GUTENBERG

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

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 acordeón.

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

Podemos ver un ejemplo de acordeón de tipo «Entradas» a continuación 👇🏽

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.

• 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, más dos botones que permiten duplicar y eliminar el elemento.

Con la actualización a WordPress 6.3, se ha añadido la posibilidad de gestionar los bloques en el editor Gutenberg, de forma que un usuario puede decidir qué bloques se le muestran al editar un post.

La ocultación funciona por usuario, no por sitio. En caso de que un usuario pertenezca a más de un sitio de Portaledu, las preferencias que haya configurado para el editor Gutenberg le acompañarán, independientemente del sitio en que trabaje en cada momento.

Los pasos necesarios para acceder al diálogo de ocultación son:

1. Desde el editor Gutenberg, hacer click sobre los «tres puntos» de la esquina superior derecha de la pantalla.

2. Pulsar sobre la última opción de menú: «Preferencias»

3. En el diálogo que aparece, hacer click sobre la opción «Bloques»

4. Una vez ahí, desmarcar aquellos bloques que no se quiere que muestre el editor.

El editor de bloques nativo de WordPress es el editor por defecto para los posts / entradas / páginas de todos los sitios de Portaledu.

Para aquellos sitios creados anteriormente y que hayan utilizado el editor visual (Beaver Builder), habrá un periodo de convivencia de ambos editores (Gutenberg y Beaver) para permitir a esos sitios el mantenimiento de dichos posts. A medio plazo se prevé eliminar de Portaledu el editor Beaver Builder, dado que la funcionalidad de Gutenberg tiene una mejor integración con WordPress y es mucho más sencillo de utilizar. Conoce más información sobre el editor de bloques de WordPress: Gutenberg.

Algunos sitios en Portaledu publican podcasts de la radio escolar.

Estos podcasts se alojan habitualmente en el sharepoint DOCUMENTAR del centro y se publican en Portaledu mediante un bloque de Audio.

Este bloque se configura con la URL del fichero de audio.

Pero esto no es suficiente si queremos que nuestros podcasts sean leídos correctamente por diferentes aplicaciones de lectura de podcasts a través de feeds de RSS, como por ejemplo AntennaPod, u otras.

Para conseguir el funcionamiento correcto con esas aplicaciones, tendremos que añadir a nuestro post un campo personalizado de tipo enclosure, donde añadiremos los metadatos de nuestro fichero de podcast.

Quizás te interese consultar la información sobre campos personalizados:

¿Cómo se utilizan los campos personalizados? – Portaledu (gva.es)

Lo haremos así:

1. En edición del post, en la parte de abajo, sección de campos personalizados, buscamos en el desplegable si existe alguno con el nombre enclosure. Si existe, lo seleccionamos. Si no, haremos clic sobre Introduce uno nuevo y escribiremos: enclosure

2. Una vez hayamos seleccionado el nombre enclosure o bien lo hayamos añadido, tendremos que completar el valor, de la siguiente manera, en tres líneas diferentes:

• Línea 1: URL del post (la misma URL que hemos puesto en el bloque de audio)

• Línea 2: 0 (cero)

• Línea 3: audio/ogg (tipo de fichero para que lo puedan interpretar las aplicaciones de lectura de podcast a través de RSS)

3. Y clicaremos el botón de «Añadir un campo personalizado»

4. Siempre que añadamos un campo personalizado, no debemos olvidar clicar sobre Actualizar en el campo personalizado mismo. También tendremos que actualizar nuestro post.

5. Finalmente, es conveniente invalidar la memoria caché de nuestro sitio, si queremos que los lectores de feeds RSS cojan los cambios rápidamente. Si no invalidamos manualmente, los lectores de feeds podrán ver los cambios pasada media hora aproximadamente. En el enlace siguiente encontraréis información sobre cómo invalidar la caché: Control Caché (NGINX): plug-in para gestionar la memoria caché en Portaledu – Portaledu (gva.es)

Atención: Los iframes se utilizan para mostrar páginas web externas a Portaledu dentro de páginas o posts de nuestro portal. Antes de utilizar un iframe hemos de asegurarnos de que la fuente es fiable y de que no generará problemas en nuestra web. Por ejemplo, numerosos contadores de visitas externos acaban mostrando ventanas emergentes no deseadas y pueden propagar malware en nuestros sistemas y en los dispositivos de los usuarios que nos visitan.

Un iframe es un marco que permite insertar un documento HTML dentro de otro y en Portaledu podemos insertarlo de dos formas diferentes.

Bloque del editor Gutenberg ‘Iframe’

La forma más sencilla es utilizando el bloque de iframe, introduciendo el URL que queremos insertar, la cual tiene que empezar por https://

Podemos configurar:

• Anchura: responsiva en % o absoluta en píxeles.
• Altura: la configuraremos siempre en píxeles.
• Barra de desplazamiento: Dependiendo del contenido, cuando esté activa, se mostrará la barra de scroll a la derecha para navegar el iframe de arriba abajo.
• Permite pantalla completa: Dependiendo del contenido, permitirá que el iframe ocupe toda la pantalla.
• Carga diferida: Carga el contenido del iframe después de pintar el resto de contenido de la página donde se encuentre. Así aceleramos la carga de la página de Portaledu.

Shortcode

Una forma más compleja, que puede permitir un mayor control de los parámetros a un usuario avanzado, es la inserción de iframes mediante código de sustitución. Para ello, escribiremos directamente el shortcode, con la sintaxis que se ve en el siguiente ejemplo.

Alternativamente, podemos añadir un bloque de «shortcode» o un bloque «HTML Personalizado» del editor Gutenberg y escribir en él el código de iframe.

Precauciones

Para que sean visibles en Portaledu, hoy por hoy, los enlaces a ficheros compartidos del sharepoint, tienen que incorporar el parámetro &download=1. Se ha implementado la funcionalidad de forma que cuando peguemos o escribamos el enlace a un URL de sharepoint, si pulsamos la tecla de espacio, automáticamente se añade este parámetro.

A continuación detallamos los pasos a seguir para compartir en Portaledu documentos alojados en nuestro Sharepoint de Microsoft (imágenes, vídeos, audios…)

La publicación de ficheros en abierto solo funciona con el sharepoint DOCUMENTAR. Debéis tener en cuenta que esta funcionalidad de publicación de ficheros desde el Sharepoint de Microsoft está todavía en fase de pruebas. Es posible que no podáis visualizar determinadas imágenes de resolución grande o vídeos.

1. Compartir el fichero desde el sharepoint

Desde el menú contextual del fichero, hacemos clic sobre la opción de Compartir

2. Obtener el enlace para compartir

Tenemos que asegurarnos que esté habilitada la opción de que cualquier usuario con el enlace pueda visualizar el contenido. Después copiaremos el enlace desde la opción «Copia el enlace»

3. Insertar un bloque de imagen, vídeo, audio… y pegar o escribir el enlace

4. Pulsar la tecla espacio para autocompletar la URL del sharepoint

Al pulsar la tecla espacio, se autocompletará la URL con el parámetro &download=1, el cual resulta necesario para visualizar el fichero insertado en Portaledu.

IMÁGENES

VÍDEOS

AUDIO

ENLACE A VÍDEO EN IMAGEN