Generateblocks, element contenidor

  1. Propòsit:
    • El bloc Contenidor té com a objectiu principal agrupar i contindre altres blocs. Proporciona un contenidor visual i estructural que permet organitzar i personalitzar la presentació dels elements dins d’ell.
  2. Característiques Clau:
    • Disseny Flexible: Permet ajustar l’ample del contenidor per a adaptar-se a les necessitats específiques del disseny.
    • Fons Personalitzable: Oferix opcions per a personalitzar el fons del contenidor, incloent-hi colors i gradients.
    • Marges i Farciments: Facilita el control precís dels marges i farciments al voltant del contenidor.
    • Opcions de Responsividad: Permet definir comportaments específics per a diferents grandàries de pantalla, assegurant una presentació adequada en dispositius mòbils i d’escriptori.
  3. Ús Comú:
    • Seccions i Blocs Complexos: Utilitzat per a crear seccions de pàgina o blocs més complexos en organitzar altres blocs dins d’ell.
    • Personalització Estilística: És fonamental per a la personalització estilística avançada de seccions específiques d’una pàgina.
  4. Integració amb Gutenberg:
    • Totalment integrat amb l’editor de blocs Gutenberg de WordPress, la qual cosa facilita la creació i personalització de contingut visualment atractiu.
  5. Compatibilitat amb GenerateBlocks:
    • Interactua sense problemes amb altres blocs proporcionats per GenerateBlocks, la qual cosa permet una flexibilitat i coherència en el disseny.

Generateblocks, element reixeta

  1. Propòsit:
    • El bloc Grid està dissenyat per a permetre als usuaris crear i personalitzar sistemes de quadrícula flexibles en les seues pàgines. Proporciona una estructura organitzada i versàtil per a col·locar i alinear altres blocs de manera precisa.
  2. Característiques Clau:
    • Divisió en Columnes: Facilita la creació de sistemes de columnes personalitzables per al disseny de contingut.
    • Alineació i Espaiat: Permet alinear i ajustar l’espai entre les columnes, brindant un control detallat sobre el disseny.
    • Ample Variable: Possibilita establir amples variables per a cada columna, permetent dissenys més complexos.
    • Personalització Estilística: Oferix opcions per a personalitzar el fons, vores i altres estils per a les columnes i el contenidor de la quadrícula.
    • Opcions de Responsividad: Permet definir comportaments específics per a diferents grandàries de pantalla, assegurant una presentació òptima en dispositius mòbils i d’escriptori.
  3. Ús Comú:
    • Disseny de Pàgina Avançat: Ideal per a estructures de pàgina més complexes, especialment quan es requerix un disseny basat en columnes.
    • Seccions Especialitzades: Utilitzat per a crear seccions amb columnes diferents, la qual cosa facilita la presentació visualment atractiva del contingut.
  4. Integració amb Gutenberg:
    • Totalment integrat amb l’editor de blocs Gutenberg de WordPress, facilitant la construcció i personalització de contingut.
  5. Compatibilitat amb GenerateBlocks:
    • Funciona de manera coherent amb altres blocs proporcionats per GenerateBlocks, permetent una combinació eficient per a dissenys personalitzats.

Generateblocks, element capçalera

  1. Propòsit:
    • El bloc Headline s’utilitza per a inserir i personalitzar títols o encapçalats en una pàgina o entrada de WordPress. Oferix opcions avançades de disseny i estilització per a ressaltar visualment el text del titular.
  2. Característiques Clau:
    • Textos Dinàmics: Permet ingressar text per al titular de manera fàcil i ràpida.
    • Personalització Tipogràfica: Oferix opcions detallades per a personalitzar la tipografia, com el tipus de lletra, grandària, pes i color del text.
    • Opcions de Fons: Permet agregar fons, ombres i altres efectes visuals al titular per a destacar-lo.
    • Alineació i Espaiat: Proporciona controls precisos per a alinear i ajustar l’espaiat del titular.
    • Animacions: Pot admetre animacions d’entrada, proporcionant un aspecte dinàmic al titular.
  3. Ús Comú:
    • Titulars Destacats: Ideal per a destacar seccions clau o informació important en una pàgina.
    • Encapçalats de Pàgina: Utilitzat per a crear encapçalats visuals cridaners per a diferents seccions d’una pàgina o entrada.
  4. Integració amb Gutenberg:
    • Totalment integrat amb l’editor de blocs Gutenberg de WordPress, la qual cosa facilita la inserció i personalització de titulars sense haver de recórrer al codi HTML.
  5. Compatibilitat amb GenerateBlocks:
    • Funciona sense problemes amb altres blocs proporcionats per GenerateBlocks, permetent una coherència en el disseny i la personalització.

