Vai al contenuto

Sito di Sezione: differenze tra le versioni

Da Wiki di ESN Milano Statale.
TrainerBot (discussione | contributi)
m TrainerBot ha spostato la pagina Gestire il sito di Sezione a Sito di Sezione senza lasciare redirect: Passo 4: titolo dell'oggetto, con le procedure dentro; collegamenti in entrata ripuntati nello stesso batch (via move-page on MediaWiki MCP Server)
TrainerBot (discussione | contributi)
Passo 4: pagina dell'oggetto con le procedure, senza nomi di persona (via update-page on MediaWiki MCP Server)
 
Riga 1: Riga 1:
== Effettuare l’Accesso ==
Il '''sito di Sezione''', il sito pubblico di ESN Milano Statale, è [https://milanostatale.esn.it milanostatale.esn.it], raggiungibile anche come www.esnmilanostatale.it. È un sito ''Satellite'', il modello che ESN International offre alle Sezioni. Questa pagina dice cosa contiene e come si svolgono le operazioni di manutenzione più frequenti.


* accedere qui: https://milanostatale.esn.it/user
== Il sito ==
* fare “login without galaxy”
* inserire credenziali


== Aggiungere un Evento ==
=== Chi lo cura ===


<ul>
Il sito lo gestisce e lo aggiorna l'[[IT Manager]], che si coordina con il [[Partnership Manager]] per i contenuti sui partner (art. 18 del [[Regolamento interno di ESN Milano Statale|Regolamento interno]]). Le guide qui sotto sono state scritte per il WG ICT, chiuso nel 2026 (vedi [[Working Group]]): dove nominavano il referente del WG ICT, oggi ci si rivolge all'IT Manager.
<li><p>dal menu in alto che appare per la gestione del sito, andare su content -&gt; add content -&gt; event</p>
<p>[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-31_757_1395_269_246.jpg]]</p></li>
<li><p>aprire gruppo facebook degli erasmus</p></li>
<li><p>aprire l’evento che si vuole aggiungere</p></li>
<li><p>aggiungere nella pagina dell’evento sul sito</p></li>
<li><p>nome evento</p></li>
<li><p>data e ora</p></li>
<li><p>body (descrizione evento):</p></li>
<li><p>ricordarsi di eliminare le emoticon dal testo</p></li>
<li><p>ricordarsi di eliminare eventuali link a google form, ecc (perché sul sito sarà tutto pubblico)</p></li>
<li><p>scaricare l’immagine dell’evento da FB</p></li>
<li><p>aggiungere l’immagine al campo Image sul sito</p></li>
<li><p>aggiungere dettagli facoltativi: tipo di evento, ESNCard richiesta, prezzo</p></li>
<li><p>premere SAVE in fondo alla pagina</p></li></ul>


== Aggiornare il file del Survival Guide ==
=== Cosa contiene ===


Il survival guide è visibile sul seguente sito: https://milanostatale.esn.it/survival-guide Ogni volta che viene richiesta una modifica, bisogna aggiornarlo. Il file si trova sul Drive nella cartella “Survival Guide Erasmus”. In sintesi, bisogna modificare il powerpoint, generare il PDF e caricarlo come sostituto nella stessa cartella. Sul sito https://milanostatale.esn.it/survival-guide c’è un collegamento che rimarrà sempre attivo, purché il file “Survival Guide - public.pdf” venga sostituito e mai rinominato/eliminato. Ecco i passi approfonditi:
* '''Gli eventi''', copiati dall'annuncio rivolto agli studenti Erasmus.
* '''La Survival Guide''' per gli studenti Erasmus, alla pagina [https://milanostatale.esn.it/survival-guide /survival-guide]: un PDF collegato in modo permanente, conservato nel Drive nella cartella «Survival Guide Erasmus».
* '''Meet our staff''': la pagina ''About ESN'' → ''ESN Milano Statale'' presenta i volontari a partire da una variabile JavaScript, <code>members</code>, con le foto conservate nel repository GitHub <code>esnmilanostatale/esnmilanostatale.github.io</code>.


# Accedere alla cartella condivisa sul Drive (se non lo visualizzi, chiedi l’accesso al referente ICT)
== Gestire il sito ==
# Scarica l’ultimo PowerPoint aggiornato
# Effettua le modifiche necessarie
# Salva le modifiche, rinominando il file con la data dell’aggiornamento seguendo la nomenclatura seguente: “Survival Guide - Aggiornata al 12.09.2023.pptx”
# Genera il file PDF, salvandolo con la data dell’aggiornamento seguendo la nomenclatura seguente: “Survival Guide - Aggiornata al 12.09.2023.pdf”
# Duplica il PDF generato, rinominandolo come segue: “Survival Guide public.pdf”
# Carica i 3 file generati nella cartella condivisa sul Drive (alla richiesta di sostituire i file già esistenti, prosegui con la sostituzione)
# Rimuovi la vecchia versione del pdf e del file PowerPoint, lasciandone solo quelle rinominate (nel drive devono esserci i 3 file nuovi)
# Verifica che sul sito venga visualizzato correttamente: https://milanostatale.esn.it/survival-guide


== Problemi ==
=== Accedere ===


== In caso una pagina del sito non si aggiornasse dopo le modifiche ==
# Vai su [https://milanostatale.esn.it/user milanostatale.esn.it/user].
# Scegli '''login without galaxy'''.
# Inserisci le credenziali, che si chiedono all'IT Manager.


<ul>
=== Aggiungere un evento ===
<li><p>nel menu in alto di gestione del sito, cliccare su “</p>
{{Da verificare|Questi passi risalgono a quando gli eventi si annunciavano agli Erasmus su un gruppo Facebook; vanno confrontati con il sito attuale.}}
<p>” -&gt; “Flush All Caches”</p>
# Dal menu di gestione in alto, scegli '''Content''' → '''Add content''' → '''Event'''.
<p>[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-32_506_728_1123_246.jpg]]</p></li></ul>
# Apri l'evento come è stato annunciato agli studenti Erasmus e riportane i dati nella pagina dell'evento sul sito:
#* nome dell'evento, data e ora;
#* '''Body''', cioè la descrizione: '''togli le emoji''' e '''togli i collegamenti a moduli Google''' e simili, perché sul sito tutto è pubblico;
#* l'immagine dell'evento, da scaricare e inserire nel campo '''Image''';
#* i dettagli facoltativi: tipo di evento, ESNcard richiesta, prezzo.
# Clicca '''Save''' in fondo alla pagina.


