El bloc pestanyes ens ajuda a mostrar continguts organitzats en pestanyes. Aquestes poden estar disposades vertical o horitzontalment.
Este bloc permet treballar de dos formes:
Entrades. Permet seleccionar les entrades d’una categoria i visualitzar els títols, deixant el cos o l’inici del cos de l’entrada ocult fins que se selecciona la pestanya corresponent. Esta modalitat resulta recomanable per a presentar informació relacionada.
Contingut personalitzat. Si es tria contingut personalitzat, el component ens permetrà crear elements amb un títol i un contingut que es visualitzaran tal com succeïx en el cas de triar el model d’entrades. Mostrant el títol i ocultant el contingut que es visualitzarà en seleccionar la pestanya corresponent.
Els continguts personalitzats es confeccionen emprant blocs estàndard de gutenberg!
Selecció dels colors del contorn i de les pestanyes:
La configuració del plugin ens permet seleccionar els dos colors. El color del text de les pestanyesno és configurable. Canviarà automàticament de negre a blanc en funció del fons triat, per a afavorir el millor contrast i llegibilitat dels textos.
Podem veure un exemple de bloc de pestanyes de tipus «Entrades» a continuació
Com sabeu, WordPress oferix una sèrie de patrons (o plantilles) genèrics que podem incorporar a les nostres entrades o pàgines. Estos patrons ens oferixen dissenys concrets, elaborats amb blocs de l’editor estàndard. Una vegada afegits al nostre contingut, podrem editar-los i personalitzar-los al nostre gust. Vegem com fer-ho. 1-Accés als patrons Quan creem una nova entrada o pàgina, o bé
1-Com ens ajuden les categories en wordpress? Les categories de WordPress ens permeten agrupar les entrades en grans grups per a poder gestionar o visualitzar aquelles entrades relacionades amb eixa categoria. Un lloc web pot tindre categoritzats diferents temes. Per exemple, novetats, secretaria, general, preguntes freqüents, o nivells educatius com a primària, secundària, etc… La categorització del contingut és útil
Hem incorporat a Portaledu el plugin Blocks Animation, que ens permet dotar d’efectes animats a pràcticament qualsevol bloc de Gutenberg. En este post us ensenyarem com utilitzar esta funcionalitat. 1-Animació de textos. Efecte d’escriptura o tecleig. En els elements de text, com a paràgraf, titular, encapçalat, etc., veurem una nova opció en el menú contextual d’opcions del bloc. En primer
Bloc contenidor amb titular i botó En este post aprendrem a utilitzar el bloc contenidor per a confeccionar un conjunt com el següent: Aquest és un bloc contenidor: Aquest és un bloc titular Aquest és un botó En el qual tenim: Un bloc contenidor pare, que engloba tot el conjunt i que conté: Una imatge de fons, així com una
Quan estem treballant en continguts complexos, amb molts blocs, podem fer-ho més còmodament ampliant la zona d’edició. En este exemple mostrem un contingut complex, amb moltes columnes, en el qual no resulta còmode treballar en una àrea estreta: Opcions per a ampliar la zona de treball 1-Reduir el menú de l’esquerra En el menú de seccions de l’esquerra, en la
Des de l’escriptori d’administració del lloc es pot executar la sincronització dels usuaris del centre.
Per a això cal navegar al menú: Usuaris > Sincronització
SINCRONITZACIÓ MANUAL (RECOMENDADA)
Segurament no tot el personal d’un centre educatiu tindrà tasques d’edició en Portaledu. Es poden sincronitzar manualment només alguns usuaris seleccionant les caselles de cada fila. A continuació caldria desplegar “Accions massives” i seleccionar “Sincronitzar selecció”.
SINCRONITZACIÓ COMPLETA
Per a iniciar una nova sincronització de tot el centre cal prémer sobre el botó “Sincronització professorat”. Aquesta acció recuperarà tots els professors d’Ítaca i els assignarà el rol que els corresponga segons la configuració establida per l’administrador de la xarxa.
En cas que hi haja usuaris no sincronitzats o canvis entre Ítaca i WordPress, les files afectades apareixeran amb fons roig.
ELIMINACIÓ D’USUARIS I ASSIGNACIÓ DE PERMISOS
La sincronització d’usuaris eliminarà del lloc a tot el personal que no pertanga ja al centre (segons conste en Ítaca).
La direcció del centre podrà atorgar o remoure rols als membres del lloc. Tot això pot fer-se des de la secció d’Usuaris –> Tots els usuaris
Es tracta d’un potent editor visual que es va reforçant constantment amb la incorporació de plugins i desenrotllaments que aporten nous blocs per a enriquir les nostres publicacions.
Es recorda a aquells usuaris de Portaledu en els llocs dels quals està encara actiu l’editor Beaver Builder (també conegut com a editor visual), que han d’anar abandonant este editor. Este plugin va ser incorporat en els inicis de Portaledu perquè oferia una forma d’edició visual que no aportava en aquell moment l’editor clàssic de WordPress, en la seua versió 4.9. Este plugin ha continuat oferint a alguns usuaris de Portaledu una edició visual i nombrosos components de visualització, que han sigut i són apreciats per ells. No obstant això, eixe editor resulta excessivament pesat per a assegurar un funcionament òptim de la nostra plataforma. Malgrat això, s’ha mantingut en Portaledu durant diversos anys, per a donar temps a una transició gradual a Gutenberg. Mentrestant, l’editor de blocs de WordPress ha anat evolucionat en funcionalitat.
En este moment, la funcionalitat que oferix l’editor de blocs resulta més que suficient per a satisfer els requeriments de qualsevol web en Portaledu.
Us recordem algunes funcionalitats (blocs) disponibles en l’editor estàndard:
Gutenberg és l’editor natiu de WordPress, basat en blocs.
Ateses les limitacions de l’editor clàssic de WordPress en els inicis de PortalEdu; es va decidir afegir Beaver Builder com a editor al projecte.
Ara, gràcies a la potència aconseguida en funcionalitat per l’editor natiu de WordPress, atesa la seua millor integració amb la plataforma, que es traduïx en un millor rendiment i major compatibilitat amb futures actualitzacions, és el moment de realitzar la transició per part d’aquells usuaris que han continuat utilitzant Beaver Builder en Portaledu.
És per això que amb este article es vol oferir informació sobre com crear continguts amb Gutenberg, per a aquells usuaris habituats a usar Beaver Builder, o fins i tot migrar continguts fets amb l’editor Beaver Builder a Gutenberg. .
Passos per a convertir un “Post senzill”
Per “un post senzill” ens referim a entrades/pàgines que no fan ús dels mòduls més elaborats de disseny de Beaver com són Contingutlliscant, Acordió, Barralateral i Pestanyes. Ni tampoc dels elements dinàmics englobats dins de la pestanya “Entrades” de l’editor i que són Carruseld’entrades,Controllliscant i Entrades.
Per a convertir este tipus de posts senzills, és suficient amb fer clic en Editar des del llistat de pàgines o entrades i en la següent pantalla fer clic sobre “Usar l’editor estàndard” en comptes de sobre “Launch Editor Visual”. En fer això es carregarà l’editor Gutenberg que intentarà migrar els continguts automàticament.
Advertiment: En fer això i donar-li a guardar, l’entrada original creada amb l’editor visual serà reemplaçada amb la nova versió en Gutenberg, i no hi haurà marxa arrere. Així doncs, si es vol mantindre l’entrada original mentres es fan proves de conversió del contingut, caldria fer-lo seguint els passos que a continuació es detallen:
En cas de voler mantindre la còpia original creada amb l’editor visual, és suficient amb copiar els continguts de l’entrada des de l’editor visual (en visualització, no en edició), pegar estos en un post nou creat amb l’editor estàndard i retocar/maquetar allò copiat. Estos són els passos:
Crear un Nou Post en Gutenberg
Ves a “Entrades” en WordPress i crea un nou post (o pàgina, segons corresponga).
Per defecte, les noves pàgines i posts es creen amb l’editor estàndard.
Copiar el Contingut des de Beaver Builder
En una pestanya del navegador, obri el post de Beaver Builder que desitges convertir.
Selecciona i còpia el contingut rellevant que desitges convertir.
Pegar i Reestructurar el Contingut
Pega el contingut copiat en el nou post Gutenberg.
Convertix cada part en el seu bloc natiu corresponent (paràgraf, encapçalat, imatge, etc.). La majoria d’estes conversions seran realitzades automàticament per Gutenberg per als blocs que siguen equivalents dins d’este editor (textos i imatges).
Reemplaçament d’Elements Visuals no compatibles
Substituïx els mòduls de Beaver Builder amb els blocs equivalents de Gutenberg (vegeutaula a baix).
Assegura’t que els estils i formats es mantinguen.
Ajustar el Disseny
Gutenberg permet columnes, encapçalats, imatges i botons sense necessitat d’un constructor extern.
Utilitza blocs avançats de Gutenberg com a “Grup“, “Columa” , “Quadrícula“, “Coberta” per a un millor disseny.
Revisió i Publicació
Una vegada completada la conversió, revisa que el disseny i els formats siguen correctes.
Publica el post en Gutenberg quan estigues satisfet amb la conversió.
Passos per a convertir un post amb elements de disseny o dinàmics
La conversió de posts més elaborats que incloguen mòduls de disseny o dinàmics, encara que senzilla,no és tan directa com la migració de posts més senzills.
En este cas en comptes de partir d’una còpia del contingut del post original en Beaver, caldrà anar creant amb Gutenberg un post nou replicant el post a migrar. Per a això s’aniran afegint els blocs de Gutenberg que proporcionen la mateixa funcionalitat que els elements utilitzats en Beaver seguint la taula de conversió mostrada a continuació.
Accessible des de la Mediateca, el plugin de reemplaçament de fitxers permet substituir un fitxer mantenint l’URL del fitxer original. Degut la naturalesa d’esta operació, que pot afectar qualsevol document publicat en la web, és una utilitat disponible només per als rols direcció i manteniment.
Esta funcionalitat pot resultar útil per a actualitzar documentació en la web de centre sense necessitat de modificar l’entrada/pàgina on s’ha publicat un enllaç al document.
Cas pràctic: Si es disposa d’un post informatiu que enllaça o mostra el menú mensual del menjador (PDF o imatge), bastaria amb reemplaçar mensualment el fitxer per a mantindre actualitzada la informació, sense necessitat d’editar l’entrada.
Instruccions d’ús
Accedir a la Mediateca
Seleccionar el fitxer a reemplaçar fent clic sobre ell
En el diàleg d’edició, a la dreta, amb els detalls del fitxer ara apareix un nou botó Reemplaçar arxiu.
Després de polsar-ho, en la nova pantalla, arrossegar o seleccionar el fitxer que substituirà a l’arxiu actual.
Les limitacions són que només es poden reemplaçar fitxers que no siguen fitxers d’imatge. Sí que es poden reemplaçar fitxers PDF. El fitxer reemplaçat només pot reemplaçar-se amb un fitxer del mateix tipus (mateixa extensió).
Portaledu està augmentant les ferramentes disponibles en l’editor Gutenberg. Dins d’esta sèrie de blocs que estem incorporant, presentem el bloc visor lliscant d’entrades.
Este bloc permet seleccionar les entrades d’una categoria i visualitzar-les en diapositives, d’una en una, de mode circular, realitzant una presentació d’aquestes i afegint així dinamisme a les pàgines. De cada entrada es mostrarà, a ample complet del contenidor, la imatge destacada i, opcionalment, l’extracte d’esta.
Resulta ideal per a la presentació visual de categories com a notícies o altres temes, ja que el bloc triarà les últimes entrades de la categoria seleccionada per a la seua presentació. Podem veure un exemple a continuació 👇🏽
El bloc és fàcilment configurable des de l’editor, presentant les següents opcions:
Categoria. En triar una categoria, les entrades pertanyents a esta, ordenades de forma descendent per data de creació, seran seleccionades per a la visualització
Nombre d’entrades. Nombre total d’entrades seleccionades per a la visualització. Si es deixa en el valor per defecte 5, optaran a la visualització les cinc últimes entrades pertanyents a la categoria triada.
Duració de cada diapositiva. Temps en mil·lisegons que romandrà visualitzada una diapositiva. Passat este temps, el visor mostrarà la següent.
Mostrar extracte. Indica si en les diapositives es mostraran o no les primeres línies de les entrades.
Fons Blanc/Negre: Metadades de l’entrada en negre sobre fons blanc o al revés.
Els elements que estaran sempre presents en les dispositives i la presència dels qualsno és configurable són:
Imatge destacada de l’entrada. En cas que l’entrada manque d’imatge personalitzada, s’utilitzarà una imatge per defecte pròpia del bloc.
Títol de la diapositiva
Data de la seua creació
Enllaç (llegir més) per a navegar fins a l’entrada.
El bloc acordió ens ajuda a mostrar continguts de manera desplegable, permetent al lector centrar-se inicialment només en els títols.
Este bloc permet treballar de dos formes:
Entrades. Permet seleccionar les entrades d’una categoria i visualitzar-ne els títols, deixant el cos o l’inici del cos de l’entrada ocult fins que és desplegat per l’usuari en fer clic en el “+” a la dreta del títol. Esta modalitat resulta recomanable per a presentar una sèrie d’articles a mode de formació.
Contingut personalitzat. Si es tria contingut personalitzat, el component ens permetrà crear elements amb un títol i un contingut, que es visualitzaran tal com succeïx en el cas de triar el model d’entrades. Mostrant el títol i ocultant el contingut, que pot ser desplegat mitjançant el botó “+” Este component així emprat és molt típic veure’l per exemple en pàgines de FAQs (Frequently Asked Questions)
Els continguts personalitzats es confeccionen emprant blocs estàndard de gutenberg!
Podem veure un exemple d’acordió de tipus “Entrades” a continuació 👇🏽
Ús de patrons en Portaledu
Com sabeu, WordPress oferix una sèrie de patrons (o plantilles) genèrics que podem incorporar a les nostres entrades o pàgines. Estos patrons ens oferixen dissenys concrets, elaborats amb blocs de l’editor estàndard. Una vegada afegits al nostre contingut, podrem editar-los i personalitzar-los al nostre gust. Vegem com fer-ho. 1-Accés als patrons Quan creem una nova entrada o pàgina, o bé
1-Com ens ajuden les categories en wordpress? Les categories de WordPress ens permeten agrupar les entrades en grans grups per a poder gestionar o visualitzar aquelles entrades relacionades amb eixa categoria. Un lloc web pot tindre categoritzats diferents temes. Per exemple, novetats, secretaria, general, preguntes freqüents, o nivells educatius com a primària, secundària, etc… La categorització del contingut és útil
En WordPress, els continguts s’organitzen principalment en dos tipus: pàgines i entrades. Encara que els dos són elements que publiquem en la web, complixen funcions diferents i és important saber quan usar cada un. Exemple de pàgina de portada (estructura fixa) que mostra contingut dinàmic (entrades de la categoria “Notícies”) mitjançant un bucle de consulta. 1.-Què és una Pàgina? Una
Desde Portaledu presentem una nova pàgina web formativa d’un centre fictici creada per a aprendre, inspirar i mostrar totes les possibilitats que oferix una web de centre en Portaledu amb l’editor estàndard que és el ‘Centre en Proves!’ Ací podràs:💡 Descobrir exemples reals de disseny i estructura web🧭 Accedir a píndoles formatives integrades en cada bloc🛠️ Conéixer trucs i recursos
En este post aprendrem a confeccionar el menú superior del nostre lloc web: 1-Des d’on es configura el menú? El primer que hem de saber és que podem confeccionar un menú per a cada idioma del nostre lloc web. Els menús es configuren des del panell esquerre de l’escriptori: Aparença –> Menús Si tenim més d’un menú definit, en primer
El bloc és fàcilment configurable des de l’editor, presentant les següents opcions en funció del tipus de contingut seleccionat:
Tipus de contingut. Permet seleccionar entre Post / Contingut personalitzat. La qual cosa farà que el bloc acordió funcione amb entrades ja creades o bé permeta crear nou contingut. En funció del tipus triat, les opcions del bloc mostrades més a baix variaran.
Categoria. En triar una categoria, les entrades pertanyents a esta, ordenades descendentment per data de creació, seran seleccionades per a la seua visualització
Nombre d’entrades. Nombre total d’entrades seleccionades per a la seua visualització. Si es deixa en el seu valor per defecte 5, optaran a la visualització les cinc últimes entrades pertanyents a la categoria triada.
Contingut complet. Indica si en visualitzar el desplegable es mostrarà el contingut complet de l’entrada o bé el primer paràgraf d’esta més un enllaç per a continuar llegint.
Tipus de contingut. Permet seleccionar entre Post / Contingut personalitzat. La qual cosa farà que el bloc acordió funcione amb entrades ja creades o permeta crear nou contingut. En funció del tipus triat les opcions del bloc mostrades més a baix variaran.
Afegir nou element. Afig un nou bloc a l’acordió. El formulari presentat es dividix en Títol i Cos. En el cos de l’ítem o element podem utilitzar blocs estàndard.
Portaledu està augmentant les ferramentes disponibles en l’editor Gutenberg. Dins d’esta sèrie de nous blocs que s’aniran incorporant, presentem el bloc de carrusel.
Este bloc permet seleccionar les entrades d’una categoria i visualitzar-les en diapositives de mode circular, realitzant una presentació d’aquestes i afegint així dinamisme a les pàgines.
Resulta ideal per a la presentació visual de categories com a notícies o altres temes, ja que el bloc triarà les últimes entrades de la categoria seleccionada per a la seua presentació. Podem veure un exemple a continuació 👇🏽
El bloc és fàcilment configurable des de l’editor, presentant les opcions següents:
Categoria. En triar una categoria, les entrades pertanyents a esta, ordenades de forma descendent per data de creació, seran seleccionades per a la visualització
Nombre d’entrades. Nombre total d’entrades seleccionades per a la visualització. Si es deixa en el valor per defecte 5, optaran a la visualització les cinc últimes entrades pertanyents a la categoria triada.
Duració de cada diapositiva. Temps en mil·lisegons que romandrà visualitzada una diapositiva. Passat este temps, el carrusel girarà per a seleccionar la següent.
Entrades per diapositiva. Amb un valor mínim de 2 i màxim de 6. Permet seleccionar quantes diapositives mostrarà el carrusel simultàniament.
Mostrar extracte. Indica si en les diapositives es mostraran o no les primeres línies de les entrades.
Mostrar llegir més. Es pot ocultar/mostrar l’enllaç (llegir més) per a navegar fins a l’entrada.
Mostrar data. es pot ocultar/mostrar la data del post.
Els elements que estaran sempre presents en les dispositives i la presència dels qualsno és configurable són:
Imatge destacada de l’entrada. En cas que l’entrada manque d’imatge personalitzada, s’utilitzarà una imatge per defecte pròpia del bloc carrusel.
Títol de la diapositiva
També podem crear un carrusel minimalista, només amb les imatges destacades dels posts. Per a fer-ho, activarem l’opció Ocultar informació de l’entrada i seleccionarem una proporció de la imatge.
Este bloc comprén tota la funcionalitat del bloc d’Últimes Entrades, permetent a més a l’usuari un control total de l’aparença.
Si desitges mostrar diferents entrades en mode de llistat o en panells amb diverses columnes, t’interessa este bloc de generateblocks anomenat Query Loop o Bucle de Consulta. Este bloc permet mostrar dinàmicament llistes de contingut.
Usant el bucle de consulta, pots mostrar les entrades més recents del teu blog o seleccionar entrades de categories específiques en la teua pàgina d’inici o en una secció destacada. Este contingut pot ser personalitzat a través d’una interfície intuïtiva segons les condicions que establim, com poden ser el tipus de publicació (entrades, pàgines, esdeveniments), categories, etiquetes o autors.
Com funciona el bloc de Bucle de Consulta?
En inserir un bloc de bucle de consulta en una pàgina o publicació de WordPress usant GenerateBlocks, se t’oferixen diferents plantilles predeterminades, la configuració de les quals podràs personalitzar després. En este cas, triarem la plantilla de dos columnes amb imatge destacada:
Pots configurar paràmetres com:
Tipus de contingut: Pots triar mostrar entrades, pàgines o esdeveniments.
Filtres: Seleccionar contingut basat en categories, etiquetes, autors, dates, entre altres. Estos filtres ajuden al fet que la consulta retorne només el contingut rellevant per al context de la pàgina.
Orde i límit: Pots establir com s’ordenaran els resultats i quants elements es mostraran.
Disseny personalitzat: Un dels grans avantatges de GenerateBlocks és la flexibilitat de disseny. Pots utilitzar altres blocs del plugin, com el bloc de quadrícula, encapçalat o imatge, dins del bucle de consulta per a crear una estructura visual atractiva.
En l’exemple següent, triarem que es mostren entrades o posts d’una determinada categoria. En primer lloc, triem posts com a tipus de contingut:
A continuació, desitgem establir un filtre perquè es mostren solament les entrades corresponents a una categoria determinada. Per a això, afegirem un paràmetre (taxonomies):
Escollirem Taxonomies:
Seleccionem Categories:
Llavors podrem triar una categoria per a mostrar. En la imatge us mostrem com queda la configuració completa del nostre bucle de consulta:
I a continuació us mostrem com queda la visualització:
Ampliar el nombre de columnes de visualització
Veiem que en la plantilla predeterminada, es visualitza el panell d’entrades a dos columnes. Ajustant la plantilla de l’entrada, podem variar el nombre de columnes de visualització. Per a això, hem d’indicar el percentatge que ocupa cada entrada en el contenidor. Per defecte està al 50%. Per a tres columnes, ho posarem al 33%, així:
Personalització avançada del disseny
El poder de GenerateBlocks residix en la seua capacitat per a controlar cada aspecte del disseny. Amb el bloc de bucle de consulta, no sols pots especificar quin contingut es mostra, sinó també com es mostra. Això inclou:
Disseny de quadrícula: Pots configurar el disseny del contingut en columnes, la qual cosa és ideal per a crear portafolis o galeries.
Tipografia i estils: Canviar fàcilment les fonts, colors i espaiats.
Composició flexible: Atés que GenerateBlocks està compost per blocs modulars, pots construir plantilles complexes mesclant el bucle de consulta amb altres blocs per a aconseguir dissenys únics.
Et recomanem que explores cada objecte en l’estructura del teu contingut i veges les seues opcions de configuració. Sens dubte trobaràs tot un món d’opcions per a configurar l’aspecte del teu contingut, incloent-hi el comportament en mode responsiu, per a visualització en dispositius com tauletes i mòbils.
A diferència de les entrades (posts), les pàgines en WordPress poden tindre una estructura jeràrquica. Això significa que una pàgina pot ser pare d’una altra, creant una relació de dependència.
Per exemple, si tens una pàgina anomenada “Projectes”, i dins d’ella vols incloure una secció per a “Europeus”, pots fer que “Europeus” siga una pàgina filla de “Projectes”. Això es reflectirà en la URL, de la manera següent:
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.