Templatevorlagen erstellen

Assets in die Seitenstruktur einbinden

Die eben erstellten Assets sind aber auf der Seite noch nicht sichtbar, da sie innerhalb eines Templates eingebunden werden müssen.

Um ein Asset im Template auszugeben, wechseln Sie auf den Reiter Seitenstruktur.
Über das Tag wird auf das erste Asset zugegriffen. Die einfachste Art alle drei Assets aus der eben erstellten Assetvorlage auszugeben, ist das Einfügen des folgenden Codes in das HTML-Eingabefeld.



ASSET1

ASSET2

ASSET3



Hier können mit HMTL, CSS und Smarty die Assets beliebig eingebunden werden.

Templatevorlagen erstellen

Die Anordnung der Assets kann auch extern in einer Templatedatei abgelegt werden.
Legen Sie dazu eine Templatedatei templatebeispiel.tpl im Ordner \templates\kb_redspark\modules\cms\pagecontent an. Füllen Sie diese mit dem folgenden Code:



<h1></h1>

<div style="float: left; margin-left:10px;"></div>

<div></div>

<div class="clear">&nbsp;</div>



Diese bindet vorher Definiertes ins Template ein und formatiert Asset1 als Überschrift. Weiterhin werden das Bild (Asset2) und der Text (Asset3) mit einem Abstand von 10px nebeneinander ausgegeben.

Wenn die Datei angelegt ist, kann sie unter dem Reiter Seitenstruktur unter dem Dropdownfeld Templatevorlage ausgewählt werden. Wählen Sie dort den Eintrag templatebeispiel aus.

Speichern Sie die Seite ab und schauen Sie sich die Vorschau an.

CSS einbinden

Um ein CSS File einzubinden muss lediglich eine CSS-Datei in den Ordner \templates\kb_redspark\styles kopiert werden. Alle Dateien unterhalb dieses Ordners werden automatisch ins System eingebunden. Um alle CSS-Dateien besser zu strukturieren, sind auch Ordnerstrukturen unterhalb des Ordners möglich.

Alle Dateien werden zu einer CSS-Datei zusammengefasst und zur Performanceverbesserung statifiziert.

Javascript einbinden

Alle Javascriptdateien werden unter dem Ordner \templates\kb_redspark\javascript abgelegt.
Legen Sie eine Javascriptdatei an und speichern Sie diese in o.g. Ordner an.

Das Javascript muss dann noch eingebunden werden. Üblicherweise wird es über folgenden Code in das Headertemplate header.tpl unter templates\kb_redspark\modules\page einbunden.

{createlinkjs files='javascript.js'}

Kuborgh GmbH

Hamburg 040 819 773 770 Köln 0221 276 66 96 info@kuborgh.de www.kuborgh.de

RedSpark Community

RedSpark Community

Community Website
RedSpark Apps

RedSpark Apps

Zur Übersicht
RedSpark Download

RedSpark Basispaket

Zum Download
Key facts