== Aggiungere un Nuovo Membro Attivo ==
=== Aggiornare la Survival Guide ===


<ul>
La pagina [https://milanostatale.esn.it/survival-guide /survival-guide] rimanda a un file che resta valido finché '''<code>Survival Guide - public.pdf</code>''' nella cartella del Drive «Survival Guide Erasmus» viene '''sostituito, mai rinominato né cancellato'''. A ogni modifica richiesta:
<li><p>girare l’excel del Meet your staff on website:</p></li>
<li><p>chiedere anche una foto profilo, da ritagliare in modo che sia squadrata (proporzioni 1:1)</p></li>
<li><p>aggiungere l’immagine al repository</p></li>
<li><p>andare nella pagina “About ESN” -&gt; “ESN Milano Statale”</p></li>
<li><p>cliccare su “edit”</p>
<p>[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-33_421_1578_1375_248.jpg]]</p></li>
<li><p>nel menu “Text Format” selezionare “Plain Text”</p></li></ul>


Text format
# Apri la cartella condivisa sul Drive; se non la vedi, chiedi l'accesso all'IT Manager.
# Scarica l'ultimo PowerPoint aggiornato e fai le modifiche.
# Salvalo con la data dell'aggiornamento nel nome, per esempio <code>Survival Guide - Aggiornata al 12.09.2023.pptx</code>.
# Esporta il PDF con lo stesso nome: <code>Survival Guide - Aggiornata al 12.09.2023.pdf</code>.
# Duplica il PDF e rinomina la copia <code>Survival Guide - public.pdf</code>.
# Carica i tre file nella cartella condivisa; quando il Drive chiede se sostituire i file esistenti, accetta.
# Togli la vecchia versione del PDF e del PowerPoint: nella cartella devono restare solo i tre file nuovi.
# Controlla che la pagina del sito mostri la nuova versione.


[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-33_214_273_1959_749.jpg]]
=== Se una pagina non si aggiorna dopo le modifiche ===


