Vous pouvez exporter votre Slider en HTML, si vous avez besoin de l'inclure dans un site web HTML, ou dans un CMS autre que WordPress. Le code HTML créé par cssSlider peut être utilisé dans n’importe quel CMS qui vous permet d'utiliser et de modifier directement le code HTML.
Lorsque vous avez terminé votre Slider, après avoir ajouté toutes les images que vous souhaitez utiliser, modifié l’habillage et l'effet de transition, ajouté les titres et légendes, vous pouvez exporter le code HTML de la manière suivante:
Cliquez sur le bouton «Enregistrer en HTML» dans la barre de navigation supérieure.
Choisissez un dossier dans lequel votre code HTML sera sauvegardé, puis cliquez sur «Enregistrer».
Utilisation du HTML
Le principal HTML sera dans un fichier appelé 'cssslider.html'. Celui-ci contient une page complète en HTML, prête à être affichée sur un navigateur sans aucune modification ou édition.
Vous pouvez utiliser cette page comme la base d'une simple page d’un site Web, en ajoutant du contenu supplémentaire, comme un titre et des liens.
Cependant, le scénario le plus probable est que vous voulez copier le cssSlider dans une page web que vous avez déjà.
Si vous souhaitez copier le Slider dans une page HTML existante, vous devrez vous assurer que vous copiez tout entre:
<!-- Start cssSlider.com -->
et:
<!-- End cssSlider.com -->
Vous devez coller ce code dans l'emplacement correct pour le Slider dans votre code HTML, par exemple dans le Header div. Rappelez-vous que le Slider est complètement réactif, et qu’il se redimensionnera pour s’adapter à l'espace disponible à l'écran.
Dépannage du HTML
Si, après avoir copié le code HTML vous rencontrez des problèmes veuillez vérifier les sections suivantes:
<link rel="stylesheet" href="engine1/style.css">
<!--[if IE]><link rel="stylesheet" href="engine1/ie.css"><![endif]-->
<!--[if lte IE 9]><script type="text/javascript" src="engine1/ie.js"></script><![endif]-->
Le lien URL pour les feuilles de style est contenu dans un dossier séparé appelé engine (ID de votre Slider). Si vous modifiez le nom du dossier ou déplacez le dossier vers un autre emplacement dans le système de fichiers, vous aurez besoin de mettre à jour les liens de manière appropriée.
<div class="img"><img src="data1/images/istock_000000654343xsmall.jpg" style="width: 100%;"></div>
Ce sont les liens vers les images du diaporama, et encore ces images sont contenues dans un dossier distinct appelé data (ID de votre Slider). Encore une fois, si vous renommez le dossier ou modifiez l'emplacement, vous devrez mettre à jour ces liens. Nous vous recommandons de conserver toutes vos images du diaporama dans un dossier séparé pour les rendre plus facile à trouver/à utiliser.
<div class="img"><img src='data1/tooltips/istock_000000654343xsmall.jpg' alt='iStock_000000654343XSmall' title='iStock_000000654343XSmall' /></div>
Dans le même dossier data (ID de votre Slider) existe un deuxième sous-dossier pour les images miniatures. Si vous avez inclus la navigation avec des aperçus miniatures, c’est l'endroit où ces vignettes sont stockées. Encore une fois, si vous déplacez ou changez le nom du dossier, vous devrez changer les liens.
