Chez Papinou - Skins GuppY 5

 

top.gif

   GuppY 5 ???   Il y a moins bon mais c'est plus cher ! ! !   
   S'il n'y a pas de solution, c'est qu'il n'y a pas de problème. Devise Shadok   
   Utilisateur de GuppY, je suis membre de l' Asso freeGuppY ... et vous ? ? ?   
   Pourquoi vouloir compliquer ?  Essayez GuppY 5  tout simplement ... smile   
   N'oubliez pas d'installer un .htaccess pour protéger l'accès à  la zone d'administration de GuppY 5.   
   Votre premier réflexe après le téléchargement de GuppY 5 ?   Lire la documentation  ! ! !   
Vous êtes ici :   Accueil » Diaporama responsive en header
 
Prévisualiser...  Imprimer...  Imprimer la page...
Prévisualiser...  Imprimer...  Imprimer la section...
Partenaire GuppY
logo_nuxit_guppy.png
Astuces GuppY 5
 ↑  
Translator
Nouvelles

+ Année 2017
 -  Année 2017
+ Année 2016
 -  Année 2016
 Décembre 2016
 Octobre 2016
 Septembre 2016
 Juillet 2016
 Juin 2016
 Mai 2016
 Avril 2016
 Mars 2016
 Février 2016
 Janvier 2016
+ Année 2015
 -  Année 2015
+ Année 2014
 -  Année 2014
En savoir plus
Radio Papinou
radio01.png
 
Twitter

Dons Chez Papinou

Si vous le souhaitez vous pouvez participez aux frais en faisant un don.

Je vous laisse le soin de choisir le montant, l'essentiel étant le geste.

Calendrier
rss Cet article est disponible en format standard RSS pour publication sur votre site web :
https://www.papinou.fr/data/fr-articles.xml

Pour mettre un diaporama responsive en header de votre site, voici le code que j'ai utilisé sur papinou.info dans une boite libre:

<div style="text-align:center;width:100%;margin:0 auto;border: 10px ">
<div class="fotorama" data-arrows="false" data-autoplay="8000" data-nav="false" data-ratio="1920/540" data-shuffle="true" data-transition="crossfade" data-width="100%"><!-- ↑ The same as data-ratio="16/9" or data-ratio="1.3333333333". --><img src="skins/skn5_papinou04/img/header00.jpg" /> <img src="skins/skn5_papinou04/img/header01.jpg" /> <img src="skins/skn5_papinou04/img/header02.jpg" /> <img src="skins/skn5_papinou04/img/header03.jpg" /> <img src="skins/skn5_papinou04/img/header04.jpg" /> <img src="skins/skn5_papinou04/img/header05.jpg" /></div>
</div>

J'ai mis six images dans le répertoire img de ma skin, attention à ne pas ralentir l'affichage des pages de votre site, à optimiser vos images pour les alléger au maximum, à refaire les liens <img src="skins/skn5_papinou04/img/header00.jpg" /> correspondant à vos images.boite_header.jpg

Vous devez modifier  data-ratio="1920/540" pour correspondre à votre largeur de site. pour un site en 1024px, vous pouvez mettre data-ratio="1000/280", pour un site en 1280px, ce sera data-ratio="1280/350", en 1600px data-ratio="1600/400", bien sur vous pouvez diminuer la hauteur du bandeau suivant vos images.

Vous pouvez aussi modifier le border: 10px; de la première ligne du code qui correspond à l'encadrement blanc de chaque image.

Une obligation :  toutes vos images doivent avoir la même taille pour la cohérence de l'ensemble.

Pour cette boite libre FB8518 sur mon site, je n'affiche pas le titre, elle a pour titre: §header.

Pour l'affichage de la boite libre sur votre page, vous devez la sélectionner dans config boites sur la première ou la seconde ligne pour Boites en haut, suivant votre configuration.


En suivant ce tutoriel, vous devez avoir le même affichage que sur mon site.

Pour toutes les questions concernant cet article, merci de poster sur mon forum, rubrique Plugins, forks, astuces GuppY.

 


Date de création : 11/09/2015 @ 15:11
Catégorie : Astuces GuppY 5 - GuppY 5
Page lue 4053 fois

Vous êtes ici :   Accueil » Diaporama responsive en header
 
Prévisualiser...  Imprimer...  Imprimer la page...
Prévisualiser...  Imprimer...  Imprimer la section...
Préférences

Se reconnecter :
Votre nom (ou pseudo) :
Votre mot de passe
Captcha reload
Recopier le code :


  4557984 visiteurs
  12 visiteurs en ligne

Connectés :
( personne )
Snif !!!
Licence
Cette création est mise à disposition des visiteurs selon les termes de la
Toute citation doit comporter un lien direct vers la page d'origine.
Chez Papinou est en ligne depuis le 26.03.2006
 
Lire les mentions légales