Comment intégrer facilement une librairie/galerie jQuery

Par pierrot10, il y a 10 ans


Bonjour à tous,
J'ai fait un site CakePHP 2.4.5 et je dois maintenant intégrer une gallerie.

J'ai choisi Cycle : [http://malsup.com/jquery/cycle2/]()
et particulierement celle-ci :[ http://malsup.com/jquery/cycle2/demo/caro-pager.php]()

Aussi, j'ai fais un peu comme un CMS. Un etideur peut ajouter, éditer une page etc...
J'ai donc un controller
Controller/PagesController.pgp
et une vue
/View/Pages/show.ctp

Dans ma vue /View/Pages/show.ctp, j'ai ce bout de code qui me permet d'afficher le contenu que l'editeur aura préalablement enregistrer grace a WYSIWYG.

<?php if($page['id']==9){ echo $this->element('showAgenda',array('cache'=> array('config'=>'week'))); echo $this->element('showNews',array('cache'=> array('config'=>'week'))); }else if($page['id']==37){ echo "<p>"; echo "A Gallery is coming..."; echo "</p><p></p>"; }else{ echo $page['content']; }?>

La page avec l'id 37 concerne ma problématique.

L'éditeur qui a créer la page avec l'ID n'aimerais pas mettre du texte mais une gallerie de photo.
J'ai donc ajouté cette partie de code

}else if($page['id']==37){ echo "<p>"; echo "A Gallery is coming..."; echo "</p><p></p>"; }else{

et je dois évidemment, remplacer "A Gallery is coming" par une gallerie de ce style
[http://malsup.com/jquery/cycle2/demo/caro-pager.php]()

Pour commencer, j'aimerais savoir comment facilement intégrer ce code jQuery lorsque la page id37 est chargée

<script src="http://malsup.github.io/jquery.cycle2.carousel.js"> </script> <script src="http://malsup.github.io/jquery.cycle2.tile.js"> </script> <script> jQuery(document).ready(function($){ var slideshows = $('.cycle-slideshow').on('cycle-next cycle-prev', function(e, opts) { // advance the other slideshow slideshows.not(this).cycle('goto', opts.currSlide);}); $('#cycle-2 .cycle-slide').click(function(){ var index = $('#cycle-2').data('cycle.API').getSlideIndex(this); slideshows.cycle('goto', index);}); }); </script>

Je pense que par le suite, je pourrais facilement charger les images voulues, entre les div

<div id="slideshow-1"> </div> <div id="slideshow-2"> </div>

Je vous remercie pour vos lumières

Aucune réponse