Website erstellen und Hauptblöcke anpassen

So erstellen Sie einen Web Shop:

  1. Erstellen Sie ein Projekt im Kundenportal.
  2. Erstellen Sie eine Website.
  3. Konfigurieren Sie die wichtigsten Blöcke.
  4. Richten Sie die Warenkorbfunktion ein.
  5. Testen Sie die Website.
  6. Veröffentlichen Sie die Website.

Website erstellen

  1. Öffnen Sie Ihr Projekt im Kundenportal, und navigieren Sie zum Menüpunkt Storefronts > Websites.
  2. Klicken Sie auf Website erstellen.
  3. Wählen Sie die Vorlage Web Shop aus.
  4. Geben Sie eine URL an, die auf eine externe Plattform verweist, auf der Ihr Spiel verfügbar ist. So können Sie schnell eine Seite im Stil Ihres Spiels erstellen, da auf der neuen Seite Bilder und der Spieltitel, Informationen zum Entwickler und das Farbschema automatisch übernommen werden. Wenn Sie die Spieldaten nicht verwenden möchten, müssen Sie den Schalter Spielinfos aus Google-Play- oder App-Store-URL kopieren deaktivieren.

  1. Klicken Sie auf Web Shop erstellen.

Daraufhin öffnet sich der Website-Baukasten mit einer vorkonfigurierten Website für Ihr Spiel. Dort können Sie die nötigen Anpassungen vornehmen:

  • Passen Sie das Website-Theme an:
    • Farben der zentralen Elemente
    • Eckenradius von Elementen
    • Schriftarten für Überschriften und Fließtext
  • Bearbeiten Sie die Inhalte:
    • Bilder und Videos in Blöcke hochladen
    • die für Nutzer sichtbaren Texte ändern

Sie können auch weitere Seiten für die Website erstellen und konfigurieren. Beispielsweise können Sie so einen Bereich für Neuigkeiten, einen Shop mit verschiedenen Bundles oder einen Blog einrichten.

Wichtige Blöcke konfigurieren

Alle Blöcke enthalten Standardeinstellungen. Sie können bestimmte Blockfunktionen aktivieren oder deaktivieren und nach Belieben anpassen.

Header-Block einrichten

Der Block im Header der Website. Im Header werden Benutzerinformationen angezeigt, außerdem enthält er Elemente für Navigation auf der Website. Sie können den Block fixieren, so dass er jederzeit auf dem Bildschirm sichtbar bleibt, wenn man durch die Website scrollt.

Hinweis
Wenn Sie bei der Erstellung der Website einen Link zu Google Play oder dem App Store angegeben haben, wird der Header-Block automatisch konfiguriert.

Aufmacher-Block einrichten

Block mit grundlegenden Informationen über Ihren Web Shop, das Spiel, für das die Website erstellt wurde, und den Entwickler. Wenn Sie bei der Erstellung der Website keinen Link zu Google Play oder dem App Store angegeben haben, sollten Sie die folgenden Elemente des Aufmacher-Blocks im Hauptteil des Editors konfigurieren:

  1. Fügen Sie das Spiel-Icon hinzu.
  2. Geben Sie den Spielnamen an.
  3. Geben Sie den Spieleentwickler an.
Passen Sie den Block bei Bedarf an:
  1. Fügen Sie ein Hintergrundbild hinzu.
  2. Ergänzen Sie die Karten um Informationen, indem Sie die folgenden Schalter auf Ein stellen:
    • Infokarten
    • Karten-Icons
    • Kartenüberschriften
    • Kartenbeschreibungen

Block "Fast Login" einrichten

Im Block Fast Login können Sie den Autorisierungsschritt hervorheben und den Kaufvorgang für den Nutzer vereinfachen.

Um den Block Fast Login zu verwenden, müssen Sie zunächst in den Login-Einstellungen eine Autorisierungsmethode auswählen. Das Erscheinungsbild und das Verhalten des Blocks sind abhängig von der gewählten Authentifizierungsmethode.

Der Block Fast Login wird automatisch auf den Websites platziert, die mit der Vorlage Web Shop erstellt wurden.

Sollte auf Ihrer Website ein solcher Block fehlen, können Sie ihn manuell in Site Builder hinzufügen.

So fügen Sie den Block Fast Login hinzu:

  1. Öffnen Sie das Projekt im Kundenportal, und navigieren Sie zum Menüpunkt Storefronts > Websites.
  2. Wählen Sie im Abschnitt Seiten die gewünschte Website aus, und klicken Sie auf Site Builder öffnen.
  3. Klicken Sie auf Block hinzufügen.
  4. Wählen Sie die Option Fast Login.

Online-Shop-Block einrichten

Block für den Verkauf von virtuellen Gegenständen, Bundles und virtuellen Währungspaketen. Dieser Block enthält automatisch erstellte Abschnitte, die Sie löschen und durch neue Abschnitte ersetzen können.

  1. Passen Sie den Block bei Bedarf an:
    • Geben Sie eine Überschrift an.
    • Aktivieren Sie die Anzeige von Artikelgruppennamen.
    • Aktivieren Sie Registerkarten für eine einfache Navigation im Store.
    • Fügen Sie einen benutzerdefinierten Hintergrund hinzu.
    • Konfigurieren Sie die Call-to-Action-Schaltfläche für die Anmeldung.

  1. Wählen Sie im Online-Shop-Abschnitt in der Drop-down-Liste den auf der Website zu verkaufenden Artikeltyp und dessen Gruppe aus.

