diff --git a/index.html b/index.html
index 7c20cfde..996b3c7e 100644
--- a/index.html
+++ b/index.html
@@ -176,151 +176,7 @@ <h2 class="mb-5">Un percorso in continua evoluzione</h2>
       </div>
       <div class="row">
         <div class="col-lg-12">
-          <ul class="timeline">
-            <li>
-              <div class="timeline-image">
-                <img class="rounded-circle img-fluid" src="img/timeline/1.jpg" alt="">
-              </div>
-              <div class="timeline-panel">
-                <div class="timeline-heading">
-                  <h4>Settembre 2014</h4>
-                  <h4 class="subheading">L'inzio di tutto</h4>
-                </div>
-                <div class="timeline-body">
-                  <p class="text-muted">Il Maker Space nasce nel 2014 quando insieme alla Biblioteca Multimediale di
-                    Fabriano, Beatrice Rapaccini
-                    e Luca Ferroni forgiano questo gruppo basato sulle varie attività makers grazie anche
-                    all'indispensabile
-                    aiuto del PDP</p>
-                </div>
-              </div>
-            </li>
-            <li class="timeline-inverted">
-              <div class="timeline-image">
-                <img class="rounded-circle img-fluid" src="img/timeline/2.jpg" alt="">
-              </div>
-              <div class="timeline-panel">
-                <div class="timeline-heading">
-                  <h4>Ottobre 2014</h4>
-                  <h4 class="subheading">La prima partecipazione alla Maker Faire</h4>
-                </div>
-                <div class="timeline-body">
-                  <p class="text-muted">Evento nella quale abbiamo presentato il progetto “Makerspaces in Libraries”,
-                    mostrando come sia possibile
-                    attuare attività semplici e complesse nelle bibloteche pubbliche. In particolare, abbiamo
-                    presentato
-                    alcuni progetti nati all’interno delle attività del Maker Space</p>
-                </div>
-              </div>
-            </li>
-            <li>
-              <div class="timeline-image">
-                <img class="rounded-circle img-fluid" src="img/timeline/3.jpg" alt="">
-              </div>
-              <div class="timeline-panel">
-                <div class="timeline-heading">
-                  <h4>Marzo 2015</h4>
-                  <h4 class="subheading">Family Creative Learning</h4>
-                </div>
-                <div class="timeline-body">
-                  <p class="text-muted">In collaborazione con il Centro per le Famiglie si sono realizzati degli
-                    incontri per famiglie, dove i
-                    bambini e i propri genitori sono stati coinvolti ad apprendere attraverso un uso creativo delle
-                    tecnologie.
-                    Il laboratorio intendeva supportare quelle famiglie che avevano un accesso limitato alle
-                    tecnologie,
-                    sia dal punto di vista sociale che economico</p>
-                </div>
-              </div>
-            </li>
-            <li class="timeline-inverted">
-              <div class="timeline-image">
-                <img class="rounded-circle img-fluid" src="img/timeline/4.jpg" alt="">
-              </div>
-              <div class="timeline-panel">
-                <div class="timeline-heading">
-                  <h4>Maggio 2015</h4>
-                  <h4 class="subheading">Scratch Day</h4>
-                </div>
-                <div class="timeline-body">
-                  <p class="text-muted">Nella Biblioteca Pubblica si è festeggiato lo Scratch Day 2015, una rete
-                    globale di eventi per celebrare
-                    Scratch. Scratch è uno strumento, una piattaforma di apprendimento, una comunità, che permette di
-                    avvicinarsi
-                    alla programmazione in modo divertente e creativo. Abbiamo iniziato sperimentando Scratch,
-                    installato
-                    nei computer della Biblioteca, insieme a giovani e meno giovani, e successivamente l’Istituto
-                    Tecnico
-                    Merloni ha organizzato una gara di robotica “TakingBall” con i LEGO Mindstorms NXT e infine,
-                    abbiamo
-                    terminato con una jam session suonando Makey Makey e SynergicNoise</p>
-                </div>
-              </div>
-            </li>
-            <li>
-              <div class="timeline-image">
-                <img class="rounded-circle img-fluid" src="img/timeline/5.jpg" alt="">
-              </div>
-              <div class="timeline-panel">
-                <div class="timeline-heading">
-                  <h4>Ottobre 2016</h4>
-                  <h4 class="subheading">Maker Faire ci risiamo!</h4>
-                </div>
-                <div class="timeline-body">
-                  <p class="text-muted">HoloScratch è stato il progetto con cui ci siamo presentati durante la Maker
-                    Faire 2016. Quest'ultimo è
-                    stato un progetto che mostrava come creare videogiochi con ologrammi sfruttando, in vari modi, una
-                    tecnica
-                    illusoria chiamata "Pepper's Ghost". Con Scratch, un linguaggio di programmazione visuale, è
-                    possibile
-                    creare animazioni e videogiochi in modo semplice e divertente e in questo progetto abbiamo visto
-                    come
-                    utilizzarlo per far apparire dei piccoli "fantasmi" in 3D</p>
-                </div>
-              </div>
-            </li>
-            <li>
-              <div class="timeline-image">
-                <img class="rounded-circle img-fluid" src="img/timeline/6.jpg" alt="">
-              </div>
-              <div class="timeline-panel">
-                <div class="timeline-heading">
-                  <h4>Ottobre 2016</h4>
-                  <h4 class="subheading">Linux Day</h4>
-                </div>
-                <div class="timeline-body">
-                  <p class="text-muted">In collaborazione con il gruppo del PDP, il Maker Spcae ha organizzato il Linux
-                    Day 2016 nella cittadina
-                    di Fabriano, evento nel quale l'argomento più discusso è stato proprio il coding, attività di cui
-                    il
-                    nostro gruppo aveva fatto la sua caratteristica più importante. I vari talk che hanno scandito
-                    l'intera
-                    giornata sono stati fondamentali poi per le nostre esperienze successive</p>
-                </div>
-              </div>
-            </li>
-            <li>
-              <div class="timeline-image">
-                <img class="rounded-circle img-fluid" src="img/timeline/7.jpg" alt="">
-              </div>
-              <div class="timeline-panel">
-                <div class="timeline-heading">
-                  <h4>Marzo 2017</h4>
-                  <h4 class="subheading">Uncinetto Type-D</h4>
-                </div>
-                <div class="timeline-body">
-                  <p class="text-muted">In occasione della settimana del Rosadigitale vi abbiamo mostrato come la
-                    storia della programmazione sia
-                    partita dalla tessitura. Jaquard, difatti, inventò le schede metalliche perforate per il telaio che
-                    successivamente
-                    furono adottate nella programmazione dei computer. Mamme e nonne hanno insegnato al gruppo del
-                    Maker
-                    Space le basi del cucito, del ricamo, dell'uncinetto e a fare a maglia, fino ad incontrare una
-                    innovativa
-                    macchina ricamatrice</p>
-                </div>
-              </div>
-            </li>
+          <ul id="timeline-container" class="timeline">
             <li class="timeline-inverted">
               <div class="timeline-image">
                 <h4>Be Part