* No HTML tags allo
Nel menu di gestione in alto, dall'icona a forma di casa, scegli '''Flush All Caches'''.
* Web page addrest ddresses turn into links automatically.
* Lines and paragraphs break automatically.
* aggiungere il nuovo membro nella variabile members con le informazioni prese dal file excel.


Esempio: var members = { “luca_arrotta”: {“name”: “Luca Arrotta”, “img”: “https://github.com/esnmilanostatale/esnmilanostatale.github.io/blob/master/assets/static /la.jpg?raw=true”, “profile”: “Passionate about Computer Science and Artificial Intelligence, but you will always find me on beach volley courts and on soccer fields. Constantly anxious to talk about travel and movies.”, “from”:“Milano - ICT Manager”, “studies”: “Computer Science”, “place”: “Gae Aulenti”, “quote”: “Take these broken wings and learn to fly”, “lang”: flags.italian + flags.english},
=== Aggiungere un volontario a «Meet our staff» ===


<ul>
# Manda al nuovo volontario il foglio di calcolo «Meet your staff on website» da compilare e chiedigli una foto profilo; ritagliala '''quadrata''' (proporzioni 1:1).
<li><p>nel campo “img”, aggiungere il link dell’immagine preso dal repository github. Bisogna fare tasto destro sull’immagine e poi “copy image address”</p>
# Carica l'immagine nel repository GitHub <code>esnmilanostatale/esnmilanostatale.github.io</code>.
<p>[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-34_846_1267_1601_248.jpg]]</p></li>
# Apri la pagina '''About ESN''' → '''ESN Milano Statale''' e clicca '''Edit'''.
<li><p>aggiungere dove opportuno la nuova persona, con questo codice:</p>
# Nel menu '''Text Format''' scegli '''Plain Text''', così l'editor non altera il codice.
<p>[[File:https://www.notion.so./images/image-2ec20af760fdce4b7476f4c5219d330cb72cbf8e.jpg]]</p>
# Aggiungi la persona alla variabile <code>members</code> con i dati del foglio di calcolo (schema sotto, «La voce in <code>members</code>»). Per il campo <code>img</code>, sull'immagine in GitHub fai clic destro → ''Copy image address''.
<p>Eleonora</p></li></ul>
# Inserisci la persona in una riga della pagina (schema sotto, «La foto nella riga»).
# Riporta '''Text Format''' su '''Rich Text''' e clicca '''Save''' in fondo alla pagina.


Catozzi
'''La voce in <code>members</code>''':
<pre>
var members = {
  "nome_cognome": {"name": "Nome Cognome", "img": "<collegamento all'immagine su GitHub>",
    "profile": "<breve presentazione>", "from": "<città> - <ruolo>", "studies": "<studi>",
    "place": "<luogo>", "quote": "<citazione>", "lang": flags.italian + flags.english},
  …
};
</pre>


5 indica il numero di foto profilo che ci sono sulla riga in cui si vuole aggiungere il nuovo membro. Può essere 3, 4, o 5 middlemember: da aggiungere solo se la nuova persona sarà al centro di una riga da 3 o da 5 (dispari)
'''La foto nella riga''':
<pre>
<div class="member-row-5 middlemember"><img class="memberimg desn" onclick="openModal('nome_cognome')"
src="<collegamento all'immagine>" /><br /><span>Nome Cognome</span></div>
</pre>


[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-35_252_259_888_287.jpg]]
* <code>member-row-5</code>: quante foto contiene la riga, '''3, 4 o 5''';
* <code>middlemember</code>: solo per la persona al centro di una riga dispari, da 3 o da 5;
* <code>desn</code>: la classe che dà il colore al cerchio della foto; la legenda della guida è <code>o</code> arancione, <code>p</code> rosa, <code>d</code> blu scuro, <code>g</code> verde, <code>b</code> azzurro;
* <code>openModal('…')</code>: la chiave della persona nella variabile <code>members</code>;
* <code>src</code>: il collegamento all'immagine nel repository GitHub.


Denise Ragona
== Riferimenti ==


[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-35_250_254_890_603.jpg]]
* [[IT Manager]] · [[Partnership Manager]] · [[Canali di Comunicazione]]
 
Laura Salvemini
 
[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-35_250_252_890_916.jpg]]
 
Eleonora Catozzi
 
[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-35_250_252_890_1231.jpg]]
 
Ilaria Bergamaschi
 
[[File:How%20to%20sito%20web%20di%20Sezione/images2996d011-c1b9-42cc-8110-0345a26e35c2-35_253_259_890_1539.jpg]]
 
Arianna dall’Amico
 
desn: indica il colore del cerchio che contiene la foto profilo
 
* o = orange
* p = pink
* d = dark blue
* g = green
* b = light blue eleonora_catozzi: nome che si è scelto nella variabile “members” con le informazioni prese dal file excel https://www.esnmilanostatale.it/assets/img/members/eleonorac.jpg: link dell’immagine profilo presa dal repo github
* impostare nuovamente “Rich Text” come Text Format
* Cliccare su Save in fondo alla pagina


{{Ultimo aggiornamento|2026-10-06}}
[[Categoria:Amministrazione]]
[[Categoria:Amministrazione]]

Versione attuale delle 14:02, 6 ott 2026

Il sito di Sezione, il sito pubblico di ESN Milano Statale, è milanostatale.esn.it, raggiungibile anche come www.esnmilanostatale.it. È un sito Satellite, il modello che ESN International offre alle Sezioni. Questa pagina dice cosa contiene e come si svolgono le operazioni di manutenzione più frequenti.

Il sito

Chi lo cura

Il sito lo gestisce e lo aggiorna l'IT Manager, che si coordina con il Partnership Manager per i contenuti sui partner (art. 18 del Regolamento interno). Le guide qui sotto sono state scritte per il WG ICT, chiuso nel 2026 (vedi Working Group): dove nominavano il referente del WG ICT, oggi ci si rivolge all'IT Manager.

Cosa contiene

  • Gli eventi, copiati dall'annuncio rivolto agli studenti Erasmus.
  • La Survival Guide per gli studenti Erasmus, alla pagina /survival-guide: un PDF collegato in modo permanente, conservato nel Drive nella cartella «Survival Guide Erasmus».
  • Meet our staff: la pagina About ESN → ESN Milano Statale presenta i volontari a partire da una variabile JavaScript, members, con le foto conservate nel repository GitHub esnmilanostatale/esnmilanostatale.github.io.

Gestire il sito

Accedere

  1. Vai su milanostatale.esn.it/user.
  2. Scegli login without galaxy.
  3. Inserisci le credenziali, che si chiedono all'IT Manager.

Aggiungere un evento

Da verificare. Questa pagina contiene informazioni incomplete o non confermate. Questi passi risalgono a quando gli eventi si annunciavano agli Erasmus su un gruppo Facebook; vanno confrontati con il sito attuale.
  1. Dal menu di gestione in alto, scegli Content → Add content → Event.
  2. Apri l'evento come è stato annunciato agli studenti Erasmus e riportane i dati nella pagina dell'evento sul sito:
    • nome dell'evento, data e ora;
    • Body, cioè la descrizione: togli le emoji e togli i collegamenti a moduli Google e simili, perché sul sito tutto è pubblico;
    • l'immagine dell'evento, da scaricare e inserire nel campo Image;
    • i dettagli facoltativi: tipo di evento, ESNcard richiesta, prezzo.
  3. Clicca Save in fondo alla pagina.

Aggiornare la Survival Guide

La pagina /survival-guide rimanda a un file che resta valido finché Survival Guide - public.pdf nella cartella del Drive «Survival Guide Erasmus» viene sostituito, mai rinominato né cancellato. A ogni modifica richiesta:

  1. Apri la cartella condivisa sul Drive; se non la vedi, chiedi l'accesso all'IT Manager.
  2. Scarica l'ultimo PowerPoint aggiornato e fai le modifiche.
  3. Salvalo con la data dell'aggiornamento nel nome, per esempio Survival Guide - Aggiornata al 12.09.2023.pptx.
  4. Esporta il PDF con lo stesso nome: Survival Guide - Aggiornata al 12.09.2023.pdf.
  5. Duplica il PDF e rinomina la copia Survival Guide - public.pdf.
  6. Carica i tre file nella cartella condivisa; quando il Drive chiede se sostituire i file esistenti, accetta.
  7. Togli la vecchia versione del PDF e del PowerPoint: nella cartella devono restare solo i tre file nuovi.
  8. Controlla che la pagina del sito mostri la nuova versione.

Se una pagina non si aggiorna dopo le modifiche

Nel menu di gestione in alto, dall'icona a forma di casa, scegli Flush All Caches.

Aggiungere un volontario a «Meet our staff»

  1. Manda al nuovo volontario il foglio di calcolo «Meet your staff on website» da compilare e chiedigli una foto profilo; ritagliala quadrata (proporzioni 1:1).
  2. Carica l'immagine nel repository GitHub esnmilanostatale/esnmilanostatale.github.io.
  3. Apri la pagina About ESN → ESN Milano Statale e clicca Edit.
  4. Nel menu Text Format scegli Plain Text, così l'editor non altera il codice.
  5. Aggiungi la persona alla variabile members con i dati del foglio di calcolo (schema sotto, «La voce in members»). Per il campo img, sull'immagine in GitHub fai clic destro → Copy image address.
  6. Inserisci la persona in una riga della pagina (schema sotto, «La foto nella riga»).
  7. Riporta Text Format su Rich Text e clicca Save in fondo alla pagina.

La voce in members:

var members = {
  "nome_cognome": {"name": "Nome Cognome", "img": "<collegamento all'immagine su GitHub>",
    "profile": "<breve presentazione>", "from": "<città> - <ruolo>", "studies": "<studi>",
    "place": "<luogo>", "quote": "<citazione>", "lang": flags.italian + flags.english},
  …
};

La foto nella riga:

<div class="member-row-5 middlemember"><img class="memberimg desn" onclick="openModal('nome_cognome')"
src="<collegamento all'immagine>" /><br /><span>Nome Cognome</span></div>
  • member-row-5: quante foto contiene la riga, 3, 4 o 5;
  • middlemember: solo per la persona al centro di una riga dispari, da 3 o da 5;
  • desn: la classe che dà il colore al cerchio della foto; la legenda della guida è o arancione, p rosa, d blu scuro, g verde, b azzurro;
  • openModal('…'): la chiave della persona nella variabile members;
  • src: il collegamento all'immagine nel repository GitHub.

Riferimenti

Ultimo aggiornamento: 2026-10-06