WordPress, un CMS per la scuola: novità e sviluppi. Alberto Ardizzone Renata Durighello Christian Ghellere Marco Milesi

Transcript

1 WordPress, un CMS per la scuola: novità e sviluppi Alberto Ardizzone Renata Durighello Christian Ghellere Marco Milesi

2 L associazione internazionale per la professionalità nel Web partecipazioni internazionali partecipazioni nazionali Prima associazione al mondo (dal 1996) che raggruppa chi lavora nel Web, sia nel settore pubblico che privato. Obiettivo di IWA è creare rete tra i soci, partecipare all'evoluzione della rete e divulgare conoscenza tramite i soci con eventi ed iniziative. Associazione professionisti Web (Legge 4/2013), unica della categoria nell elenco del MISE. 2

3 Perché associarsi? IWA Italy è associazione professionale che raggruppa chi opera nel Web, ovvero i soggetti che - ai sensi della legge 4/2013, sono definibili come "professionisti Web" (liberi professionisti, dipendenti - pubblici e privati, altre forme di lavoro che come attività prevalente operano nel Web). IWA Italy ha inoltre rilasciato i primi profili professionali (G3 Web Skill Profiles) in linea con i dettami dell'agenda digitale europea e italiana ed ha avviato accordi di collaborazione con realtà di tutela del lavoro (sindacati) e di domanda/offerta di lavoro: ancora una volta il ruolo di IWA è quello di unire, far collaborare e tutelare chi opera nel Web. Quota speciale 50,00 Potrai ottenere uno sconto sulla quota associativa che pagherai 50,00 anziché 65,00. Lo sconto vale sia per i nuovi soci che per i rinnovi. Per usufruire dello sconto usa in fase di registrazione o rinnovo il seguente promocode: SMAU MILANO

4 Pasw 2015 Bello, accessibile e innovativo Progettato per gli istituti scolastici

5 PASW2015 tutti per uno

6 Il modello WordPress SEMPLICE Facile da installare Veloce da aggiornare Bello da usare AGGIORNATO Periodicamente rinnovato Continuamente migliorato SUPPORTATO DALLA COMUNITA

7 Il modello WordPress Non solo Scuole! Comuni Associazioni altri enti

8 PASW2015 uno per tutti Altamente personalizzabile

9 Come modificare il sito Personalizzare il tema con le opzioni di default Creare un proprio tema child

10 La personalizzazione del tema Bacheca > Aspetto > Personalizza Cambiare i colori Immagine della testata Sfondo (immagine o colore) Opzioni di navigazione

11 La scelta dei colori Controllare il contrasto dei colori e la luminosità Colour Contrast Analyser Web Accessibility toolbar Attenzione all accessibilità

12 Tema Child Come modificare correttamente i file del tema

13 Tema child di WordPress, che cos è? CHILD = BAMBINO, FIGLIO un tema child è un tema, che deriva e dipende da un tema «padre» Un tema child di WordPress è un tema a tutti gli effetti; il tema importa tutte le funzionalità e caratteristiche del tema padre. Un tema child viene creato quindi se si vogliono apportare modifiche nell aspetto o nelle funzionalità del tema installato

14 Perché usare un tema Child? 1 Prima dell esistenza dei temi child chi desiderava personalizzare il tema installato doveva apportare le proprie modifiche ai files. PRO: è facile, posso farlo direttamente da bacheca, intervengo solo dove mi interessa CONTRO: perdo di vista l originale, non posso «ereditare» aggiornamenti Vedi versioni PASW

15 Perché usare un tema Child? 2 Il tema Wordpress PASW2015 è costantemente aggiornato nella sua versione ufficiale WordPress. Aggiornare Pasw2015 è esattamente come aggiornare un plugin! Ma se abbiamo modificato i files del tema perderemo le nostre personalizzazioni (N.B. non Aspetto>Personalizza)

16 Tema child anche per modifiche semplici Si consiglia l uso del tema child quando c è la necessità di apportare al tema padre delle modifiche sia semplici che complesse. Tra le modifiche semplici possiamo far rientrare la variazione del CSS. In tal caso il nostro tema child avrà essenzialmente un nuovo file style.css (con function.php per includere il foglio di stile genitore)

17 Tema child per modifiche complesse 1 Tra le modifiche un po più complesse possiamo far rientrare la creazione di funzioni particolari per coprire determinate esigenze, la creazione di widget particolari ecc. Il nostro tema child avrà quindi al suo interno altri file, a partire dal file function.php per avviare le nuove funzionalità

18 Tema child per modifiche complesse 2 Es: creazione di pagine di accesso differenziate per diverse categorie di utenza potenziando i widget:

