Al llarg de la web has anat trobant xicotetes 💡 bombetes que et mostren com està construïda cada secció i t’oferixen recursos pràctics per a crear la teua pròpia web de centre.
Perquè et siga més fàcil consultar-les i tornar a elles quan ho necessites, hem agrupat totes en un sol espai.
Així podràs accedir directament als temes que més t’interessen, segons el moment en què et trobes en la creació del teu web de centre. 🚀
☝️RECORDA: Sols s’indiquen el paràmetres modificats, la resta no s’han modificat per a la creació del bloc.
01. PÀGINA PRINCIPAL
· Bloc ‘Passe de diapositives’
📐 Estructura:
🛠️ Paràmetres – Contenidor:
- Marge: Superior 0px / Esquerra -40 px / Dreta -40 px / Inferior 0 px
🔗Enllaços d’interés:
· Bloc – ‘Botons de navegació principal’
📐 Estructura:
🛠️ Paràmetres – Contenidor:
- Marge: Superior -10px / Esquerra 5% / Dreta 5% / Inferior 0 px
🛠️ Paràmetres – Cuadrícula: 3 contenidors amb una amplària del 33,33%
- Farciment: 30px 🔗
- Marge: 10 px 🔗
- Vora: 5 px 🔗
- Radi de la vora: 5 px per angles de 90 graus i 50px per angles redons
- Fons: Opacidad de la imagen – 0,12
- Grandària: cover
- Posició: center center
🛠️ Paràmetres – Titular:
- Marge: Superior 10px / Esquerra 10px / Dreta 10px / Inferior 20 px
🛠️ Paràmetres – Botó:
- Amplària: 200px
- Farciment: Superior 15px / Esquerra 20px / Dreta 20px / Inferior 15px
- Marge: Superior 0px / Esquerra 0px / Dreta 0px / Inferior 10px
- Radi de la vora: 50px 🔗
- Grandària de la icona: 25px (⭐ Tip extra: pots seleccionar la icona en svg que desitges copiant el seu codi en esta web)
🔗Enllaços d’interés:
· Coneix tots el blocs de l’editor estándar en Portaledu
· Bloc ‘Notícies’
📐 Estructura:
🛠️ Paràmetres – Contenidor:
- Marge: Superior 100px / Esquerra 6% / Dreta 6% / Inferior 0 px
🛠️ Paràmetres – Titular:
- Marge: Superior 50px / Esquerra 0 px / Dreta 0 px / Inferior 50 px
- Tipografia: Font Weight: 700 – Bold / grandària de la font: 70 px
🛠️ Paràmetres – Carrusel d’entrades:
- Selecciona categoria: #Notícies (👉 Recordatori: hauràs de classificar abans les teues entrades amb esta categoria)
- Nombre d’entrades: 5
- Duració de cada diapositiva: 2000ms
- Entrades per diapositiva: 4
- Cobrir fons amb la imatge: ✅
🔗Enllaços d’interés:
· Coneix el bloc carrusel en Portaledu
· Bloc – ‘Informació de centre’
📐 Estructura:
🛠️ Paràmetres – Contenidor:
- Marge: Superior 100px / Esquerra 6% / Dreta 6% / Inferior 0 px
🔗Enllaços d’interés:
· Completa la informació del teu centre – Centre en proves!
· Completa la informació del centre en Portaledu – Portaledu
01.1 – INSTAL·LACIONS
· Bloc – ‘Galeria d’imatges’
📐 Estructura:
🛠️ Paràmetres – Galeria d’imatges:
- Nombre de columnes: 3
- Disposició: uniforme
- Relació d’aspecte: 2:3
- Espaiat entre imatges: xicotet
🔗Enllaços d’interés:
· Coneix el nou bloc de galeria d’imatges – Portaledu
01.2 – OFERTA FORMATIVA
· Bloc – ‘Quadrícula’
📐 Estructura:
🛠️ Paràmetres – Quadrícula: 4 contenidors amb una amplària del 25%, una altura de 400px i un marge de 10px 🔗
🔗Enllaços d’interés:
· Coneix el bloc quadrícula en Portaledu
02. ORGANIGRAMA
· Bloc – ‘Quadrícula – Càrrecs’
📐 Estructura:
🛠️ Paràmetres – Quadrícula: 5 contenidors amb una amplària del 20%
🛠️ Paràmetres – Imatge: Radi de la vora: Superior esquerra 5px / Superior dreta 100px / Inferior esquerra 100px / Inferior dreta 5px
🛠️ Paràmetres – Titular > Càrrec: Marge: Superior 20px
🛠️ Paràmetres – Titular > Nom: Marge: Superior 4px
🔗Enllaços d’interés:
· Coneix el bloc quadrícula en Portaledu
· Bloc – ‘Departaments‘
📐 Estructura:
🛠️ Paràmetres – Botó amb el ‘Nom del departament’:
- Amplària: 80%
- Farciment: Superior 15px / Esquerra 30px / Dreta 30px / Inferior 15 px
- Marge: Inferior 10px
- Vora: 3px 🔗
- Radi de la vora: Superior esquerra 5px / Superior dreta 50px / Inferior esquerra 50px / Inferior dreta 5px
- Icona: SVG en HTML [<svg xmlns=”http://www.w3.org/2000/svg” fill=”none” viewBox=”0 0 24 24″><g stroke-width=”0″ id=”SVGRepo_bgCarrier”></g><g stroke-linejoin=”round” stroke-linecap=”round” id=”SVGRepo_tracerCarrier”></g><g id=”SVGRepo_iconCarrier”> <path stroke-linejoin=”round” stroke-linecap=”round” stroke-width=”2″ stroke=”#ff9b0f” d=”M20 15H19M14 15H19M17 13.5V15M4.85714 8H9.14286M4 11L5.53848 5.61531C5.97492 4.08777 6.19315 3.324 6.53044 3.13222C6.82159 2.96667 7.17841 2.96667 7.46956 3.13222C7.80685 3.324 8.02508 4.08777 8.46152 5.61531L10 11M14 20.9776C16.8033 20.725 19 18.369 19 15.5V15M20 20.9776C18.0763 20.8043 16.4382 19.6404 15.5996 18M14 7C14.9319 7 15.3978 7 15.7654 7.15225C16.2554 7.35523 16.6448 7.74458 16.8478 8.23464C17 8.60218 17 9.06812 17 10M7 15C7 15.9319 7 16.3978 7.15224 16.7654C7.35523 17.2554 7.74458 17.6448 8.23463 17.8478C8.60218 18 9.06812 18 10 18″></path> </g></svg>]
- Grandària de la icona: 25px
🛠️ Paràmetres – Imatge del/la professor/a:
- Marge: Esquerra 10% /Dreta 10%
🛠️ Paràmetres – Caixa d’informació del departament (Notícies, Documentació, Activitats…):
- Bloc pestanyes
- Contingut: personalitzat
🔗Enllaços d’interés:
· Coneix el bloc pestanyes en Portaledu
· Bloc – ‘Taula – Tutories’
📐 Estructura:
🛠️ Paràmetres:
- Amplària fixa: ✅
- Capçalera de secció: ✅
03. SECRETARIA
· Bloc – ‘Targeta – Secretaria’
📐 Estructura:
🛠️ Paràmetres – Contenidor superior:
- Altura: 400px
- Marge: Superior 20px / Dreta 280px
- Vora: 4px amb codi de color #d5d5d5
- Radi de la vora: 50px
🛠️ Paràmetres – Contenidor amb imatge:
- Fons: tria una imatge de la biblioteca de medios
- Grandària: full
- Posició: center center
🛠️ Paràmetres – Contenidor amb informació:
- Farciment: Superior 50px
- Marge: Superior 30px / Esquerra 50px
· Bloc – ‘Caixes- Documentació’
📐 Estructura:
🛠️ Paràmetres – Quadrícula: 3 contenidors amb una amplària del 33,33%
- Farciment: Superior 15px / Esquerra 25px / Dreta 25px / Inferior 15px
- Marge: 10px 🔗
- Vora: 3px 🔗
- Radi de la vora: 50px per a les cantonades redones i 5px per a les cantonades rectes
04. ALUMNAT
· Bloc – ‘Título Alumnat’
📐 Estructura:
🛠️ Paràmetres – Títol ‘ALUMNAT’:
- Contenidor: Farciment – Superior 20px / Esquerra 40px / Dreta 10 / Inferior 10px
- Titular > Icona: en SVG HTML [<svg fill=”#000000″ viewBox=”0 0 512 512″ xmlns=”http://www.w3.org/2000/svg” version=”1.1″ width=”200px” height=”200px”><g stroke-width=”0″ id=”SVGRepo_bgCarrier”></g><g stroke-linejoin=”round” stroke-linecap=”round” id=”SVGRepo_tracerCarrier”></g><g id=”SVGRepo_iconCarrier”> .st0{fill:#ffffff;} <g> <path d=”M505.837,180.418L279.265,76.124c-7.349-3.385-15.177-5.093-23.265-5.093c-8.088,0-15.914,1.708-23.265,5.093 L6.163,180.418C2.418,182.149,0,185.922,0,190.045s2.418,7.896,6.163,9.627l226.572,104.294c7.349,3.385,15.177,5.101,23.265,5.101 c8.088,0,15.916-1.716,23.267-5.101l178.812-82.306v82.881c-7.096,0.8-12.63,6.84-12.63,14.138c0,6.359,4.208,11.864,10.206,13.618 l-12.092,79.791h55.676l-12.09-79.791c5.996-1.754,10.204-7.259,10.204-13.618c0-7.298-5.534-13.338-12.63-14.138v-95.148 l21.116-9.721c3.744-1.731,6.163-5.504,6.163-9.627S509.582,182.149,505.837,180.418z” class=”st0″></path> <path d=”M256,346.831c-11.246,0-22.143-2.391-32.386-7.104L112.793,288.71v101.638 c0,22.314,67.426,50.621,143.207,50.621c75.782,0,143.209-28.308,143.209-50.621V288.71l-110.827,51.017 C278.145,344.44,267.25,346.831,256,346.831z” class=”st0″></path> </g> </g></svg>]
- Grandària de la icona: 1 em
🔗 Enllaços d’interés:
05. FAMÍLIES
· Bloc – ‘Título Famílies’
📐 Estructura:
🛠️ Paràmetres – Títol ‘FAMÍLIA’:
- Contenidor: Farciment – Superior 20px / Esquerra 40px / Dreta 10 / Inferior 10px
- Titular > Icona: en SVG HTML [<svg fill=”#000000″ viewBox=”0 0 512 512″ xmlns=”http://www.w3.org/2000/svg” version=”1.1″ width=”200px” height=”200px”><g stroke-width=”0″ id=”SVGRepo_bgCarrier”></g><g stroke-linejoin=”round” stroke-linecap=”round” id=”SVGRepo_tracerCarrier”></g><g id=”SVGRepo_iconCarrier”> .st0{fill:#FFFFFF;} <g> <path d=”M78.641,118.933c22.88,0,41.416-18.551,41.416-41.414c0-22.887-18.536-41.423-41.416-41.423 c-22.887,0-41.422,18.536-41.422,41.423C37.218,100.382,55.754,118.933,78.641,118.933z” class=”st0″></path> <path d=”M255.706,228.73v0.062c0.101,0,0.194-0.031,0.294-0.031c0.101,0,0.194,0.031,0.294,0.031v-0.062 c15.562-0.317,28.082-12.976,28.082-28.601c0-15.648-12.52-28.299-28.082-28.616v-0.063c-0.101,0-0.194,0.031-0.294,0.031 c-0.1,0-0.193-0.031-0.294-0.031v0.063c-15.563,0.317-28.082,12.968-28.082,28.616C227.623,215.754,240.143,228.413,255.706,228.73 z” class=”st0″></path> <path d=”M433.359,118.933c22.887,0,41.423-18.551,41.423-41.414c0-22.887-18.536-41.423-41.423-41.423 c-22.88,0-41.416,18.536-41.416,41.423C391.944,100.382,410.48,118.933,433.359,118.933z” class=”st0″></path> <path d=”M470.097,138.553h-36.312h-18.404c-21.106,0-40.432,11.831-50.033,30.622l-33.494,97.967 c-1.154,2.246-3.298,3.84-5.792,4.282c-2.493,0.442-5.048-0.309-6.914-2.036l-20.836-18.04c-6.233-5.769-14.408-8.973-22.902-8.973 H256h-19.41c-8.494,0-16.669,3.204-22.902,8.973l-20.835,18.04c-1.866,1.727-4.421,2.478-6.914,2.036 c-2.492-0.442-4.637-2.036-5.791-4.282l-33.495-97.967c-9.6-18.791-28.926-30.622-50.032-30.622H78.215H41.902 C21.834,138.553,0,160.387,0,180.464v139.211c0,10.034,8.13,18.171,18.164,18.171c4.939,0,0,0,12.682,0l6.906,118.725 c0,10.676,8.664,19.332,19.34,19.332c4.506,0,12.814,0,21.122,0c8.308,0,16.616,0,21.122,0c10.676,0,19.34-8.656,19.34-19.332 l6.906-118.725l-0.085-84.766c0-1.339,0.914-2.493,2.222-2.818c1.309-0.31,2.648,0.309,3.26,1.502l26.572,65.401 c3.206,6.256,9.152,10.654,16.074,11.885c6.922,1.231,14.022-0.844,19.186-5.613l25.426-18.729 c0.852-0.782,2.083-0.984,3.136-0.542c1.061,0.473,1.743,1.518,1.743,2.663l0.093,73.508l4.777,82.187 c0,7.387,6.001,13.379,13.395,13.379c3.113,0,8.865,0,14.618,0c5.753,0,11.506,0,14.618,0c7.394,0,13.394-5.992,13.394-13.379 l4.778-82.187l0.093-73.508c0-1.146,0.681-2.19,1.742-2.663c1.053-0.442,2.284-0.24,3.136,0.542l25.427,18.729 c5.164,4.769,12.264,6.844,19.186,5.613c6.922-1.231,12.868-5.629,16.073-11.885l26.573-65.401 c0.611-1.192,1.951-1.812,3.259-1.502c1.309,0.325,2.222,1.478,2.222,2.818l-0.085,84.766l6.906,118.725 c0,10.676,8.664,19.332,19.341,19.332c4.507,0,12.814,0,21.122,0c8.308,0,16.616,0,21.121,0c10.677,0,19.342-8.656,19.342-19.332 l6.906-118.725c12.682,0,7.742,0,12.682,0c10.034,0,18.164-8.137,18.164-18.171V180.464 C512,160.387,490.166,138.553,470.097,138.553z” class=”st0″></path> </g> </g></svg>]
- Grandària de la icona: 1 em
🔗 Enllaços d’interés:
06. NOTÍCIES
· Bloc – ‘Bucle consulta – Notícies’
📐 Estructura:
🛠️ Paràmetres – Bucle consulta amb entrades:
- Tipus de contingut: posts
- Entrades per pàgina: 10
- Taxonomies: Categories > Nom de la categoria escollida (en el nostre cas ‘Notícies’)
⭐ Tip extra: seleccionant el títol, data o extracte de l’entrada pots ajustar l’estil de cadascú d’ells
🔗Enllaços d’interés:
· Coneix el bucle de consulta en Portaledu
💡 Consell: marca esta pàgina en els teus favorits.
Així tindràs sempre a mà totes les píndoles formatives i podràs consultar-les quan necessites inspiració o un repàs ràpid.