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

Veröffentlicht unter Artisteer, Webdesign Getagged mit: , , ,
One comment on “Einbindung von eigenen CSS- und Javascripten in Artisteer- oder Frontpage-Templates
  1. webdesign-nrw sagt:

    Thx für die Beschreibung. Habe das zip-Archive als Basis hergenommen und funktioniert wunderbar. Habe noch bemerkt, daß man die “@import url()” auch gleich über Datei -> Exportieren -> CSS-Optionen mit in die CSS reinschreiben kann. Dann muß nach einem Update nur noch die js-Datei angepasst werden. Wäre super, wenn Artisteer soetwas irgendwann standardmäßig mit einbaut. Jedenfalls sind meine Kunden von der Fancybox begeistert, werde gleich mal die Preise nachverhandeln ;-).

Hinterlasse eine Antwort

Diese Website nutzt Cookies, um unseren Besuchern die bestmögliche Funktionalität bieten zu können. Durch die weitere Nutzung unserer Seiten erklären Sie sich mit dem Einsatz von Cookies einverstanden. Erfahren Sie mehr zum Einsatz von Cookies und dem Umgang mit Ihren persönlichen Daten in unserer: Datenschutzerklärung

Die Cookie-Einstellungen auf dieser Website sind auf "Cookies zulassen", um Ihnen das beste Surferlebnis möglich zu geben. Wenn Sie diese Website ohne Änderung Ihrer Cookie-Einstellungen zu verwenden fortzufahren, oder klicken Sie auf "Akzeptieren" unten, dann erklären Sie sich mit diesen.

Schließen