Farben und Schriften anpassen
Das Aussehen des Pixtacy-Shops wird, wie bei Webseiten üblich, über eine CSS-Datei (Cascading Stylesheets) gesteuert. Sie können diese Datei nach Belieben anpassen, um den Shop an Ihr bestehendes Websitedesign anzupassen und insbesondere Farben und Schriftarten zu ändern. Gehen Sie dazu folgendermaßen vor:
1. Wählen Sie das Farbschema aus, das Ihren Vorstellungen am nächsten kommt.
Pixtacy wird mit einigen fertigen CSS-Dateien geliefert, die Sie unter Einstellungen > Erscheinungsbild als „Farbschema“ festlegen können. Merken Sie sich den Namen des Farbschemas, das am ehesten mit dem gewünschten Design übereinstimmt.
2. Laden Sie die CSS-Datei des ausgewählten Farbschemas herunter.
Benutzen Sie Ihr FTP-Programm, um die CSS-Datei herunterzuladen, die zu dem ausgewählten Farbschema gehört. Wenn Sie zum Beispiel das Farbschema „white“ als Grundlage nutzen wollen, laden Sie die Datei templates/pixtacy/themes/white/style.css herunter.
3. Passen Sie die Datei style.css an Ihre Wünsche an.
Sie können die Datei mit einem beliebigen Texteditor öffnen und bearbeiten. Die Farbdefinitionen finden Sie in den Zeilen, die mit „color“ oder „background-color“ beginnen. Es handelt sich um RGB-Werte in hexadezimaler Schreibweise.
Um eine andere Schriftart festzulegen, fügen Sie eine Zeile wie die folgende in die Datei ein:
body {font-family: "Trebuchet MS", sans-serif;}
Hiermit würde die Schrift „Trebuchet MS“ als Pixtacy-Standardschrift festgelegt.
Weitere Informationen über den Umgang mit CSS-Dateien finden Sie in der Onlinedokumentation selfhtml.org.
4. Kopieren Sie die geänderte CSS-Datei auf den Server.
Um Konflikte bei künftigen Updates zu vermeiden, sollten Sie nicht einfach die CSS-Datei des ursprünglich gewählten Farbschemas überschreiben, sondern ein eigenes Farbschema für Ihre Anpassungen anlegen. Erstellen Sie dazu im Ordner templates/pixtacy/themes einfach einen neuen Unterordner und geben Sie diesem einen sprechenden Namen, zum Beispiel „meindesign" o. ä. Kopieren Sie die geänderte CSS-Datei dann in diesen Ordner.
5. Aktivieren Sie das neue Farbschema.
Melden Sie sich bei Ihrem Pixtacy-Shop als „master“ an, und rufen Sie dann die Seite „Einstellungen > Erscheinungsbild“ auf. Klicken Sie oben in der Modusleiste auf [Bearbeiten], wählen Sie das neu erstellte Farbschema aus, und klicken Sie auf [Speichern].
Ab sofort verwendet Pixtacy die neu erstellte CSS-Datei, um das Aussehen der Shopseiten festzulegen. Beachten Sie, dass Sie bei künftigen Updates den Ordner mit Ihrem Farbschema manuell in das neue templates/pixtacy-Verzeichnis kopieren müssen, damit Ihre Anpassungen erhalten bleiben.
Alternative Vorgehensweise [Update vom 21.09.2011]
Ein Nachteil der oben beschriebenen Vorgehensweise besteht darin, dass Sie beim Installieren von Pixtacy-Updates nicht vergessen dürfen, Ihr eigenes Farbschema in den ausgetauschten themes-Ordner zu kopieren. Dies lässt sich folgendermaßen vermeiden:
- wie oben
- wie oben
- wie oben
- Kopieren Sie die geänderte CSS-Datei ins Verzeichnis config.
- Tragen Sie unter „Einstellungen > Erscheinungsbild > Eigener HTML-Code“ die folgende Zeile ins Feld „Kopf“ ein:
<link rel="stylesheet" href="config/styles.css" type="text/css">
Ersetzen Sie dabei styles.css gegebenfalls durch den Namen, den Sie Ihrer Stylesheet-Datei gegeben haben.
Da das config-Verzeichnis bei Updates nicht angetastet wird, bleibt Ihre CSS-Datei dauerhaft erhalten, ohne dass Sie weitere Maßnahmen ergreifen müssen.
