Einbindung von eigenen CSS- und Javascripten in Artisteer- oder Frontpage-Templates

Bei kleineren Internetprojekten soll häufig auf ein CMS verzichtet werden. Neben der grafischen Gestaltung überlässt man auch die Seitenverwaltung den Geschicken von Artisteer & Co. Trotzdem braucht man nicht auf moderne Präsentationstechniken, wie Galerien like Fancybox, auf Basis von Jquery zu verzichten.
Jquery bringt Artisteer bereits mit. Allerdings müssten die eigenen Skripte in jede Seite manuell rein kopiert werden und bei jeder Aktualisierung der Seiten, sind diese manuellen Anpassungen wieder weg.

Glücklicherweise generiert Artisteer aber auch eine CSS- und eine Javaskript-Datei. In diesen kann man für alle Seiten des Projektes beliebige externe Skripte aufrufen.

Für eigene CSS-Dateien ergänzt man die „style.css“ um folgenden Eintrag in der ersten Zeile:
@import url(„Pfad-zur-css-Datei“);

Für eigene Javascript-Dateien ergänzt man die „script.js“ um folgenden Eintrag in der ersten Zeile:
document.write(‚<script type=“text/javascript“ src=“Pfad-zur-js-Datei“></script>‘);

Zu beachten ist, daß die „script.js“ nach der „jquery.js“ aufgerufen wird.

Beispiel der Einbindung von Fancybox in ein Artisteer-Template:

style.css ergänzen um:
@import url(„fancybox_lib/jquery.fancybox-1.3.4.css“);

script.js ergänzen um:
document.write(‚<script type=“text/javascript“ src=“fancybox_lib/jquery.mousewheel-3.0.4.pack.js“></script>‘);
document.write(‚<script type=“text/javascript“ src=“fancybox_lib/jquery.fancybox-1.3.4.pack.js“></script>‘);
document.write(‚<script type=“text/javascript“ src=“fancybox_lib/jquery.fancybox.image-galerie.js“></script>‘);

Die Pfade und Dateinamen sind natürlich entsprechend anzupassen. Die Verweise auf ein vergrößertes Galeriebild werden zum Beispiel um ‚rel=“example_group“‚ ergänzt. Und auch diese Änderungen sind nach einer Aktualisierung und einem Export der Seiten wieder neu einzutragen, aber eben nicht für jede einzelne Seite.

Download komplettes Beispiel: Artisteer-Template mit Fancybox