Achtung
Falls erstellte oder importierte Artikel und virtuelle Währungen nicht in Site Builder angezeigt werden, sollten Sie prüfen, ob die erstellten Artikel-/Gegenstandsgruppen und Pakete aktiviert sind und ob die Artikel der erstellten Gruppen zugewiesen sind. Artikel, die im Kundenportal erstellt wurden, können Sie unter Artikelkatalog betrachten und einrichten.

  1. Entscheiden Sie sich im "Online-Shop"-Block für ein Artikelkarten-Layout:

    • Empfohlen: Mit diesem Kartenlayout können Sie die Aufmerksamkeit der Nutzer auf Artikel oder Sonderangebote lenken. Wir empfehlen, dieses Layout für Boni- und Rabattaktionen, für zeitlich und zahlenmäßig begrenzte Werbeaktionen und Artikel sowie für Bundles zu verwenden.
      Unter "Artikelkarten-Layout" können Sie folgende Einstellungen vornehmen:
      • Artikelbild und ‑beschreibung ein- oder ausblenden
      • Artikelbild als "Eingepasst" oder "Vollbild" darstellen
      • Textfarbe ändern
      • eigenen Hintergrund für das Karussell festlegen
  • Horizontal: Bei diesem Kartenlayout werden der Name, die Beschreibung und der Preis des Artikels rechts neben dem Bild platziert.
    Unter "Artikelkarten-Layout" können Sie folgende Einstellungen vornehmen:
    • Artikelbild und ‑beschreibung ein- oder ausblenden
    • Artikelbild und ‑beschreibung ein- oder ausblenden
    • horizontales Scrollen auf Mobilgeräten aktivieren oder deaktivieren
    • eigenen Hintergrund für den Abschnitt festlegen
  • Vertikal: Bei diesem Kartenlayout werden der Name, die Beschreibung und der Preis des Artikels unter dem Bild platziert.
    Unter "Artikelkarten-Layout" können Sie folgende Einstellungen vornehmen:
    • Artikelbild und ‑beschreibung ein- oder ausblenden
    • Artikelbild als "Eingepasst" oder "Vollbild" darstellen
    • horizontales Scrollen auf Mobilgeräten aktivieren oder deaktivieren
    • eigenen Hintergrund für den Abschnitt festlegen
  • Groß: Wir empfehlen, dieses Kartenlayout für Bundles und Boni zu verwenden. Hierbei werden alle relevanten Informationen der Karte angezeigt, ohne darauf klicken zu müssen.
    Unter "Artikelkarten-Layout" können Sie folgende Einstellungen vornehmen:
    • Artikelbild und ‑beschreibung ein- oder ausblenden
    • Artikelbild als "Eingepasst" oder "Vollbild" darstellen
    • horizontales Scrollen auf Mobilgeräten aktivieren oder deaktivieren
    • eigenen Hintergrund für den Abschnitt festlegen
Hinweis
Für Bundles stehen nur die Layouts Vertikal, Groß und Empfohlen zur Auswahl.
  1. Passen Sie bei Bedarf das Kartenlayout an, indem Sie in den Kartenlayout-Einstellungen die entsprechenden Schalter aktivieren.

  1. Sie können leere Abschnitte ausblenden, indem Sie den entsprechenden Schalter auf Ein stellen.

Hinweis
Wenn Sie bei der Erstellung der Website einen Link zu Google Play oder dem App Store angegeben haben, wird der Footer-Block automatisch konfiguriert.
So passen Sie den Block bei Bedarf an:
  1. Wählen Sie den Layout-Stil aus.
  2. Passen Sie den Hintergrund an.
  3. Fügen Sie die Teilen-Schaltflächen hinzu, und konfigurieren Sie die Social-Media-Symbole.
  4. Fügen Sie die Links zu den sozialen Netzwerken hinzu.
  5. Legen Sie eine Altersbeschränkung fest.

Warenkorbfunktion einrichten

So aktivieren Sie die Warenkorbfunktion für die Website:

  1. Klicken Sie im Baukasten rechts in der Seitenleiste auf den Menüpunkt Warenkorbeinstellungen.
  2. Aktivieren Sie den Schalter Warenkorb verwenden.
  3. Konfigurieren Sie weitere Warenkorbfunktionen (optional). Aktivieren Sie dazu die entsprechenden Schalter:
    • Promocode-Feld einblenden – ermöglicht es Nutzern, einen Promocode oder Gutschein auf der Benutzeroberfläche einzulösen
    • Anmeldepflicht vor Warenkorbnutzung – öffnet das Authentifizierungsfenster beim Aufruf des Warenkorbs, sofern der Nutzer zuvor nicht angemeldet war
War dieser Artikel hilfreich?
Vielen Dank!
Gibt es etwas, das wir verbessern können? Nachricht
Das tut uns leid
Bitte erläutern Sie, weshalb dieser Artikel nicht hilfreich ist. Nachricht
Vielen Dank für Ihr Feedback!
Wir werden Ihr Feedback aufgreifen und dazu nutzen, Ihr Erlebnis verbessern.

Weitere Informationen

Letztmalig aktualisiert: 24. November 2025

Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.

Problem melden
Wir überprüfen unsere Inhalte ständig. Ihr Feedback hilft uns, sie zu verbessern.
Geben Sie eine E-Mail-Adresse an, damit wir Sie erreichen können
Vielen Dank für Ihr Feedback!
Ihr Feedback konnte nicht gesendet werden
Versuchen Sie es später erneut oder kontaktieren Sie uns unter doc_feedback@xsolla.com.