Pubblicato il 16/05/16e aggiornato il

Come installare il widget della nuvola di etichette animata in Blogger.

Come installare il widget della Nuvola delle Etichette Animate su Blogger che deriva dal plugin WP-Cumulus di Wordpress.
Qualche anno fa gli utenti di Blogger si erano innamorati di un widget molto carino che alcuni sviluppatori avevano importato su questa piattaforma partendo da un celebre plugin di Wordpress denominato WP-Cumulus. Tale widget era basato in Flash, tecnologia che da qualche tempo è negletta dai principali browser e produttori di hardware.

Per tale ragione il plugin su Wordpress non è stato più aggiornato e anche i widget di Blogger hanno smesso di funzionare perché era stato disattivato il file SWF che era alla base del gadget. Visto che sono persona particolarmente coscienziosa e prudente era stata mia cura salvare tutti i file necessari per questa installazione che adesso vado a illustrare nuovamente.

Per prima cosa si deve andare su Layout > Aggiungi un gadget > Base e si clicca sul widget Etichette per aprire la sua finestra di configurazione.

configurazione-nuvola-etichette

Dobbiamo digitare un titolo che ci permetterà poi di trovare facilmente il widget nel modello. Si mette poi la spunta su Etichette Selezionate per verificare il numero di etichette presenti. Se il numero delle etichette è inferiore a 30 come nel blog di test che ho usato allora si rimette la spunta su Tutte le etichette. Se invece tale numero fosse superiore a 30 allora dobbiamo selezionarne solo alcune. Si clicca quindi su Modifica per scegliere le etichette per un massimo di 30 unità.


nuvola-etichette

Si va su Salva quindi con il mouse si posiziona il widget nel punto in cui visualizzare la nuvola. Si clicca in alto su Salva Disposizione. Ovviamente per il momento si vedrà solo un elenco verticale delle etichette selezionate. Ora dopo aver salvato il template si va su Modello > Modifica HTML e con Ctrl+F si cerca il titolo del widget, nel test ho usato Nuvola Etichette.

Il codice del widget sarà quasi interamente nascosto. Si dovrà cliccare sulle due freccette nere poste a sinistra per vederlo interamente. Tale codice inizierà con la riga <b:widget id='Label.. e terminerà con </b:widget>. Questo codice va cancellato e sostituito con quest'altro

<b:widget id='Label99' locked='false' title='Nuvola Etichette' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='https://googledrive.com/host/0B5vupkCL4QrxQnlwN25SZHd2eTQ/swfobject.js' type='text/javascript'></script>
<div id='flashcontent'></div>
<script type='text/javascript'>
var so = new SWFObject("https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/blogumus.swf", "tagcloud", "250", "250", "7", "#ffffff");
so.addVariable("tcolor", "0xD84938");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
</div>
</b:includable>
</b:widget>

Si salva il modello.

codice-nuvola-etichette-blogger

Le personalizzazioni da fare al gadget sono le seguenti:
  1. 250 e 250 sono la larghezza e l'altezza del widget
  2. #ffffff è il codice del colore dello sfondo
  3. #D84938 è il codice del colore del testo
  4. "100" è la velocità della animazione
  5. '12' è il numero di pixel della dimensione dei font
  6. Label99 è l'ID del widget compatibile anche con un altro gadget delle Etichette.
nuvola-animata-etichette

Al passaggio del mouse le etichette si muoveranno con la velocità impostata dalla riga so.addVariable("tspeed", "100"); e se l'utente ci clicca sopra aprirà la pagina corrispondente. Il gadget come detto si basa su tecnologia Flash e alcuni browser come Chrome prima di riprodurre un tale oggetto HTML possono mostrare un bottone di Play di questo genere

gadget-etichette-nuvola-animata
Il titolo del widget può essere eliminato in un secondo tempo dopo che si sia sostituito il codice. 

APPENDICE A FUTURA MEMORIA


Il gadget funzionerà sia nei blog gratuiti del tipo Blogspot sia in quelli personalizzati. Tale widget probabilmente però smetterà di funzionare il giorno 31 Agosto 2016 per il ritiro del supporto di Hosting a Google Drive. I blog gratuiti possono risolvere facilmente sostituendo i due file .js e .SWF colorati di viola caricati su Google Drive con gli stessi file caricati su Google Sites. Anzi agli utenti di questi siti è consigliato di sostituire subito gli URL suddetti con i seguenti

https://sites.google.com/site/progetto3322/archivio/blogumus.swf
https://sites.google.com/site/progetto3322/archivio/swfobject.js

Per i blog con domini personalizzati il discorso non vale perché i file su Google Sites talvolta non vi funzionano. Dovrete quindi scaricare il file ZIP con i due file da Dropbox o Google Drive
Dopo aver scompattato il file con 7Zip o software analogo si dovranno caricare i file su un hosting tipo uno spazio di un dominio personale e ottenerne il link diretto da sostituirlo nel codice.




2 commenti :

  1. Blogumus ritorna, grazie per aver scritto questo post in seguito alla mia domanda. Una cosa, se non avesse salvato i file di questo blogumus, non funzionerebbe più?

    RispondiElimina
    Risposte
    1. No perché quando è stato ritirato dall'hosting sarebbe andato perso
      @#

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.