Generateblocks, element botó

  1. Propòsit:
    • El bloc Button s’utilitza per a inserir i personalitzar botons en una pàgina o entrada de WordPress. Proporciona opcions avançades de disseny i estilització per a crear botons atractius i cridaners.
  2. Característiques Clau:
    • Text Personalitzat: Permet ingressar el text del botó de manera fàcil i ràpida.
    • Estilització Avançada: Oferix opcions detallades per a personalitzar l’aparença del botó, incloent-hi colors, tipografia, vores i ombres.
    • Enllaços i Accions: Pot vincular-se a pàgines, publicacions, URL externes o realitzar accions específiques en resposta a clics.
    • Grandàries Variables: Permet ajustar la grandària del botó per a adaptar-se al disseny general de la pàgina.
    • Animacions: Admet animacions d’entrada per a agregar dinamisme visual al botó.
  3. Ús Comú:
    • Anomenades a l’Acció: Ideal per a botons que encoratgen als usuaris a realitzar accions específiques.
    • Botons de Navegació: S’utilitza per a crear botons de navegació visualment destacats.
    • Vinculació a Elements: Pot utilitzar-se per a vincular-se a altres seccions de la pàgina, publicacions relacionades o recursos externs.
  4. Integració amb Gutenberg:
    • Totalment integrat amb l’editor de blocs Gutenberg de WordPress, la qual cosa facilita la inserció i personalització de botons sense la necessitat de coneixements de programació.
  5. Compatibilitat amb GenerateBlocks:
    • Funciona de manera coherent amb altres blocs proporcionats per GenerateBlocks, permetent una combinació eficient per a dissenys personalitzats.

Incorporació del plugin Generateblocks a PortalEdu

Imatge Categoria Millores

GenerateBlocks és un conjunt de blocs per a WordPress dissenyat per a facilitar la creació i personalització de dissenys en pàgines i entrades del lloc. Els blocs són els components bàsics que s’utilitzen en l’editor de blocs de WordPress (Gutenberg), que reemplaça a l’antic editor clàssic.

GenerateBlocks proporciona blocs addicionals que poden ser utilitzats per a construir i dissenyar pàgines de manera més flexible. Algunes de les característiques comunes dels blocs de GenerateBlocks inclouen:

  1. Disseny Responsiu: Els blocs estan dissenyats per a adaptar-se a diferents grandàries de pantalla i dispositius.
  2. Personalització Avançada: Permeten una àmplia gamma d’opcions de personalització per a controlar l’aparença i el disseny dels elements en la pàgina.
  3. Rendiment Optimitzat: S’enfoca en l’eficiència i el rendiment per a assegurar que les pàgines carreguen ràpidament.

Tipus de blocs:

En esta actualització s’ha afegit quatre tipus de blocs. Està previst anar afegint nous tipus de blocs en futurs desplegaments:

  • Contenidor: El bloc Contenidor té com a objectiu principal agrupar i contindre altres blocs. Proporciona un contenidor visual i estructural que permet organitzar i personalitzar la presentació dels elements dins d’aquest.
  • Reixeta: El bloc Grid està dissenyat per a permetre als usuaris crear i personalitzar sistemes de quadrícula flexibles en les seues pàgines. Proporciona una estructura organitzada i versàtil per a col·locar i alinear altres blocs de manera precisa.
  • Capçalera: El bloc Headline s’utilitza per a inserir i personalitzar títols o encapçalats en una pàgina o entrada. Oferix opcions avançades de disseny per a ressaltar visualment el text del titular.
  • Botó: El bloc Button proporciona opcions avançades de disseny a l’hora d’inserir i personalitzar botons en una pàgina o entrada.

Els blocs accessibles des del cercador de l’editor estàndard prement sobre “Veus a tots

Una vegada desplegats tots els blocs de Gutenberg, sota l’epígraf GENERATEBLOCKS estaran disponibles els nous blocs

Bloc iframe

Imatge Categoria Millores

Amb el bloc d’iframe podrem inserir iframes de forma senzilla en les pàgines i posts de PortalEdu.

1-Des de l’editor estàndar, busquem el bloc:

