Alle verwendeten Seitentemplates sind über das Projekt SMARTY Template Engine, im Zusammenspiel mit dem Bootstrap Design im Frontend, realisiert.
Das bedeutet einfache und zuverlässige Trennung von Layout und Inhalt. Die Templatestrukur ist modern über Bootstrap aufgebaut.
In der Regel werden Sie in erster Linie nur Design-Anpassungen vornehmen wollen.
Nehmen Sie Design-Änderungen daher zunächst nur ausschliesslich an den .CSS-Dateien vor. Erst wenn die gewünschten Ergebnisse damit alleine nicht realisiert werden können, sollten Sie die .tpl Dateien beginnen einzeln zum Editieren in das Templateverzeichnis zu kopieren. Verwenden Sie dann jeweils den neuesten Templatestand, d.h. beispielsweise die Template "design_version2_01" (Aktueller Standard HTML5, Bootstrap).
Wenn Sie nur Farbänderungen / Grafikänderungen durchführen wollen, ist in der Regel eine Bearbeitung der .tpl Dateien nicht notwendig.
Nur Templates, deren Inhalt und Struktur Sie verändern wollen, müssen und sollten in den ".tpl" Dateien "angefasst" werden. Einfache Textänderungen können immer über die Sprachverwaltung oder das MINI-CMS vorgenommen werden. Viele inhaltliche Vorstellungen lassen Sie somit ohne Änderungen bereits so umsetzen und Sie erreichen auf diese Weise die höchste Kompatibilität bei kommenden Software updates!
Folgende Schritte haben sich beim Selbst-Design (nur möglich in Kauf-Version) bewährt:
- Stellen Sie in der Administration unter den Layout Einstellungen eine Grundfarbe ein
- Verbinden Sie sich mit einem FTP Programm an Ihren Account
- Gehen Sie in den Ordner www/templates/design_version2_01
- Editieren Sie die Datei im Ordner less/colorpicker.less
- Falls in den CSS-Dateien Grafiken verwendet werden, müssen diese auch in Ihr Template Verzeichnis mit übernommen werden. Hier gilt das Sie die Ordnerstuktur genauso beibehalten.
- An das Ende der Datei können Sie ihre Änderungen als CSS oder als LESS einfügen.
- Speichern Sie in der Administration die Layout Einstellungen ab, damit wird eine neue Datei colorpicker.css generiert.
Nur wenn Sie auch Änderungen an den Seiten Templates (.tpl) vornehmen möchten, kopieren Sie die Quelldatei im Ordner source/templates/_default_version2, beachten Sie jedoch, dass wir im Rahmen laufender Updates Änderungen und Ergänzungen an den Quelldateien vornehmen, welche Sie dann manuell in die kopierten Templates nachpflegen müssen.
Sollten Sie Wert auf korrekte Funktion Ihrer Software legen. Kopieren Sie daher nur die Templates, die Sie auch inhaltlich so wie strukturell wirklich verändern müssen.
Wichtig: Wenn Sie Templates ändern, leeren Sie anschließend den Cache der Auktion! Das machen Sie über den Admin-Bereich unter TOOLS->Cache leeren. Dort Setzen Sie alle Häckchen und klicken auf Ausführen. Nun können Sie Ihre Änderungen live in Ihrer Auktion sehen.
Sehr Wichtig: Verwenden Sie zum Editieren aller Dateien auf keinen Fall den Windows eigenen Notetab Editor oder Microsoft Editor. Denn zum Einen bietet dieser kaum Komfort für Programmierer, aber viel wichtiger noch:
Er fügt - da nicht UTF-8 tauglich - an den Dateianfang das unsichtbare und so genannte "BOM Zeichen" ein.
(Siehe Erklärung zu ByteOrderMark)
Dieses führt dazu, dass beim Aufruf von Webseiten im Internet Explorer - vorwiegend der Version IE8 - es zu erheblichen Fehldarstellungen kommen kann! Und das bei augenscheinlich problemfreien HTML Code.
Dieses ist oft ausschliesslich der fehlerhaften Interpretation des ohnehin völlig vermurksten Internet Explorer Browsers in Kombination mit dem problematischen Windows Editor geschuldet.
Gute Text Editoren verstehen UTF-8. Als Beispiele für gute Editoren seien hier genannt:
Notepad++, UltraEdit, Dreamweaver, ua.
Wichtige Tipps zu Vorgehensweise
Einbinden von eigenen CSS Files (bei aktuellen Bootstrap-Templates)
Das es bei den Bootstrap Templates im ADMIN-Bereich möglich ist, die Hauptfarbe der Boxen über einen Colorpicker auszuwählen und beliebig zu ändern, wird das technisch so umgesetzt, dass beim Klicken des "Ausführen" Buttons im aktuell verwendeten Template (z.B. design_version2_01) im Unterordner "css" die Datei colorpicker.css mit den Einstellungen aus der Datei colorpicker.less aus dem Unterordner "less" überschrieben wird.
Es ist möglich LESS Code und auch CSS Code in die colorpicker.less einzufügen. Ein Compiler generiert dann aus dem Code eine CSS Datei. In der Doku zu Bootstrap sind die entsprechenden Variablen zu finden.
Eine andere Möglichkeit CSS einzufügen ist die Datei custom-static.css im Order css.
Zum Einbinden eigener CSS Styles tragen Sie diese in die Datei colorpicker.less im Unterordner "less" ein und drücken dann den "Ausführen" Button im ADMIN-Bereich bei den Layout-Einstellungen.
Einbinden von eigenen CSS Files (bei alten -nicht Bootstrap- Templates)
Wir trennen der Übersichtlichkeit halber die CSS Files in verschiedene Dateien auf. Im HTML Code wird jedoch eine zusammengefasste Datei aus Gründen der Seitengeschwindigkeit aufgerufen, die automatisch beim Cache leeren im Admin Bereich erzeugt wird.
Zum Einbinden eigener CSS Dateien legen Sie
in Ihrem "template/desingnname/css/" Verzeichnis einen Ordner "/custom/" an:
template/desingnname/css/custom/
Eigene CSS Dateien legen Sie dort ab. Der Parser wird Ihre individuelle CSS Datei beim Zusammenfassen berücksichtigen.