:: suivant >>

Éditer :: []->

Widget Photo


But : afficher les miniatures des dernières photographies ajoutées dans le CEL et rendues publiques. Cliquer dessus permet de les afficher en plus grand et de les faire défiler.

Ce widget permet d'afficher des miniatures des dernières images du CEL, sous forme de mosaïque. La dernière image est affichée en plus grand format. En cliquant sur une des vignettes, un diaporama s'ouvre pour afficher les images en grand format.

Permalien

https://www.tela-botanica.org/widget:cel:photo

Intégration dans votre site

Pour intégrer ce widget sur votre site, copiez et collez le code ci-dessous :
<div id="galerie-cel-1">

  <!-- Javascript : bibliothèques -->
  <script type="text/javascript" src="""https://www.tela-botanica.org/commun/jquery/1.6.2/jquery-1.6.2.min.js"""></script>
  <script type="text/javascript" src="""https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"""></script>

  <!-- Feuilles de styles -->
  <link rel="stylesheet" type="text/css" href="""https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css""" media="screen" />
  <link rel="stylesheet" type="text/css" href="""https://www.tela-botanica.org/widget:cel:modules/photo/squelettes/css/photo.css""" media="screen" />

  <script type="text/javascript">
      $.getJSON("""https://www.tela-botanica.org/widget:cel:photo?mode=ajax&callback=?""", function (galerie) {
        $("#galerie-cel-1").append(galerie.contenu);
      });
  </script>
</div>

Paramètres d'affichage


Paramètres de filtrage


Ces paramètres peuvent être combinés à l'aide de & : ?critere1=valeur1&critere2=valeur2.
ex. https://www.tela-botanica.org/widget:cel:photo?dept=34&tag=feuille&vignette=15,10&extra=0

Exemples

Afficher les photos du CEL :
<!-- Javascript : bibliothèques -->
  <script type="text/javascript" src="""https://www.tela-botanica.org/commun/jquery/1.6.2/jquery-1.6.2.min.js"""></script>
  <script type="text/javascript" src="""https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"""></script>

  <!-- Feuilles de styles -->
  <link rel="stylesheet" type="text/css" href="""https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css""" media="screen" />
  <link rel="stylesheet" type="text/css" href="""https://www.tela-botanica.org/widget:cel:modules/photo/squelettes/css/photo.css""" media="screen" />

<div id="galerie-cel-2" style="width:310px;">
  <script type="text/javascript">
      $.getJSON("https://www.tela-botanica.org/widget:cel:photo?mode=ajax&callback=?&id=1", function (galerie) {
        $("#galerie-cel-2").append(galerie.contenu);
      });
  </script>
</div>



Afficher les photos taguées "Plantnet" et "feuille" :
<!-- Javascript : bibliothèques -->
  <script type="text/javascript" src="""https://www.tela-botanica.org/commun/jquery/1.6.2/jquery-1.6.2.min.js"""></script>
  <script type="text/javascript" src="""https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"""></script>

  <!-- Feuilles de styles -->
  <link rel="stylesheet" type="text/css" href="""https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css""" media="screen" />
  <link rel="stylesheet" type="text/css" href="""https://www.tela-botanica.org/widget:cel:modules/photo/squelettes/css/photo.css""" media="screen" />

 <div id="galerie-cel-3" style="width:310px;">
  <script type="text/javascript">
      $.getJSON("""https://www.tela-botanica.org/widget:cel:photo?mode=ajax&callback=?&tag=plantnetETfeuille""", function (galerie) {
        $("#galerie-cel-3").append(galerie.contenu);
      });
  </script>
</div>



Afficher la galerie photo du projet "Atelier rubus", avec un titre, 10x5 photos, sans afficher de grande photo :
<!-- Javascript : bibliothèques -->
<script type="text/javascript" src="https://www.tela-botanica.org/commun/jquery/1.6.2/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.js"></script>

<!-- Feuilles de styles -->
<link rel="stylesheet" type="text/css" href="https://www.tela-botanica.org/commun/jquery/fancybox/1.3.4/jquery.fancybox-1.3.4.css" media="screen" />
<link rel="stylesheet" type="text/css" href="https://www.tela-botanica.org/widget:cel:modules/photo/squelettes/css/photo.css" media="screen" />

<div id="galerie-cel-4" style="width:900px;">
  <script type="text/javascript">
      $.getJSON("https://www.tela-botanica.org/widget:cel:photo?mode=ajax&callback=?&projet=AtelierRubus&id=3&titre=Atelier+Rubus&extra=0&vignette=10,5", function (galerie) {
        $("#galerie-cel-4").append(galerie.contenu);
      });
  </script>
</div>