Je wilt misschien je slider in HTML kunnen exporteren, zoday je hem kunt gebruiken in een website op HTML-basis, of in een andere CMS dan Wordpress. De HTML-code van cssSlider kan in iedere CMS gebruikt worden die direct gebruik van HTML toestaat.
Wanneer je je slider voltooid hebt door alle afbeeldingen erin te zetten, de stijl en het overgangseffect te veranderen en titels en bijschriften toe te voegen, kun je de HTML op de volgende manier exporteren:
Klik op de ‘Sla HTML op’-knop in de navigatiebar bovenaan.
Kies een map waar de HTML zal worden opgeslagen en klik ‘sla op.’
De HTML gebruiken
De belangrijkste HTML zal zich in een bestand bevinden dat cssslider.html heet. Dit bevat een complete pagina HTML, klaar om zonder aanpassingen in een browser te worden weergegeven.
Je kunt deze pagina gebruiken als de basis van een simpele websitepagina, door extra inhoud toe te voegen als een titel, tekst en links.
Het is echter waarschijnlijk dat je de cssSlider wilt kopiëren naar een webpagina die je al hebt.
Wanneer je de slider naar een bestaande HTM-pagina wilt kopiëren, moet je alles kopiëren tussen:
<!-- Start cssSlider.com -->
En:
<!-- End cssSlider.com -->
Je plakt vervolgens die code op de juiste locatie voor de slider in de bestaande HTML-code, bijvoorbeeld in een koptekst. Onthoud dat de slider volledig toegankelijk is, dus hij kan zichzelf vervormen om in de beschikbare schermruimte te passen.
Foutopsporing in de HTML
Wanneer je na het kopiëren van de HTML problemen ziet, kijk dan de volgende secties na:
<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]-->
De url’s linken naar stylesheets die zich in een aparte map bevinden die engine wordt genoemd (ID van je slider) Wanneer je de naam van de map verandert of hem naar een andere locatie verplaatst, zul je de links daaraan moeten aanpassen.
<div class="img"><img src="data1/images/istock_000000654343xsmall.jpg" style="width: 100%;"></div>
Dit zijn links naar de afbeeldingen van de slideshow, en wederom bevinden die zich in een aparte map, data genaamd (ID van je slider). Opnieuw geldt dat je de naam van de map of de locatie niet kunt veranderen zonder dat ook in de links te wijzigen. We raden je aan om alle afbeeldingen in een aparte map te houden om het vinden ervan makkelijker te maken.
<div class="img"><img src='data1/tooltips/istock_000000654343xsmall.jpg' alt='iStock_000000654343XSmall' title='iStock_000000654343XSmall' /></div>
In dezelfde datamap zit ook een tweede submap voor thumbnailafbeeldingen. Wanneer je navigatiestippen met thumbnailpreviews gebruikt, is dit de plaats waar de thumbnails worde opgeslagen. Opnieuw geldt: wanneer je de locatie of naam van de map verandert, moeten de links ook worden aangepast.
