Web Shop für Handyspiele erstellen
Web Shop ist eine Lösung, mit der Sie virtuelle Güter, virtuelle Währungen und Bundles über das Xsolla-Zahlungsportal und den Shop auf Ihrer eigenen Website verkaufen können. Den Nutzern stehen hierbei mehr als 700 Zahlungsmethoden zur Verfügung.
Auf der folgenden Seite wird beschrieben, wie man eine Website mit der “Web Shop”-Vorlage erstellt. Mehr Informationen über die Lösung und alle ihre Funktionen finden Sie in der Dokumentation.
So erstellen Sie einen Web Shop:
- Erstellen Sie ein Projekt im Kundenportal.
- Erstellen Sie eine Website.
- Konfigurieren Sie die wichtigsten Blöcke.Richten Sie die Warenkorbfunktion ein.
Website erstellen
- Öffnen Sie Ihr Projekt im Kundenportal.
- Klicken Sie in der Seitenleiste auf Site Builder.
- Klicken Sie auf Seite erstellen.
- Wählen sie die Web Shop-Vorlage aus.
- Geben Sie einen Link zu dem Spiel in Google Play oder im App Store an, damit die Shopoberfläche vorab konfiguriert wird (Logo, Hintergrundbild, Farben, Footer-Text). Wenn Sie keine Daten aus dem Spiel verwenden möchten, stellen Sie den Umschalter Spielinfos aus Google Play oder dem App Store verwenden auf Aus.
- Klicken Sie auf Erstellen.
- Wählen Sie:
- das globale Theme der Website,
- die Farbe der Hauptelemente,
- die Eckenrundung der Schaltflächen,
- Schriftarten für Überschriften und Hauptteil.
- Gehen Sie im Hauptteil des Baukastens wie folgt vor:
- Laden Sie Bilder und Videos in die Blöcke hoch.
- Bearbeiten Sie die für die Benutzer bestimmten Texte.
![](https://cdn.xsolla.net/developers/v-20240906-v01/images//solutions/web-shop/create-site/builder.png)
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.- Stellen Sie die entsprechenden Schalter auf Ein:
- Anmeldeschaltfläche. Die Schaltfläche für die Benutzerauthentifizierung wird im Header der Website angezeigt.
- Fixieren. Diese Funktion ermöglicht es, dass der Header beim Scrollen sichtbar bleibt.
- Benutzerdefinierter Hintergrund. Der Header-Hintergrund ändert sich in einen benutzerdefinierten Hintergrund.
- Konfigurieren Sie die Schaltflächen in dem Block.
![](https://cdn.xsolla.net/developers/v-20240906-v01/images//solutions/web-shop/web-shop-create-site-2.png)
Aufmacher-Block
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:- Fügen Sie das Spiel-Icon hinzu.
- Geben Sie den Spielnamen an.
- Geben Sie den Spieleentwickler an.
- Fügen Sie ein Hintergrundbild hinzu.
- Ergänzen Sie die Karten um Informationen, indem Sie die folgenden Schalter auf Ein stellen:
- Infokarten
- Karten-Icons
- Kartenüberschriften
- Kartenbeschreibungen
![](https://cdn.xsolla.net/developers/v-20240906-v01/images//solutions/web-shop/lead_block.png)
Fast Login
Der Fast Login-Block bietet Nutzern eine Möglichkeit, sich auf der Website zu authentifizieren. Sie können den Block zusätzlich zur Anmeldeschaltfläche im Header oder anstelle davon verwenden. Das Erscheinungsbild und die Möglichkeiten des Blocks hängen von der gewählten Authentifizierungsmethode ab.- Stellen Sie den Schalter Anleitung auf Ein.
- Klicken Sie auf die Zeile, die am unteren Ende des Blocks erscheint.
- Ersetzen Sie den Text durch Ihre Anweisungen.
Passen Sie bei Bedarf den Block an, indem Sie:
- die Überschrift und die Beschreibung des Blocks anpassen,
- den Standardtext durch Ihren eigenen ersetzen.
So konfigurieren Sie den Block, wenn die Option “Benutzer-ID” als Authentifizierungsmethode ausgewählt ist:
- Passen Sie die Überschrift und die Beschreibung des Blocks an. Sie können außerdem den Standardtext durch Ihren eigenen ersetzen.
- Wenn Sie den Schalter Anleitung auf Ein stellen, werden Anweisungen angezeigt, wie man die die Benutzer-ID im Spiel findet.
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.
- Passen Sie den Block bei Bedarf an:
- Geben Sie eine Überschrift an.
- Aktivieren Sie die Anzeige von Produktgruppennamen.
- Aktivieren Sie Registerkarten für eine einfache Navigation im Shop.
- Fügen Sie einen benutzerdefinierten Hintergrund hinzu.
- Konfigurieren Sie die Call-to-Action-Schaltfläche für die Anmeldung.
- Wählen Sie im Online-Shop-Abschnitt in der Drop-down-Liste den auf der Website zu verkaufenden Artikeltyp und dessen Gruppe aus.
- Entscheiden Sie sich im "Online-Shop"-Block für ein Artikelkarten-Layout:
- Empfohlen: Mit diesem Kartenlayout können Sie die Aufmerksamkeit der Nutzer auf Produkte 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
- Empfohlen: Mit diesem Kartenlayout können Sie die Aufmerksamkeit der Nutzer auf Produkte 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.
- 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
![](https://cdn.xsolla.net/developers/v-20240906-v01/images//solutions/web-shop/create-site/vertical.png)
- 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
![](https://cdn.xsolla.net/developers/v-20240906-v01/images//solutions/web-shop/create-site/large.png)
- Passen Sie das Kartenlayout bei Bedarf an, indem Sie in den Kartenlayout-Einstellungen die entsprechenden Schalter auf Ein stellen.
- Sie können leere Abschnitte ausblenden, indem Sie den entsprechenden Schalter auf Ein stellen.
Footer-Block einrichten
- Wählen Sie den Layout-Stil aus.
- Passen Sie den Hintergrund an.
- Fügen Sie die Teilen-Schaltflächen hinzu, und konfigurieren Sie die Social-Media-Symbole.
- Fügen Sie die Links zu den sozialen Netzwerken hinzu.
- Legen Sie eine Altersbeschränkung fest.
Warenkorbfunktion einrichten
So aktivieren Sie die Warenkorbfunktion für die Website:- Klicken Sie im Baukasten rechts in der Seitenleiste auf den Menüpunkt Warenkorbeinstellungen.
- Stellen Sie den Schalter Warenkorb verwenden auf Ein.
- Konfigurieren Sie weitere Warenkorbfunktionen (optional). Stellen Sie dazu einfach die entsprechenden Schalter auf Ein:
- Promocode-Feld einblenden – ermöglicht es den Nutzern, einen Promo- oder Gutscheincode auf der Benutzeroberfläche einzugeben;
- Anmeldepflicht vor Warenkorbnutzung – öffnet das Authentifizierungsfenster, wenn ein noch nicht angemeldeter Nutzer den Warenkorb verwenden möchten.
![](https://cdn.xsolla.net/developers/v-20240906-v01/images//solutions/web-shop/create-site/cart.png)
Nützliche Links
- Web Shop: Integrationsleitfaden
- Alle Blöcke im Site Builder
War dieser Artikel hilfreich?
Diese Seite bewerten
Jetzt nicht
Vielen Dank für Ihr Feedback!
Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.