Galleria per album di Google foto

AGGIORNAMENTO: Google ha tolto la possibilità di rendere pubblici gli album di Google foto. Se gli album non sono pubblici, le gallerie e gli slideshow ad essi collegati non possono funzionare. Per ora, gli album già pubblici sono rimasti tali e continuano, quindi, ad essere visibili nelle gallerie di questa guida.

Prima galleria:

Per una semplice galleria di immagini, posso indicarvi questo script:
<script src="https://scarygami.github.io/picasa-album/components/webcomponentsjs/webcomponents.min.js" async defer>
</script>
<link rel="import" href="https://scarygami.github.io/picasa-album/components/picasa-album/picasa-album.html">
<picasa-album user="114787917099375485799" album="6111963199393562945" class="fit">
</picasa-album>

Lo potete testare incollandolo direttamente nell' HTML editor.

Per trovare i vostri ID personali (numeri identificativi), leggete le guide pubblicate nella pagina: Come fare a..

Dato che questo script utilizza un file depositato su un server esterno, non posso garantirne la continuita`. Se non dovesse piu` funzionare, avvisatemi. Grazie

Seconda galleria:

Galleria di immagini da un album di Google foto
Click per l'anteprima funzionante:


Ora vi presento una bellissima galleria di immagini per uno o piu` album di Google. La galleria e` responsive e si adatta, quindi, a qualsiasi dimensione dello schermo.
E` possibile realizzare una galleria per un solo album, oppure per album diversi. In questo caso, appariranno, sopra alla galleria, i link per passare da un album all'altro.

Puoi scaricare le gallerie cliccando....qui

. Le parti del codice da personalizzare sono queste....

Per la galleria singola:

Aprite il file.html con un editor di testo e cercate questa stringa....
<div id="plusgallery"
data-userid="XXXXXXXX"
data-type="google"
data-album-id="XXXXXXXX"></div>

Al posto della prima fila di X dovete inserire il vostro ID di Google+ e al posto della seconda fila l'ID dell'album.

Per trovare gli ID che servono, leggete le guide pubblicate nella pagina: Come fare a..La prima fila di numeri corrisponde al vostro ID personale, la seconda all'ID dell'album.

Per la galleria multipla:

Sempre nel file.html, questa e` la parte di codice da modificare:
<body> <a href="#" id='XXXXXXXX' onclick="loadGallery($(this).
attr('id'));$('a').css('color','blue'); $(this).css('color','red')">Gallery 1</a>
<a href="#" id='XXXXXXXX' onclick="loadGallery($(this).
attr('id'));$('a').css('color','blue'); $(this).css('color','red')">Gallery 2</a>
<a href="#" id='XXXXXXXX' onclick="loadGallery($(this).
attr('id'));$('a').css('color','blue'); $(this).css('color','red')">Gallery 3</a>
<div id="gallerywrapper">
</div>
   <script src="ajax-jquery-min.js"></script>
  <script>window.jQuery || document.write("<script src='jquery-min.js'>\x3C/script>")
  </script>
  <script src="plusgallery.js"></script>
  <script>
      var loadGallery = function(id){
          $('#gallerywrapper').html('<div id="plusgallery"
         data-userid="XXXXXXXX" data-type="google" data-album-id="' + id + '">
</div>');
          $('#plusgallery').plusGallery();
      }
   document.ready= function(){
    var gallery_id = 'XXXXXXXX';    
    $('a').css('color','blue');
    $('#'+gallery_id).css('color','red');
    loadGallery(gallery_id);

Fonte

Le parti da personalizzare sono....

In rosso:

Al posto delle X dovete mettere l'ID dei vari album.

"Blue" e "red" corrispondono al colore dei link per la scelta degli album, prima e dopo il click.

"Gallery (1/2/3)" e` il testo dei link.

In verde:

Al posto delle X dovete mettere il vostro ID personale.

In blue:

Al posto delle X dovete mettere l'ID dell'album che volete compaia per primo all'apertura della pagina.

Per entrambe le gallerie:
background-color: transparent;

Al posto di "transparent" potete mettere il colore di sfondo che preferite, utilizzando il suo nome in inglese, oppure il codice web (Editor colori).

Guarda anche: Google foto, slideshow no flash






Fammi sapere se questo argomento ti è stato utile.
Se non ti è stato utile, potrai inviare le tue osservazioni. Grazie
Ti è stato utile questo argomento?
Si
No

Continua con:
E molto altro ancora se leggi:
Tutti gli argomenti