19 Come funziona un child? I file del child hanno la priorità: sovrascrivono i files «omonimi» del genitore Fa eccezione function.php: in questo caso il file «figlio» viene caricato prima e in aggiunta del function.php del genitore Il solo file obbligatorio del child è style.css, (ma serve anche function.php se voglio importare lo style.css del genitore) Se voglio modificare la testata creerò un nuovo header.php e così via È possibile anche includere file nel tema child che non sono presenti nel tema genitore

20 Da dove partire? Nel gruppo Siti Scolastici di facebook è possibile trovare alcuni child rilasciati dagli utenti Nel Github è possibile scaricare un child master e un child creato da Christian Tutorial by Caterina Toccafondi

21 Alla portata di tutti

22 Link File pasw2015-child

23 Cookie

24 Cookie Modulo Integrato ) per Pasw2015 Plugin esterno ( ) per Pasw2015, Pasw2013 e altri temi grafici

25 Cookie

26 Cookie

27 Cookie

28 Cookie Installazione semplificata Modulo: pasw2015->impostazioni Plugin: plugin->aggiungi nuovo ->Eu Cookie Law Modulo: direttamente con il tema Plugin: aggiornamento standard Aggiornamenti semplificati Progettati in parallelo Blocco manuale interscambiabile, stesse performance, stesse tecnologie

29 Plugins per le Pubbliche Amministrazioni

30 Plugin

31 Trasforma WordPress in un bot di Telegram

32 Trasforma WordPress in un bot di Telegram Compatibile con

33 Un altra piccola integrazione

34 Un altra piccola integrazione

35 Anac xml viewer Crea una tabella a partire da un dataset xml Presto disponibile su wordpress.org

36 Google Analytics

37 Google Analytics nel nuovo Pasw Nuova visualizzazione Nuovi standard di sicurezza (= non più password) Configurabile dalle impostazioni di Pasw2015 Più bello e funzionale

38 Pasw 2015 Versione R La nuova versione «Responsiva»

39 Pasw2015 RESPONSIVE Adattabile ad ogni schermo Non necessita plugin aggiuntivi Abbiamo cercato di: Evitare «Caccia al tesoro» Non disorientare (troppo) Garantire una certa continuità nella ricerca delle informazioni Evitare soluzioni javascript o jquery (non sempre affidabili) Alcuni punti essenziali da definire/migliorare: Visualizzazione dei Menù Visualizzazione delle barre laterali (sopra, sotto, espandibili)

40 Come funziona il responsive #id { color: blue; screen and (max-width: 480px) { #id { color: red; } screen and (max-width: 768px) { #id { color: yellow; } screen and (max-width: 1024px) { #id { color: green; } } Pc: BLU Tablet: GREEN Tablet portrait: YELLOW Smartphone: RED CSS originale: pasw2015/responsive.css CSS per modifiche: pasw2015-child/style.css (o modelli più articolati)

41 Come funziona il responsive DESKTOP FIRST MOBILE FIRST Il sito viene progettato per pc. Vengono introdotte regole di stile man mano che si rimpicciolisce lo schermo (standard) max-width ( ) { } Il sito viene progettato per smartphone. Vengono introdotte regole di stile man mano che si ingrandisce lo schermo (standard) min-width ( ) { } PASW2015 è DESKTOP-FIRST

42

43

44 Recupero spazio «inutilizzato»

45 Pasw2015 RESPONSIVE In fase di ultimazione Da attivare manualmente nelle impostazioni (per non interferire con chi utilizza altri sistemi es. WPTouch) Attenzione a tema child fortemente personalizzati (es. con aggiunta di «box» e «classi») Attenzione a immagini, slider, video,

46 Come aggiornare? In Aspetto > Temi > Pasw2015 è possibile aggiornare il tema a qualsiasi versione da noi rilasciata. Aggiornando alla versione master puoi provare in anteprima tutto quanto presentato oggi. In particolare: - Nuovo modello Responsive - Nuovo sistema Google Analytics - Miglioramenti nel pannello di amministrazione Presto rilasceremo la versione 2.0 (stabile) di Pasw2015

47 GitHub Tutto il codice è disponibile sul Repository GitHub. GitHub permette uno sviluppo collaborativo consentendo a chiunque di fare segnalazioni e proposte (anche e soprattutto a livello di codice). Pasw2015 ha bisogno anche di te! github.com/porteapertesulweb/pasw2015

48 Alla prossima! Per approfondire: Gruppo Facebook «Siti Scolastici» (Marco Milesi) plugin.sisviluppo.info (Ignazio Scimone)