2-Introduïm l’URL que volem inserir com a iframe (ha de començar per https://):

3-Quan hàgem completat l’URL, apareixerà la pàgina referida:

4-Ara podem configurar la resta d’opcions, en la columna de configuració, a la dreta:

Podem configurar:

  • Amplada: responsiva en % o absoluta en píxels.
  • Alçada: la configurarem sempre en píxels.
  • Barra de desplaçament: Depenent del contingut, quan estiga activa, es mostrarà la barra de scroll a la dreta per tal de navegar l’iframe de dalt a baix.
  • Permet pantalla completa: Depenent del contingut, permetrà que l’iframe ocupe tota la pantalla.
  • Càrrega diferida: Carrega el contingut de l’iframe després de pintar la resta de contingut de la pàgina on es trobe. Així accelerem la càrrega de la pàgina de PortalEdu.

Inserció d’iframes amb codi de substitució (shortcode)

És possible inserir iframes amb el shortcode corresponent, tant des de l’editor de WordPress com des de l’editor visual. Per exemple:

iframe shortcode mestreacasa

Exemple no permés:

iframe tag no permés

Exemple permés:

iframe shortcode youtube

Per tal d’inserir l’iframe des de l’editor de blocs, podem escriure directament el shortcode, amb la sintaxi que es veu en els exemples anteriors. Alternativament, podem afegir un bloc de “Codi de substitució” o bé un bloc “HTML personalitzat” i escriure-hi dins el codi de l’iframe,

Gutenberg giny codi substitució

Cal tindre en compte que no tots els llocs permeten ser embeguts i que en PortalEdu només funcionaran URLs HTTPS.

En cas que vulgueu mostrar continguts d’altres webs, una altra alternativa és que utilitzeu en el Menú de pàgines de la vostra web un element de tipus Enllaç Personalitzat.

Precaucions quan inserim iframes:

Quan obtenim un codi d’iframe de continguts externs, hem de revisar i editar si cal, alguns paràmetres del codi, si no volem que el contingut incrustat ocupe tota la pàgina o la deixe inutilitzable.

Així, per exemple, aquest es un codi d’inserció obtingut de genially (que no podem inserir directament):

Per tal d’inserir-lo en el nostre post, hauríem de eliminar, o ajustar, alguns parámetres, com aquests:
width=”1600px” height=”901px”
position: absolute; top: 0; left: 0;

A més a més, hem d’utilitzar el shortcode d’iframe. Quedaria així:

O si volem especificar l’alçària en pixels (p.e 500px):

Propietat intel·lectual (Consideracions sobre allò que publiquem en el web)

Imagen Categoría General

Us recordem que és il·legal la publicació no autoritzada de material subjecte a drets d’autor (llibres, material d’editorials, cançons, vídeos, imatges…).


Els titulars han de respectar la regulació vigent sobre el tractament de dades personals i la propietat intel·lectual, tal com s’indica en les condicions d’ús del portal:
https://portal.edu.gva.es/portal/va/condicions-dus-del-portal/

Configuració de podcasts

Alguns llocs en PortalEdu publiquen podcasts de la ràdio escolar.

Aquests podcasts s’allotgen habitualment en el sharepoint DOCUMENTAR del centre i es publiquen en PortalEdu mitjançant un bloc d’Àudio.

Aquest bloc es configura amb l’URL del fitxer d’àudio.

Però això no és suficient si volem que els nostres podcasts siguen llegits correctament per diferents aplicacions de lectura de podcasts a través de feeds de RSS, com per exemple AntennaPod, o altres.

Per tal d’aconseguir el funcionament correcte amb eixes aplicacions, haurem d’afegir al nostre post un camp personalitzat de tipus enclosure, on afegirem les metadades del nostre fitxer de podcast.

Potser t’interesse consultar la informació sobre camps personalitzats:

https://portal.edu.gva.es/portal/va/us-de-camps-personalitzats/

Ho farem així:

1-Mentre editem el post, en la, part de baix, secció de camps personalitzats, busquem en el desplegable si existeix algun amb el nom enclosure. Si existeix, el seleccionem. Si no, farem clic sobre Introdueix un nou i escriurem: enclosure

2-Una vegada hàgem seleccionat el nom enclosure o bé l’hàgem afegit, haurem de completar el valor, de la següent manera, en tres línies diferents:

Línia 1: URL del post (la mateixa URL que hem posat en el bloc d’àudio)

Línia 2: 0 (zero)

Línia 3: audio/ogg (tipus de fitxer perquè ho puguen interpretar les aplicacions de lectura de podcats a través d’RSS)

3-I clicarem el botó “Afegeix un camp personalitzat”

4-Sempre que afegim un camp personalitzat, no hem d’oblidar clicar sobre Actualitza en el camp personalitzat mateix. També hem d’actualitzar el nostre post.

5-Finalment, és convenient invalidar la memòria cau del nostre lloc, si volem que els lectors de feeds RSS agarren els canvis ràpidament. Si no invalidem manualment, els lectors de feeds podran veure els canvis passada mitja hora aproximadament. En l’enllaç següent trobareu informació sobre com invalidar la cau:

https://wiki.edu.gva.es/gvait3du/tiki-index.php?page=Gesti%C3%B3-Cau-PortalEdu

Ús de camps personalitzats

WordPress permet la utilització de camps personalitzats en els posts. Aquests camps personalitzats o, en anglés custom fields, són metadades que s’associen als nostres posts amb diferents finalitats.

Si no hem utilitzat mai aquests camps personalitzats, potser haurem de configurar el nostre editor per tal d’accedir-hi a la configuració.

1-Aneu a la pantalla d’edició de qualsevol entrada o pàgina.

2-Feu clic sobre els tres punts de dalt a la dreta

3-En la part de baix, aneu a preferències:

4-En la secció Tauler –> Addicional –> Camps personalitzats

5-Activeu l’opció de camps personalitzats. Fixeu-vos que ens adverteix que el post ha d’estar guardat abans d’aplicar la configuració, per a no perdre res del que hàgem fet.

6-Cliqueu sobre Activa i recarrega; WordPress eixirà del post actual (per això havia d’estar guardat prèviament) i us obrirà un de nou, on podreu visualitzar els camps personalitzats en la part de davall:

7-D’ara en avant, tindreu a la vista els camps personalitzats sempre que editeu un post.

Trobareu informació addicional en el següent enllaç: