Sie können die integrierte Funktion „Benutzerdefiniertes CSS“ verwenden, um das Erscheinungsbild der Demo-Leiste so zu ändern, dass sie als vollständige Seite oder als Pop-up-Nachricht angezeigt werden kann. Dadurch wird eine Ebene über Ihrem bestehenden Template hinzugefügt, anstatt einer Leiste oben auf der Webseite.

Dies ist ein anderer Vorgang als die Deaktivierung Ihres eCom-Shops.

Unser Supportteam kann Ihnen mit der hier beschriebenen festen Lösung behilflich sein, aber das Bearbeiten des CSS kann Probleme verursachen, die für weitere Anpassungen die Unterstützung von Drittanbietern erfordern.

Das Standarddesign der Demo-Leiste ist ein grauer Balken, der oben auf Ihrer Webseite erscheint:

Mit diesen Anweisungen ändern Sie die Demo-Leiste auf Ihrer Webseite in eine blaue Vollbild-Meldung:

Hinzufügen des benutzerdefinierten CSS

Sie können die Darstellung der Demo-Leiste auf Ihrer Website ändern. Befolgen Sie hierzu diese Anweisungen:

1. Klicken Sie in Ihrem eCom-Backoffice in der linken Seitenleiste auf Design.
2. Klicken Sie rechts auf dem Bildschirm auf Erweiterte Einstellungen.
3. Klicken Sie oben rechts auf dem Bildschirm auf CSS anpassen.
4. Kopieren Sie den folgenden Code:
   

   .wsa-demobar {
     font-size: 2em !important;
     color: #333 !important;
     padding-top: 200px;
     height: 100% !important;
     width: 100% !important;
     position: fixed;
     top: 0;
     left: 0;
     z-index: 9999;
     background: #a7c7dc !important; /* Old browsers */
     background: -moz-linear-gradient(top, #a7c7dc 0%, #85b2d3 100%) !important; /* FF3.6-15 */
     background: -webkit-linear-gradient(top, #a7c7dc 0%,#85b2d3 100%) !important; /* Chrome10-25,Safari5.1-6 */
     background: linear-gradient(to bottom, #a7c7dc 0%,#85b2d3 100%) !important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   }
   .wsa-demobar a {
       display: none;
   }
   .wsa-demobar .close {
       display: none !important;
   }
   

5. Fügen Sie es in das Fenster Benutzerdefiniertes CSS ein.
6. Klicken Sie auf Speichern.

Übersetzen von Nachrichten

Sie können die Übersetzungsfunktion in Ihrem eCom-Shop verwenden, um die Anzeige von Nachrichten in verschiedenen Sprachen zu ändern. Dabei gilt eine Beschränkung auf 255 Zeichen pro Nachricht. Die folgenden Schritte erläutern, wie die Nachrichten Dieser Shop befindet sich im Aufbau und Eventuell können nicht alle Bestellungen eingehalten oder erfüllt werden übersetzt werden können. Bei Bedarf können jedoch dieselben Anweisungen für andere Übersetzungsschlüssel befolgt werden.

1. Klicken Sie in Ihrem eCom-Backoffice in der linken Seitenleiste auf Inhalt> Übersetzungen.
2. Wählen Sie aus der Liste die Übersetzungsschlüssel Dieser Shop befindet sich im Aufbau oder Eventuell können nicht alle Bestellungen eingehalten oder erfüllt werden aus.
   • Wenn sie nicht in der Liste sind, klicken Sie auf Übersetzung überschreiben, um nach ihnen zu suchen.
3. Geben Sie in den Feldern Zu überschreibende Übersetzung die Nachricht ein, mit der die einzelnen Übersetzungsschlüssel ersetzt werden sollen.
4. Klicken Sie auf Speichern.
5. Wiederholen Sie die Schritte aus Schritt 2 für den anderen Übersetzungsschlüssel.

Aktivieren der Demo-Leiste

Folgen Sie diesen Anweisungen, um die von Ihnen vorgenommenen Änderungen durch Aktivieren der Demo-Leiste sichtbar zu machen.

1. Klicken Sie in Ihrem eCom-Backoffice in der linken Seitenleiste auf Einstellungen.
2. Klicken Sie in den Allgemeinen Einstellungen auf Erweiterte Einstellungen.
3. Schalten Sie im Abschnitt SHOP den Schalter neben Demo-Leiste anzeigen an.

Anzeigen der Demo-Leistennachricht

Sie können Ihre Demo-Leiste als schwebende Nachricht auf Ihrer Website anzeigen, die Benutzer lesen und schließen können. Sie können den folgenden CSS-Code verwenden, um eine Nachricht anzuzeigen, indem Sie die Funktionsweise der Demo-Leiste anpassen.

Beispiel CSS-Code

Dieser CSS-Code kann auf Ihrer Website angewendet werden, damit die Demo-Leiste als Pop-up-Nachricht statt als Banner angezeigt wird.

1. Klicken Sie in Ihrem eCom-Backoffice in der linken Seitenleiste auf Design.
2. Klicken Sie rechts auf dem Bildschirm auf Erweiterte Einstellungen.
3. Klicken Sie oben rechts auf dem Bildschirm auf CSS anpassen.
4. Kopieren Sie den folgenden Code:
   

   
   /* eCom (C-Series) Demoleiste - Nachrichtanzeige erstellen ANFANG */
   div.wsa-demobar {
     top: auto !important;
     bottom: 100px;
     border-radius: 10px;
     padding: 10px;
     width: 20% !important;
     height: auto !important;
     position: fixed;
     font-size: 11px;
     text-shadow: 0px 0px 3px black !important;
     right: 30px;
     left: auto !important;
     background: #333333 !important;
     box-shadow: 5px 5px 5px hsla(231, 92%, 49%, 0.11) !important;
   }
   
   /* Wenn Sie den Link „Zurück zum Backoffice“ ausblenden möchten */
   .wsa-demobar a { display: none; }
   
   /* Wenn Sie die Demoleiste anzeigen möchten, ohne die Möglichkeit sie zu schließen */
   .wsa-demobar a.close { display: none !important; }
   /* eCom (C-Series) Demoleiste - Nachrichtanzeige erstellen ENDE */
   

5. Fügen Sie es in das Fenster Benutzerdefiniertes CSS ein.
6. Klicken Sie auf Speichern.

Testen Sie Ihre Änderungen.

Wie bei jeder Designänderung sollten Sie Ihre Änderungen immer testen, um festzustellen, ob Sie mit dem Endergebnis zufrieden sind. Sie können ein privates Browserfenster öffnen und auf die Homepage Ihres eCom-Shops gehen, um zu sehen, wie die Änderungen für Ihre Kunden aussehen.