@@ -506,13 +362,30 @@ <h3 class="text-secondary mb-0">{role}</h3>
       </div>
     </script>
 
-  <script id="social-template" type="text/html">
-      <li class="list-inline-item">
-        <a href="{url}" target="_blank">
-           <i class="fa fa-{social}"></i>
-         </a>
-      </li>
-    </script>
+  <script id="social-template" type="text/x-custom-template">
+    <li class="list-inline-item">
+      <a href="{url}" target="_blank">
+          <i class="fa fa-{social}"></i>
+        </a>
+    </li>
+  </script>
+
+  <script id="timeline-template" type="text/x-custom-template">
+    <li>
+      <div class="timeline-image">
+        <img class="rounded-circle img-fluid" src="{img}" alt="">
+      </div>
+      <div class="timeline-panel">
+        <div class="timeline-heading">
+          <h4>{title}</h4>
+          <h4 class="subheading">{subtitle}</h4>
+        </div>
+        <div class="timeline-body">
+          <p class="text-muted">{body}</p>
+        </div>
+      </div>
+    </li>
+  </script>
 
   <!-- Bootstrap core JavaScript -->
   <script src="vendor/jquery/jquery.min.js"></script>
@@ -529,6 +402,7 @@ <h3 class="text-secondary mb-0">{role}</h3>
   <script src="js/contact_me.js"></script>
 
   <script src="js/team.js"></script>
+  <script src="js/timeline.js"></script>
 
 </body>
 
