Recurs elaborat per en Baltasar:
https://sites.google.com/a/xtec.cat/baltasar/maqueta-wordpres
A. Introducció
B. Dinàmica de treball
El treball es realitzarà a l'espai de pràctiques que us assignarà el vostre coordinador del seminari.
L'edició i maneig de Nodes és
molt senzilla. En aquesta sessió realitzarem un treball introductori:
Les persones assistents al seminari duran a terme les següents accions:
-
Edició d'un article
-
Maquetació de la portada del lloc
-
Personalització del blog de classe
-
Edició de la portada de la Revista
-
Introducció a la xarxa social
Es recomana treballar en parelles i agrupats per etapa educativa (primària - secundària).
1. Edició d’un article
Conceptes previs
- Per defecte, els articles es publiquen
en mode resum, combinació d’una imatge i un text resum.
- Es pot publicar el contingut íntegre d’un
article marcant la casella Mostra contingut sencer de la caixa Paràmetres
Tasques
Es proposa escriure un article en mode resum. L'article haurà de contenir un
vídeo, se li hauran d'assignar tres categories: ESO1 o P5 (segons l'espai de
pràctiques que tingueu), Portada i Revista, i s'hi haurà d'afegir una etiqueta de Nadal. També es pot afegir la icona de vídeo, que avisarà del contingut multimèdia,
encara que no es veurà a la Portada.
La categoria Revista us
proporcionarà la funcionalitat de convertir Nodes en una Revista Escolar. Aquesta categoria no existeix a la maqueta de Nodes i s'haurà de crear durant l'edició de
l'article.
Per fer-ho seguiu aquest procés després de validar-vos com a Administrador (extrem
superior dret) amb l'usuari i la contrasenya que us facilitarà el vostre coordinador de seminari:
Aquest és el resultat que heu d'obtenir.
Aneu al Tauler des del desplegable que trobareu sota el nom del centre.
I des d'aquí aneu a Articles -> Afegeix
Editeu l'article seguint els criteris següents:
-
El títol ha de ser El Nadal
- Descarregueu i afegiu aquesta imatge com a imatge resum (ho heu de fer des de
la caixa Imatge Resum situada a la banda dreta i heu de penjar-la a la mediateca) .
- Com a resum, afegiu aquest text (ho
heu de fer a la caixa Resum situada a la dreta):
Ja ha arribat el Nadal, i així ho hem celebrat a l'escola/institut!
-
Com a contingut de l'article afegiu un d'aquests vídeos de youtube:
video P5 https://youtu.be/DW5xXiyb-Qg
video ESO1 https://youtu.be/_PSm7f5sAgs
NOTA: No cal inserir el codi del vídeo, només cal enganxar l’adreça URL del navegador (WordPress fa la inserció directament)
- Afegiu també aquest text a sota del vídeo. Si
teniu dificultats, seleccioneu el vídeo, polsar tecla de la dreta (-->) i després polsar Intro.
P5: Aquest any a la classe hem preparat la nadala de "L'avet de Nadal". Realment ens ha sortit molt bé i la cantata va ser tot un èxit! Si algú no va poder assistir, aquí teniu el
vídeo.
ESO1: Quina passada! Heu vist com nevava? I els llums de Nadal fets amb paraigües? Realment, amb el dron hem filmat unes imatges espectaculars!
- A la
caixa Paràmetres, situada també a la dreta, trieu la icona de vídeo del desplegable d'Icones.
- Heu de situar l'article a 3 categories:
a ESO 1 o P5 (segons sigui el vostre centre de Primària o Secundària), a Revista i a Portada.
NOTA: Si no
existeix Revista, creeu-la.
- Etiqueteu l’article com
a Nadal.
NOTA: Si no existeix l’etiqueta, creeu-la.
- Publiqueu l’article
(caixa Publica a l'extrem superior dret).
Aquí trobareu informació de com publicar un article.
Aquí trobareu informació de com categoritzar un article.
Aquí trobareu informació de com etiquetar un article.
Aquí trobareu informació de les diferències entre el mode resum i el
mode sencer, i de com afegir contingut al mode resum.
Observeu que:
- L’article s’ha publicat a
la Portada, a dalt de tot
- Es veu el text de resum i la
imatge de resum
- La imatge s’adapta a
l’espai. En general, és recomanable utilitzar imatges resum panoràmiques.
- No es veu el contingut (text
ampliat ni el vídeo)
- La icona de vídeo adverteix
al visitant que si visitem l’article veurem un vídeo
|
- Editeu de nou l’article i marqueu la casella Mostra contingut sencer de la caixa Paràmetres. Cliqueu al botó Actualitza de
la caixa Publica (extrem superior dret).
Aquest és el resultat que heu d'obtenir.
Observeu que:
- Ja no es mostra la imatge ni el
text resum
- Es veu el contingut de
l’article, incloent el vídeo
- És convenient treure la icona
del vídeo ja que pot donar la sensació que hi ha més vídeos dins de l’article
- La maquetació no és massa
correcta, retallant-se el vídeo que és de format 4:3 i donant una sensació de estirament excessiva. Això ho corregirem a l'apartat següent.
|
2. Maquetació de la portada
- És possible definir l’amplada que ocupen els
articles segons unes distribucions predefinides per fila
- Es pot definir la distribució d’articles de
manera independent per a la primera fila, la segona fila i la resta de files.
- Es pot fixar un o més articles a dalt de tot de la
Portada.
- Es pot definir un contingut fix a dalt de tot de la
Portada, independentment dels articles
- Modifiqueu la distribució de la primera fila perquè l’article de Fi de curs ocupi 2/3 de l’espai.
Aneu a Aparença -> Personalitza -> Pàgina d’inici, Fila 1. Un cop fet això, heu de clicar a Desa i
Publica (part superior) i tancar (creueta a l'extrem superior esquerre).
Aquest és el resultat que heu d'obtenir.
-
Observeu que:
- La nova amplada de
l’article s’adapta millor a l’amplada del vídeo.
- L’article El
Nadal ha guanyat en pes visual i per tant és una manera molt natural i elegant de destacar un article, sense utilitzar colors cridaners ni icones en
moviment.
|
- Ara destacareu un article antic.
Editeu l’article Notícia 2. Aneu a la caixa Publica (part superior dreta) i feu clic a Edita de l’element Visibilitat:Pública.
Marqueu la casella Fixa l’article a la part superior. Cliqueu a Actualitza.
Aquest és el resultat que heu d'obtenir.
I aquesta és la caixa
Publica:
- Ara modificareu la distribució de la primera fila per a equilibrar els dos articles (cadascun ha d’ocupar la meitat de la fila).
Aneu de nou a Tauler -> Aparença -> Personalitza -> Pàgina d’inici, Fila 1 i trieu 2 articles
iguals. Cliqueu a Desa i Publica i tanqueu.
Aquest és el resultat que heu d'obtenir.
- Finalment modificareu la distribució de la segona fila a 3 articles. Aneu de nou a Tauler ->
Aparença -> Personalitza -> Pàgina d’inici, Fila 2, i trieu 3 articles. Cliqueu a Desa i Publica i
tanqueu.
Observeu que:
- És molt senzill canviar
la distribució dels articles per a optimitzar la seva visualització
- És molt fàcil destacar
un article
- A més a mes es poden
ordenar els articles destacats canviant les seves dates de publicació. Els més recents es mostren primer
|
3. Personalització del blog de classe
- Quan es fa clic en una categoria,
WordPress genera automàticament una pàgina amb els articles d’aquella categoria.
- Es pot escriure contingut abans dels articles.
- Es poden personalitzar els ginys de la barra
lateral per a cada categoria.
- De manera molt senzilla, una categoria de Nodes pot
fer la funció de blog de classe, de departament, de projecte…
Aneu a personalitzar una mica el blog amb el giny Grup-Classe
- Abans d'editar el giny, pujareu una foto a la mediateca que després necessitareu. Us proposem que pugeu aquesta.
Això ho fareu des de de
Multimèdia | Afegeix.
Copieu l'adreça url de la imatge. La trobareu al costat de l'imatge:
- A la portada, feu clic sobre la categoria ESO 1A o P5 de l’article Nadal
Observeu que:
- És una pàgina de
categoria amb tots els articles que s’han categoritzat com a ESO 1A o P5
- La barra esquerra té uns
ginys diferents als ginys de portada
|
Aquí seleccioneu Giny | Categories (Barra esquerra) on trobareu diversos ginys en negreta. Són els ginys que s'apliquen a aquella categoria. Busqueu el giny Grup
classe d'ESO 1A o P5A i modifiqueu el seu contingut. Si no hi fos, sempre es podria afegir clicant a Afegeix Giny. Es proposa editar-lo seguint l'exemple
-
La caixa Text
html ens permet
inserir qualsevol contingut html, també una fotografia. Per fer-ho heu d'enganxar el següent codi html:
<img src=url de la imatge>
on la url és l'adreça que heu copiat abans. Si no teniu o heu perdut l'adreça de l'imatge, aneu a la Mediateca i seleccioneu de nou l'imatge (l'adreça està al costat dret, a la casella URL).
-
L'agenda/calendari:
permet vincular un calendari de Google al nostre blog d'aula.
Per aquesta pràctica bàsica, ens limitarem a seleccionar un calendari Google ja predefinit. Si no està ja seleccionat,
trieu Agenda d'exemple i marqueu la casella Calendari.
-
Ompliu informació del
tutor/a i l'horari d'atenció a les famílies.
-
Enllaços (menú associat): permet vincular un menú creat prèviament. Per aquesta pràctica bàsica ens limitarem a seleccionar un menú entre els menús ja creats. Seleccioneu el que vulgueu.
-
És
molt important definir la visibilitat. Aneu a la caixa Visibilitat situada a la part inferior de la configuració del giny,
trieu Mostra,
Categoria i el curs adient.
Més informació:
4. Edició de la portada de la Revista
Podeu utilitzar Nodes per a crear la Revista escolar o de l'institut. Únicament heu hagut d'etiquetar bé els articles.
Podeu personalitzar aquesta pàgina perquè tingui un aspecte propi. Us proposem dues formes:
- Descripció de la categoria.
- Aneu a Articles |
Categories i seleccioneu la categoria Revista.
- Ompliu la caixa
de Descripció. Podeu afegir text, fotografies o editar el codi html.
- Aneu a definir un giny que es visualitzi només a Revista.
Abans d'editar el giny, descarregueu aquesta fotografia i pugeu-la a la Mediateca. (Multimèdia | Mediateca | Afegeix)
- Aneu a Tauler ->
Aparença -> Ginys. Seleccioneu un giny de tipus Text:
- Situeu aquest giny a dalt de tot de
l’àrea de ginys Categories.
- Poseu com a títol Nadal 2015
- Aneu a la Mediateca, cliqueu a sobre de
la imatge i copieu la url que es mostra a la dreta de la finestra de Detalls de l'Adjunt.
- Ompliu el quadre de giny de text amb el
codi
<img scr=url de la imatge>
- Si voleu, podeu afegir algun text
addicional. Una opció podria ser:
<img src=url de la imatge>
<b>Especial de Nadal</b>
- Ara només us quedarà acotar la seva
visibilitat. Si no modifiquéssiu res, el giny seria visible a totes les pàgines de la categoria. Simplement haureu de clicar al botó de Visibilitat i seleccionar la
categoria Revista.
5. Introducció a la xarxa social
Les tasques de la xarxa social de Nodes les fareu a l'entorn agora.xtec.cat/nodes. Entreu a la pàgina per l'extrem superior
dret.
Per accedir ho podeu fer amb el vostre usuari de la xtec clicant primerament a l'enllaç al moodle.
Un cop validats entreu a la xarxa social clicant a la icona xarxa nodes situada a la part superior dreta.
-
Interacció en el mur general.
Aneu a xarxa social des de la icona que teniu a la part superior dreta.
S'obrirà la vostra pàgina d'activitat a on trobareu el vostre mur. Aquí farem 3 entrades:
-
Una entrada amb una imatge. Podeu pujar l'imatge o afegir l'enllaç d'una imatge ja existent.
-
Una entrada amb un vídeo. Aquí no cal fer servir la icona: escrivint l'adreça de youtube, wordpress ja ho interpreta.
-
Una entrada amb un enllaç a una pàgina web. Segons la pàgina t'oferirà la possibilitat d'incloure una imatge de miniatura.
Observeu que a sota de l'entrada podeu arribar a tenir fins a cinc botons: Comentari, Preferit, Suprimeix, Inadequat, M'agrada.
- Entreu a un Node públic. Feu una entrada al mur
i una entrada en un fòrum.
Podeu provar amb el Node Cinema.
- Sol·liciteu l'entrada a un Node privat.
Podeu provar amb el Node Professorat.
Observeu que:
- No es poden veure els Nodes
ocults.
- Que allò que es publica en
un node públic es replica al mur general.
- No es pot entrar directament
a un node privat fins que un administrador et dóna permís.
|
C. Tasques a fer al centre
-
Passeu a l'equip directiu la presentació de Nodes que teniu als materials del
Seminari
-
Podeu sol·licitar l'activació del vostre espai Nodes aquí
- El centre disposa de l'Espai Web Nodes
- Expliqueu a l'equip directiu del vostre centre
la possibilitat de crear blocs d'aula a Nodes. Podeu trobar els materials i més informació als materials de Nodes a l'Ateneu i també sobre com importar blocs
dewordpress i blogger.