Nutzung des Konfigurators

Vorwort

In diesem Tutorial lernst du den Konfigurator kennen. Mit ihm richtest du deine Webseite designtechnisch schnell und komfortabel ein. Du kannst damit u. a. Farben anpassen, Header und Footer bearbeiten, dein Logo und Favicon ändern sowie eine Bilderslideshow einfügen.

Hinweis:
Jedes Shoptemplate hat seinen eigenen Konfigurator, da vorgenommene Konfigurationen nicht auf andere Shoptemplates übernommen werden.

Um den Konfigurator zu öffnen, gehe in die App Webseitenbereiche und öffne die Webseite, die du bearbeiten möchtest. Klicke anschließend auf den Reiter „Konfigurator“:

Logos

Im Menüpunkt „Logos“ lädst du dein Logo, dein Logoicon sowie dein Favicon hoch. Außerdem kannst du hier die Logos für Zahlungs- und Versandarten anpassen:

Logos hochladen / tauschen

Das Logo wird auf deiner Webseite immer direkt unter dem Header angezeigt. Das Favicon erscheint als kleines Symbol in den Browser-Tabs. Das Logoicon kann bei Bedarf ebenfalls hochgeladen werden – dieses kann per URL-Pfad an einer anderen Stelle der Webseite angezeigt werden.

Zahl-/Versandartlogos

Die Logos für Zahlungs- und Versandarten sowie deren Bezeichnungen werden im Footer deiner Webseite dargestellt. Bei Bedarf kannst du ein Logo jederzeit durch einen neuen Upload austauschen.

Möchtest du eine Zahlungs- oder Versandart entfernen, lösche einfach den entsprechenden Titel und speichere deine Änderungen. Wenn du eine weitere Zahlungs- oder Versandart hinzufügen willst, klicke unten auf „weitere Zeile hinzufügen“.

Menüpunkt / Navigation

Im Bereich „Menüpunkt / Navigation“ legst du fest, welche Seite als Startseite dient und welche Bereiche im Footer angezeigt werden:

Navigation

Unter „Navigation“ ist standardmäßig die ID der Startseite (ID 1) hinterlegt. Du kannst bei Bedarf eine andere Startseite definieren, indem du einfach die entsprechende Seiten-ID einträgst.

Die ID einer Seite findest du zum Beispiel in der Seitenverwaltung, wenn du mit der Maus über die Seite fährst (siehe linker Screenshot).
Alternativ kannst du den Designer öffnen – dort wird die Seiten-ID oben angezeigt (siehe rechter Screenshot).

Footer

Unter „Footer“ bestimmst du, welche Bereiche im Footer ausgegeben werden. Die Bereiche „Support / Hotline“ sowie „Versand & Zahlung“ werden grundsätzlich immer angezeigt.
Für den Anfang solltest du – wie im letzten Screenshot gezeigt – zusätzlich die Bereiche „Informationen“ und „Service“ einblenden.
Der Bereich "Informationen" enthält außerdem die rechtlichen Hinweise wie AGB, Impressum, Datenschutzerklärung usw.

Template-Plugins

In diesem Bereich konfigurierst du die Topbar und – wenn die App Bilderserie installiert ist – eine Slideshow:

Header Textzeilen (Topbar)

Hier legst du fest, welche Textzeilen zusammen mit welchen Icons in der Topbar angezeigt werden sollen. Alternativ kannst du die Topbar auch vollständig deaktivieren.

Um eine Textzeile zu entfernen, lösche den Text und speichere die Änderung.

Möchtest du eine neue Textzeile hinzufügen, klicke auf „weitere Zeile hinzufügen“, trage den gewünschten Text ein und speichere. Anschließend kannst du ein Icon auswählen und erneut speichern. Ein eigenes Icon hochzuladen ist nicht möglich.

Slideshow (Startseite)

Dieser Bereich wird nur angezeigt, wenn die App Bilderserie installiert ist:

Im Dropdown-Menü „Ausgabe“ wählst du aus, welche Bilderserie auf der Startseite angezeigt werden soll.
Die Bilderserien erstellst du in der App Bilderserie. Mehr dazu hier: Erstellung von Bilderserien für den Onlineshop oder Webseite

Wenn die Option „Nur Bild-Verlinkung“ aktiviert ist, öffnet sich beim Klick auf ein Bild der hinterlegte Link. Die Option „Bild- und Button-Verlinkung“ überschreibt diese Einstellung und stellt zusätzlich einen Button unten rechts mit einer Verlinkung bereit.

Die Bild-Links sowie der Button-Text werden direkt in der App Bilderserie beim jeweiligen Bild festgelegt.

Zusätzlich kannst du den Auto-Slider aktivieren und die Geschwindigkeit des automatischen Wechsels in Millisekunden definieren.

Farben

Hier legst du die Farben von Elementen und Schrift fest.

Über den Farbbutton kannst du eine Farbe per Mausklick auswählen. Alternativ trägst du den Hex-Farbcode direkt in das Textfeld ein.

Möchtest du die Farben von Elementen, die hier nicht aufgelistet, anpassen sowie Schriftart oder die Schriftgröße, ist dies direkt im HTML-Code des Shoptemplates erforderlich.
Shoptemplates bearbeitest du in der App Templates (Grund-App).

Mehr Details dazu findest du hier: Arbeiten mit den Webseiten-Template Tools

Produktkategorien

Wenn du diesen Menüpunkt öffnest, gelangst du direkt zu den Artikelkategorien-Einstellungen der App tricoma Shopsystem.

Mehr Details zu diesen Einstellungen findest du hier: Einrichtungstutorial: tricoma Shopsystem

Themes

Hier wählst du das gewünschte Theme für dein Shoptemplate aus. Jedes Theme ordnet die Elemente unterschiedlich an und stellt sie optisch leicht verschieden dar.

Aktuell (Stand 01/26) stehen folgende Themes zur Auswahl:

• Standard
• Flat
• Universe_4.1
• Advanced

Verwendest du das Shoptemplate 1_shop_universe_4.1_barrierefrei oder eine Kopie davon, solltest du das Theme „Standard“ auswählen. Aktuell stellt nur dieses Theme den Shop barrierefrei dar (Stand 01/26).