Kompatibilität

WebSite X5 Pro

Ein Onlineshop zu erstellen, vor allem wenn eine große Anzahl von Produkten verwaltet werden muss, kann eine anspruchsvolle Aufgabe sein. Um Zeit zu sparen und gleichzeitig optimierte Verkaufsseiten zu erhalten, erstellt WebSite X5 automatisch sowohl Präsentationsboxen für Produkte als auch vollständige Produktseiten, die alle erforderlichen Informationen enthalten.


In dieser Anleitung konzentrieren wir uns auf die Boxen: Wir schauen, wann sie verwendet werden, wie sie erstellt werden und wie man deren Komposition und Grafikstil anpassen kann.


Was sind Produktboxen

Eine Box ist nichts anderes als ein Bereich, in dem einige grundlegende Informationen zu einem Produkt zusammengefasst sind und das in den meisten Fällen eine Schaltfläche für den Kauf enthält. Sie sind das Äquivalent einer Visitenkarte, und eine Webseite kann viele davon enthalten.



Sie dienen dazu, die Produkte den Kunden synthetisch vorzustellen, sodass sie sich auf diese Weise ein Bild davon machen können, was für sie von Interesse sein könnte, und dann entscheiden, auf welche Vorschläge sie ihre Aufmerksamkeit richten möchten.

Wann werden sie erstellt

Wie bereits erwähnt, werden die Produktkarten automatisch vom Software erstellt, wenn Folgendes verwendet wird:

  • Das Objekt Produktkatalog, um eine Auswahlt der Prdodukte Ihres Katalogs auf einer Seite zu präsentieren;
  • Die Suchseite der Produkte, mit der die Kunden Ihren Produktkatalog mit Kategorien und Filtern durchsuchen können;
  • Die Seite Wuschliste, mit der die Kunden die gewünschten Projekte in einer persönliche Wünschliste speichern und in einem späteren Zeipunkt kaufen können

In allen diesen Fällen werden die Produkte mit entsprechenden Boxen angezeigt.


Wie sehen sie aus

Die boxen bestehen aus den folgenden Elementen: 

  • Hintergrund: Ein farbiger oder transparenter Hintergrund, zu dem ein Rahmen gezeichnet werden kann.
  • Titelbild: Das Bild des Produkts
  • Inhalt: Der Textbereich der Box. Beinhaltet alle folgenden Elemente:
    • Titel
    • Beschreibung
    • Details
    • Preis
    • Schalfläche "Zum Warenkorb"
    • Schalfläche "Zur Wunschliste"


Selbstverständlich können Sie die Zusammensetzung der Boxen ändern und festlegen, dass ein oder mehrere dieser Elemente nicht in den Boxen enthalten sind:

  • Öffnen Sie das Einstellungsfenster (dazu können Sie das eingefügte Objekt Produktkatalog, die Suchseite oder die Seite Wunschliste auswählen und in allen Fällen auf die Schaltfläche Bearbeiten klicken) und gehen Sie in den Abschnitt Einstellungen.
  • Verwenden Sie das Dropdown-Menü unter Box-Stil, um das Element auszuwählen, auf das Sie einwirken möchten.
  • Klicken Sie, um das Häkchen neben der Option Sichtbar zu setzen oder zu entfernen, um festzulegen, ob das betreffende Element in den Boxen enthalten sein soll oder nicht.
  • Im spezifischen Fall der Details können Sie genau festlegen, welche Informationen in den Boxen angezeigt werden sollen.


#Tipp - Auch wenn die Boxen für den E-Commerce gedacht sind, können Sie festlegen, dass sie keine Preisangabe oder die Schaltfläche Kaufen enthalten. So können Sie die Boxen verwenden, um Ihre Produkte nur anzuzeigen, ohne sie zum Verkauf anzubieten.


Welche Informationen zeigen sie

Um die Boxen zu erstellen, verwendet WebSite X5 hauptsächlich die Informationen, die über das Fenster Produkteinstellungen eingegeben werden, auf das Sie zugreifen, wenn Sie ein neues Katalogprodukt hinzufügen oder ein bestehendes Produkt ändern (Schritt 1 - Einstellungen > Onlineshop > Produkte).


Genauer gesagt werden in der Box folgende Elemente übernommen:

  • als Coverbild das erste Bild, das im Bereich Bild eingefügt wird;
  • als Titel den Namen, den Sie dem Produkt im Bereich Allgemein geben;
  • als Beschreibung die kurze Beschreibung, die ebenfalls im Bereich Allgemein eingegeben wird;
  • für die Details: Die Kategorie ist die, in der das Produkt ggf. im Katalog eingeordnet ist; die Varianten werden aus dem Bereich Optionen übernommen; die Verfügbarkeit übernimmt die im Bereich Verfügbarkeit eingestellten Optionen;
  • als Preis denjenigen, der im Bereich Allgemein angegeben ist.


Natürlich, wenn eine Information nicht über das Fenster Produkteinstellungen angegeben wird, wird sie nicht in die Box eingefügt.


Wie passen Sie sie an

Wie bereits erwähnt, werden die Boxen von WebSite X5 automatisch erstellt, indem die Informationen verwendet werden, die für die Produkte eingegeben wurden. Standardmäßig wird das Aussehen der Boxen durch das für die Website gewählte Template bestimmt, aber Sie können es anpassen. 

  • Öffnen Sie das Einstellungsfenster (dazu können Sie das eingefügte Objekt Produktkatalog, die Suchseite oder die Seite Wunschliste auswählen und in allen Fällen auf die Schaltfläche Bearbeiten klicken) und gehen Sie in den Abschnitt Einstellungen.
  • Beginnen Sie damit, festzulegen, wie die Boxen auf der Seite angeordnet werden sollen. Verwenden Sie die Option Anordnung, um auszuwählen zwischen:
    • Feste Höhe: Die Boxen werden in einem Raster angeordnet. Da alle Boxen die gleiche Höhe haben, ist das Raster regelmäßig und kompakt.
    • Variable Höhe: Die Boxen werden weiterhin im Raster angeordnet, aber die Höhe jeder einzelnen Box variiert je nach den Proportionen des Bildes, das als Titelbild verwendet wird. Die Boxen füllen daher möglicherweise nicht vollständig die Zellen des Rasters, in dem sie sich befinden: Dadurch kann zwischen den Boxen Leerraum entstehen. Diese Anordnung ist besonders geeignet, wenn Sie eine einzelne Box pro Zeile anzeigen oder eine Ansicht in einer einzigen Zeile mit mehreren Spalten vorsehen möchten.
    • Masonry: Auch hier variiert die Höhe der Boxen je nach den Proportionen des Titelbildes. Der Unterschied zur vorherigen Anordnung besteht darin, dass die Boxen nicht in einem regulären Raster angeordnet sind, sondern in mehreren Reihen und Spalten ausgerichtet sind, ohne Lücken zu lassen, um die kleineren Abmessungen einiger Boxen auszugleichen.
    • SlideShow: (nur für das Objekt Produktkatalog verfügbar) Die Boxen haben die gleiche Höhe und werden in einer einzigen Zeile in einer Diashow mit Navigationstasten angezeigt.
  • Nun können Sie festlegen, wie die verschiedenen Elemente innerhalb der Boxen formatiert werden sollen. Verwenden Sie die Option Inhalte, um auszuwählen zwischen:
    • Coverbild links, Titel und Inhalte rechts
    • Titel und Inhalte links, Coverbild rechts
    • Coverbild oben, Titel und Inhalte unten
    • Titel und Inhalte oben, Coverbild und Inhalte unten
    • Coverbild als Hintergrund
  • Allgemein können Sie auch die Anzahl der Boxen pro Zeile und die maximale Anzahl der Zeilen pro Seite festlegen. Wenn die vorgesehene Anzahl an Produkten überschritten wird, wird eine Paginierung eingeführt.
  • Falls gewünscht, ändern Sie die Höhe der Boxen. Beachten Sie, dass in Abhängigkeit von diesem Parameter die Titelbilder der Produkte neu skaliert werden. Für die Texte hingegen wird, wenn sie zu lang sind, die Bildlaufleiste angezeigt.
  • Um das Erscheinungsbild der Seite zu verbessern, können Sie auch die Abstände zwischen den Boxen anpassen.
  • Schließlich können Sie die Elemente, aus denen die Boxen bestehen, bearbeiten: Verwenden Sie das Menü unter Box-Stil, um das Element auszuwählen, auf das Sie einwirken möchten. Abhängig vom ausgewählten Element können Sie verschiedene Optionen verwenden, wie Farbe, Schriftart, Abstände und Effekte.


Wie aktivieren Sie die Schleifen für die Boxen

Wenn Sie neue oder rabattierte Produkte haben, können Sie diese hervorheben, indem Sie ein Band auf deren Boxen platzieren.


Zunächst müssen Sie bereits festgelegt haben, welche Produkte neu oder rabattiert sind:

  • Beim Erstellen des Katalogs (im Schritt 1 - Einstellungen >Onlinshop > Produkte) erstellen Sie ein neues Produkt oder ändern ein bestehendes Produkt, um auf das Fenster Produkteinstellungen zuzugreifen.
  • Damit ein Produkt als "neu" gilt: Bleiben Sie im Bereich Allgemein und aktivieren Sie die Option Produkt als "Neuheit" hervorheben.
  • Damit ein Produkt als "reduziert" gilt: Gehen Sie in den Bereich Rabatt und wenden Sie einen festen oder prozentualen Rabatt an (So konfigurieren Sie einen Rabatt auf ein einzelnes Produkt).


Sobald die Produkte eingerichtet sind, können Sie zur Bearbeitung der Boxen zurückkehren:

  • Öffnen Sie das Einstellungsfenster (dazu können Sie das eingefügte Objekt Produktkatalog, die Suchseite oder die Seite Wunschliste auswählen und in allen Fällen auf die Schaltfläche Bearbeiten klicken) und gehen Sie in den Abschnitt Einstellungen.
  • Im Abschnitt Schleifen wählen Sie den Schleifen-Typ, den Sie anwenden möchten: Neues Produkt oder Rabattiertes Produkt.
  • Wählen Sie das Bild aus, das Ihnen am besten dagefällt: Sie können eines der vorgeschlagenen verwenden oder die gewünschte Bilddatei importieren.
  • Schließlich definieren Sie die Ausrichtung und Breite der Kokarde relativ zur Box.


Wie verwalten Sie die vorhandenen Links

Die Boxen sind darauf ausgelegt, die wesentlichen Informationen zu den Produkten anzubieten und den Kunden die Kaufvorgänge zu erleichtern. Sie können daher verschiedene Links enthalten. Hier ist, wie Sie sie verwalten können:

  • Schaltfläche "Zum Warenkorb": Dies ist eines der Elemente, die die Boxen bilden. Wie wir gesehen haben, können Sie es aus der Liste der Elemente auswählen und über die verfügbaren Optionen entscheiden, ob Sie es beibehalten oder nicht (über die Option Sichtbar) und es grafisch anpassen. Sie können auch festlegen, dass das Produkt beim Klicken direkt zu den bestellten Produkten hinzugefügt wird, ohne vorher zur Warenkorbseite zu gelangen (über die Option Das Produkt ohne Anzeige in den Warenkorb legen).
  • Schaltfläche "Zur Wunschliste": Diese ist ähnlich der Schaltfläche "Zum Warenkorb". Auch hier können Sie entscheiden, ob Sie sie innerhalb der Boxen haben möchten (wiederum über die Option Sichtbar), ihre Farbe einstellen und die Option Das Produkt in den Warenkorb legen, ohne die Wunschliste anzuzeigen nutzen.
  • Link zur Bildgalerie: Bilder sind wichtig, um den Kunden zu ermöglichen, ein Produkt zu bewerten. Wenn Sie ein Produkt hinzufügen (im Schritt 1 - Einstellungen > Onlineshop > Produkt > Produkteinstellungen > Bild), können Sie alle Bilder importieren, die Sie möchten: Das erste wird direkt in der Box angezeigt; alle anderen werden verwendet, um eine Galerie zu erstellen. Wenn Sie die Option ShowBox-Link über Bild aktivieren im Einstellungsfenster aktivieren, wird beim Überfahren des Bildes in der Box ein Button mit einem Lupen-Symbol eingeblendet: Durch Klicken auf diesen Button können die Kunden die Galerie mit allen für das Produkt vorgesehenen Bildern anzeigen.
  • Link zur Produktseite: Die Box kann eine hervorragende Möglichkeit sein, bei den Kunden das Verlangen zu wecken, mehr über die Produkte zu erfahren. Wenn Sie die Erstellung der Produktseiten festlegen (im Schritt 1 - Einstellungen >Onlineshop > Produkt > Produkteinstellungen > Details), wird beim Überfahren des Bildes in der Box ein Button mit einem Tab-Symbol angezeigt: Durch Klicken auf diesen Button können die Kunden die detaillierte Produktseite einsehen. In jedem Fall ist der Link zur Produktdetailseite auch im Titel der Box aktiv.