Voici un tutoriel Jimdo qui va vous permettre en quelques étapes d'intégrer un slider sur votre site Jimdo. Soit en le plaçant où vous voulez sur votre site, ou alors en remplaçant le header traditionnel du site. (Ce tutoriel convient aux sites Jimdo ayant encore les anciens designs retirés depuis la nouvelle version de Jimdo). Ce tutoriel est une adaptation d'un tuto trouvé sur ce site anglais. Vous pouvez trouver le site de l'auteur du slider ici. Voilà, si vous avez des questions, n'hésitez pas à laisser un commentaire ;)
1. Code du slider (head)
La première étape consiste à mettre le code principale du slider (dans le head du site). Pour cela, insérer un code dans "Modifier le head" (dans "Paramètres") :
2. Intégration du slider
Maintenant que vous avez choisi le bon code (selon si vous voulez placer le slider à la place du header ou dans le contenu du site), il vous reste à placer le code html du slider, soit où vous voulez sur votre site (dans le contenu d'une page, dans la sidebar), soit obligatoirement dans la sidebar du site si vous voulez en faire votre header; le slider sera sur toutes les pages du sites et il sera facilement retirable.
Voici donc sans plus attendre, le code html à insérer dans un élément "Widget / HTML" à l'emplacement choisi :
<!-- slider -->
<div id="slider" class="nivoSlider">
<img src="https://u.jimdo.com/www54/o/s69d5f554f755d149/userlayout/img/slide01.jpg" alt="" title="#htmlcaption1" />
<img src="https://u.jimdo.com/www54/o/s69d5f554f755d149/userlayout/img/slide02.jpg" alt="" title="#htmlcaption2" />
<img src="https://u.jimdo.com/www54/o/s69d5f554f755d149/userlayout/img/slide03.jpg" alt="" title="#htmlcaption3" />
<img src="https://u.jimdo.com/www54/o/s69d5f554f755d149/userlayout/img/slide04.jpg" alt="" title="#htmlcaption4" />
</div>
<!-- fin du slider -->
Personnalisation
La personnalisation est assez simple, il faut maintenant changer l'adresse des images actuelles par vos images. Pour cela, vous aurez besoin de l'adresse URL des images que vous voudrez insérer dans le slider. Vous pouvez héberger les images sur Jimdo et simplement via un clic droit, récupérer/copier l'adresse de l'image. Sinon, vous pourrez trouver en effectuant une simple recherche sur Google avec les mots clés "hébergeur image gratuit", un hébergeur pour vos images si vous préférez.
Dans le code HTML précédent, vous pouvez observer les adresses des images actuelles en bleu :
<img src="https://u.jimdo.com/www54/o/s69d5f554f755d149/userlayout/img/slide01.jpg" alt="" title="#htmlcaption1" />
A vous de remplacer les adresses URL des images par vos propres images. Par exemple, remplacez https://u.jimdo.com/www54/o/s69d5f554f755d149/userlayout/img/slide01.jpg par l'adresse URL d'une de votre image (l'adresse URL est donnée par votre hébergeur d'image ou en effectuant un clic droit et en cherchant suivant le navigateur à copier l'adresse de l'image).
Astuces supplémentaires
Pour les anciens designs Jimdo : Vous pouvez régler la taille du slider en modifiant la taille du header Jimdo directement dans l'administration de votre site en cliquant sur "Modifier le header", puis il faut cliquer sur un bouton nommé également "Modifier le header".
Si vous utilisez un design personnel, le tutoriel fonctionnera tout de même, mais vous devrez effectuer quelques modifications mineurs.
Écrire commentaire
jimdouser (vendredi, 05 octobre 2018 10:42)
le code n'est pas sécurisé il faut rajouter un "S" a la fin de HTTP , le nouveau protocole de Jimdo le demande