diff --git a/js/timeline.js b/js/timeline.js
new file mode 100644
index 00000000..b022029a
--- /dev/null
+++ b/js/timeline.js
@@ -0,0 +1,60 @@
+const timeline = [
+    {
+        img: "img/timeline/1.jpg",
+        title: "Settembre 2014",
+        subtitle: "L'inzio di tutto",
+        body: "Il Maker Space nasce nel 2014 quando insieme alla Biblioteca Multimediale di Fabriano, Beatrice Rapaccini e Luca Ferroni forgiano questo gruppo basato sulle varie attività makers grazie anche all'indispensabile aiuto del PDP"
+    },
+    {
+        img: "img/timeline/2.jpg",
+        title: "Ottobre 2014",
+        subtitle: "La prima partecipazione alla Maker Faire",
+        body: "Evento nella quale abbiamo presentato il progetto “Makerspaces in Libraries”, mostrando come sia possibile attuare attività semplici e complesse nelle bibloteche pubbliche. In particolare, abbiamo presentato alcuni progetti nati all’interno delle attività del Maker Space"
+    },
+    {
+        img: "img/timeline/3.jpg",
+        title: "Marzo 2015",
+        subtitle: "Family Creative Learning",
+        body: "In collaborazione con il Centro per le Famiglie si sono realizzati degli incontri per famiglie, dove i bambini e i propri genitori sono stati coinvolti ad apprendere attraverso un uso creativo delle tecnologie. Il laboratorio intendeva supportare quelle famiglie che avevano un accesso limitato alle tecnologie, sia dal punto di vista sociale che economico"
+    },
+    {
+        img: "img/timeline/4.jpg",
+        title: "Maggio 2015",
+        subtitle: "Scratch Day",
+        body: "Nella Biblioteca Pubblica si è festeggiato lo Scratch Day 2015, una rete globale di eventi per celebrare Scratch. Scratch è uno strumento, una piattaforma di apprendimento, una comunità, che permette di avvicinarsi alla programmazione in modo divertente e creativo. Abbiamo iniziato sperimentando Scratch, installato nei computer della Biblioteca, insieme a giovani e meno giovani, e successivamente l’Istituto Tecnico Merloni ha organizzato una gara di robotica “TakingBall” con i LEGO Mindstorms NXT e infine, abbiamo terminato con una jam session suonando Makey Makey e SynergicNoise"
+    },
+    {
+        img: "img/timeline/5.jpg",
+        title: "Ottobre 2016",
+        subtitle: "Maker Faire ci risiamo!",
+        body: 'HoloScratch è stato il progetto con cui ci siamo presentati durante la Maker Faire 2016. Quest\'ultimo è stato un progetto che mostrava come creare videogiochi con ologrammi sfruttando, in vari modi, una tecnica illusoria chiamata "Pepper\'s Ghost". Con Scratch, un linguaggio di programmazione visuale, è possibile creare animazioni e videogiochi in modo semplice e divertente e in questo progetto abbiamo visto come utilizzarlo per far apparire dei piccoli "fantasmi" in 3D'
+    },
+    {
+        img: "img/timeline/6.jpg",
+        title: "Ottobre 2016",
+        subtitle: "Linux Day",
+        body: "In collaborazione con il gruppo del PDP, il Maker Spcae ha organizzato il Linux Day 2016 nella cittadina di Fabriano, evento nel quale l'argomento più discusso è stato proprio il coding, attività di cui il nostro gruppo aveva fatto la sua caratteristica più importante. I vari talk che hanno scandito l'intera giornata sono stati fondamentali poi per le nostre esperienze successive"
+    },
+    {
+        img: "img/timeline/7.jpg",
+        title: "Marzo 2017",
+        subtitle: "Uncinetto Type-D",
+        body: "In occasione della settimana del Rosadigitale vi abbiamo mostrato come la storia della programmazione sia partita dalla tessitura. Jaquard, difatti, inventò le schede metalliche perforate per il telaio chesuccessivamente furono adottate nella programmazione dei computer. Mamme e nonne hanno insegnato al gruppo del Maker Space le basi del cucito, del ricamo, dell'uncinetto e a fare a maglia, fino ad incontrare una innovativa macchina ricamatrice"
+    }
+]
+
+$("#timeline-container").ready(buildTimeline);
+
+function buildTimeline(){
+    let output = "";
+
+    timeline.forEach(step => {
+        let temp = $("#timeline-template").html(); // carica template
+        Object.keys(step).forEach(k => {
+            temp = temp.replace(`{${k}}`, step[k]);
+        })
+        output += temp;
+    })
+    output += $("#timeline").html();
+    $("#timeline-container").html(output);
+}
\ No newline at end of file