Konfigurieren von Design und Inhalt für die Instant Site

Facebook Tweet Pin LinkedIn Email

Instant Site ist eine kostenlose Website, die Sie mit Ihrem Shop-Konto erhalten. Diese hat einen eingebauten Online-Shop, wodurch Sie sofort mit dem Verkauf beginnen können.

Die Instant Site besteht aus anpassbaren Blöcken, mit denen Sie leicht eine attraktive und funktionale Website erstellen können. Sie können neue Blöcke aus der Bibliothek hinzufügen, Blöcke entfernen/ausblenden, die Sie nicht benötigen, und die Abschnitte in der gewünschten Reihenfolge anordnen. Sie können auch den Inhalt und das Design der Blöcke leicht ändern, um sie an Ihre Bedürfnisse anzupassen und Ihre Marke widerzuspiegeln. Die Website Ihres Online-Shops wird ein responsives Design besitzen, das auf PC, Tablet und Mobiltelefon gut aussieht.

Um den Inhalt und das Design Ihrer Instant Site zu bearbeiten, gehen Sie zu Übersicht → Starterseite verwalten in Ihrem Shop-Admin und klicken Sie auf die Schaltfläche Website bearbeiten.

Der Bearbeitungsmodus

Wenn Sie Ihre Instant Site zur Bearbeitung öffnen (Übersicht → Starterseite verwalten → Website bearbeiten oder Webseite → Website bearbeiten), sehen Sie die Liste der Seitenabschnitte, aus denen Ihre Instant Site derzeit besteht.

Alle diese Blöcke sind in der Instant Site-Vorschau auf der rechten Seite sichtbar, wo sie in der gleichen Reihenfolge erscheinen, in der sie in der Liste stehen.

Um Ihre Website im Web zu besuchen und zu sehen, wie sie auf einer separaten Registerkarte aussieht, klicken Sie oben im Editor auf die Adresse Ihrer Instant Site.

Blöcke hinzufügen

Wenn Sie zusätzliche Abschnitte für Ihre Website benötigen (z. B. einen „Sonderangebot“-Bereich, Blöcke mit Infos zur Lieferung/Zahlung oder einen extra „Über uns“-Block) oder den Standard-Block durch einen Block ersetzen möchten, der besser zu Ihrem Shop passt, können Sie einfach so viele neue Blöcke hinzufügen, wie Sie möchten.

Um einen Block zu Ihrer Instant Site hinzuzufügen:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf Block hinzufügen.
Klicken Sie auf der geöffneten Seite auf die Vorschau des Blocks, den Sie benötigen. Die Blöcke sind nach ihrem Thema gruppiert.
Sobald Sie auf den Block klicken, wird er zur Bearbeitung geöffnet und zu Ihrer Liste der Seitenabschnitte hinzugefügt, direkt vor dem Abschnitt der Fußzeile.

Sie können die Gestaltung und den Inhalt des Blocks beliebig anpassen und seine Position auf Ihrer Website ändern. Wenn Sie doppelte Blöcke haben (z. B. einen neuen Cover-Block mit einem Layout, das Ihnen mehr zusagt), können Sie jederzeit löschen, was Sie nicht mehr brauchen.

Blöcke bearbeiten

Ihre Website kann die Texte, Farben und Bilder haben, die Ihren geschäftlichen Anforderungen entsprechen. Sie können den Inhalt und die Gestaltung für jeden der Blöcke bearbeiten, die sich in der der Liste der Seitenabschnitte des Instant Site Editors befinden.

Um den Inhalt des Blocks zu bearbeiten:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf den Block.
Suchen Sie auf der Registerkarte Inhalt das Element, das Sie benötigen.
Nehmen Sie die notwendigen Änderungen vor (ändern Sie den Text, laden Sie ein neues Bild hoch, richten Sie Aktionslinks ein, usw.)

Voreingestellte Texte in den Blockvorlagen enthalten Tipps, was in die Felder zu schreiben ist.

Sie können Bilder im JPG-, PNG-, JPEG2000-, GIF-, WEBP- und TIFF-Format hochladen. Ihr Bild darf maximal 20 Megabyte gross sein.

Um die Gestaltung des Blocks zu bearbeiten:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf den Block.
Wechseln Sie auf die Registerkarte Gestaltung.
Nehmen Sie die notwendigen Änderungen vor (legen Sie das Blocklayout fest – es definiert die Positionen der Elemente im Verhältnis zueinander, ändern Sie Schriftart/Stil/Farbe für die Elemente dieses Blocks, richten Sie den Hintergrund ein, wählen Sie, welche Elemente angezeigt werden sollen, usw.)

Sie können jederzeit zu der zuvor gespeicherten Version Ihrer Website zurückkehren, indem Sie oben im Editor auf Meine Website → Änderungen verwerfen klicken. Für die Änderungen, die Sie auf der Registerkarte „Gestaltung“ des Blocks vorgenommen haben, können Sie weiter unten auch die Standard-Blockeinstellung wiederherstellen. Bitte beachten Sie, dass dieser Link die ursprünglichen Einstellungen der Designvorlage für diesen Block wiederherstellt.

Blöcke mit ungespeicherten Änderungen in der Liste Seitenblöcke werden mit einem blauen Punkt markiert.

Wenn Sie mit der Bearbeitung Ihrer Website fertig sind, klicken Sie auf Speichern & Veröffentlichen in der oberen rechten Ecke des Editors.

Ändern der Reihenfolge der Blöcke

Die Blöcke Ihrer Instant Site werden in der Reihenfolge angezeigt, in der sie unter Seitenblöcke im Instant-Site-Editor angezeigt werden (Übersicht → Starterseite verwalten → Website bearbeiten). Sie können die Reihenfolge der Blöcke nach Belieben anpassen. Ziehen Sie dazu einfach Ihre Instant Site-Abschnitte in die Liste und legen Sie sie dort ab.

Optional können Sie auch auf Einstellungen → Blöcke neu anordnen klicken, um Ihre Instant-Site-Abschnitte per Drag & Drop auf eine spezielle Seite zu ziehen.

Sie können die Reihenfolge aller Blöcke mit Ausnahme von Kopf- und Fußzeile ändern – diese sind immer der erste und der letzte Block Ihrer Website.

Blöcke löschen

Sie können einen Abschnitt aus der Liste Seitenblöcke löschen, wenn Sie ihn nicht auf Ihrer Instant Site benötigen. Wenn Sie zum Beispiel gerade erst Ihren Shop einrichten und noch keine Kundenreferenzen besitzen oder Ihr Shop saisonal ist, brauchen Sie unter Umständen den Shop-Block zunächst nicht.

Um einen Block von Ihrer Instant Site zu entfernen:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf den Block.
Scrollen Sie nach unten und klicken Sie auf Block löschen.

Wenn Sie diesen Block später auf Ihrer Website benötigen, können Sie jederzeit ähnliche Blöcke aus der Bibliothek hinzufügen.

Wenn Sie den Block Kundenmeinungen gelöscht haben und ihn wieder hinzufügen möchten, wählen Sie einen ähnlichen Block aus der Liste und ändern Sie ihn nach Ihren Wünschen. Sie können auf diese Weise auch zusätzliche Kundenmeinungen auf Ihrer Website anzeigen.

Sie können die Blöcke „Kopfzeile“ und „Fußzeile“ nicht löschen, aber es ist möglich, sie zu deaktivieren, so dass sie nicht auf der Website angezeigt werden. Klicken Sie dazu auf den entsprechenden Block im Editor, scrollen Sie dann nach unten und deaktivieren Sie Fußzeile anzeigen oder Kopfzeile anzeigen am unteren Rand. Sie können sie jederzeit später wieder aktivieren.

Hinzufügen des Navigationsmenüs

Das Navigations- oder Website-Menü ist eine Liste von Links, die auf Ihrer Website angezeigt wird.

Sie können ein Website-Menü erstellen, um den Kunden die Navigation zu erleichtern, damit diese finden, wonach sie suchen, während sie in Ihrem Shop stöbern. Das Navigationsmenü Ihrer Instant-Site wird für Desktop-Benutzer am oberen Rand. als horizontale Leiste mit Links angezeigt. Mobile Kunden sehen stattdessen das Hamburger-Menü. Sie müssen auf das Menü tippen, um die Links zu sehen.

Wenn ein Kunde auf einen Link klickt, wird eine bestimmte Aktion ausgeführt. Je nachdem, was Sie auswählen, können Ihre Kunden zu einem bestimmten Block Ihrer Seite. oder zu einer anderen Website weitergeleitet werden. Sie können auch einen Click-to-Call- oder Mail-to Link einrichten, so dass Ihre Kunden Sie erreichen können.

Um ein Navigationsmenü einzurichten:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie im Abschnitt Seitenblöcke auf Kopfzeile.
Klicken Sie auf der Registerkarte Inhalt auf + Aktionslink hinzufügen.
Geben Sie in das Feld Titel einen für Ihre Kunden aussagekräftigen Namen ein. Zum Beispiel Über uns, Rufen Sie uns an, usw.
Wählen Sie die Aktion bei Klick:
- Zum Seitenblock scrollen – Der Kunde wird zu einem der Blöcke Ihrer Website weitergeleitet.
- Seite öffnen – Sie können eine beliebige URL eingeben, um Kunden auf diese Seite weiterzuleiten.
- E-Mail verfassen – Nach dem Anklicken des Links wird der Standard Mail-Dienst auf dem Gerät des Kunden geöffnet.
- Telefonanruf – Nach Anklicken des Links wählt das Telefon des Kunden Ihre Nummer.
- Zum Shop – Der Kunde wird zu Ihrem Schaufenster weitergeleitet.
Klicken Sie auf Speichern und veröffentlichen.
Klicken Sie auf Zurück, dann auf die Navigation im Menü links und anschließend auf + Menüpunkt hinzufügen, um weitere Links zum Navigationsmenü hinzuzufügen.
(Optional) Sie können auch die Reihenfolge der Links ändern. Während Sie Ihre Seite bearbeiten, gehen Sie zu Kopfzeile → Navigation, um die Liste aller Links, die Sie erstellt haben, zu bearbeiten. Sie können die Reihenfolge der Menüpunkte durch Drag & Drop ändern, indem Sie sie in die gewünschte Richtung ziehen. Klicken Sie auf Speichern und veröffentlichen.

Sie können auch das Design der Navigationsleiste ändern, um sie an Ihre Markenidentität anzupassen.

Um das Design des Webseitenmenüs zu bearbeiten:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie im Abschnitt Seitenblöcke auf Kopfzeile.
Klicken Sie auf der Registerkarte Gestaltung auf Hintergrund und wählen Sie die Farbe für die Navigationsleiste.
Klicken Sie auf Navigation, um die Schriftart und Farbe für die Links in der Leiste auszuwählen.
Klicken Sie auf Speichern und veröffentlichen.

Hinzufügen des Kategoriemenüs

Produktkategorien sind Gruppen von Artikeln, die Sie bündeln können, um sie auf der gleichen Seite in Ihrem Shop anzuzeigen. Zum Beispiel Kaffeebecher, Sommermode, Bestseller. Sie können das Menü Ihrer Stammkategorien anzeigen, so dass Ihre Kunden schnell das gesuchte Produkt finden können.

Um ein Kategorienmenü auf Ihrer Instant Seite zu erstellen:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie im Menü links auf Kopfzeile → Navigation und klicken Sie auf + Menüpunkt hinzufügen.
Benennen Sie das Element so, dass es für Ihre Kunden klar ist, dass es sich um den Link zu Ihrem Shop handelt.
Klicken Sie auf das Dropdown-Menü Aktion bei Klick und wählen Sie Zum Shop.
Stellen Sie sicher, dass Kategorien bei Mouseover im Menü anzeigen aktiviert ist. Sie können die Option deaktivieren, um das Kategorienmenü auszublenden.
Klicken Sie auf Speichern und veröffentlichen.

Beachten Sie, dass das Kategorienmenü bei einem Mouseover angezeigt wird und daher auf mobilen Geräten nicht angezeigt werden kann. Wenn ein Kunde auf einen Shop-Link im Menü tippt, wird er sofort zu Ihrem Shop weitergeleitet.

Aktionslinks hinzufügen

Für einige Abschnitte Ihrer Instant Site (z. B. Titelblock, Kundenmeinungen oder „Kontakt“) ist es möglich, Aktionslinks hinzuzufügen. Aktionslinks sind anklickbare Texte oder Schaltflächen mit Text. Wenn ein Kunde auf diesen Text (oder die Schaltfläche) klickt, wird eine bestimmte Aktion ausgeführt.

Sie können zum Beispiel eine Produkt-URL angeben, die sich bei Klick öffnet oder Kunden zu einem bestimmten Abschnitt Ihrer Website (z. B. bei einer Sonderaktion) weiterleiten.

Um einen Aktionslink einzurichten:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf einen Block.
Klicken Sie auf der Registerkarte Inhalt des Blocks auf Aktionslink hinzufügen.

Der Titelblock verfügt über eine Primäre Aktion und Sekundäre Aktion.
Geben Sie einen Titel ein. Dies wird der Text Ihres Links.
Wählen Sie Aktion bei Klick: Zum Seitenblock scrollen, Seite öffnen, E-Mail verfassen oder Telefonanruf.
Wählen Sie den Seitenblock, geben Sie die URL ein oder Ihre E-Mail-Adresse bzw. Telefonnummer – je nach Auswahl.
(Optional) Ändern Sie das Aussehen, die Schriftart, die Größe, die Form und die Farbe des Aktionslinks auf der Registerkarte Gestaltung.

Konfiguration der Shopblöcke

Es gibt zwei Blöcke, die Kunden zeigen können, wo auf Ihrer Instant Site sie auf den Shop zugreifen können: der Block „Empfohlene Produkte“ und der Block „Hauptkategorien“. Standardmäßig ist nur der Block „Empfohlene Produkte“ in der Liste der Seitenblöcke vorhanden.

Der Block „Empfohlene Produkte“ enthält alle Produkte, die der Kategorie „Shop-Startseite“ in Ihrem Shop zugeordnet sind. Dieser Block ist ein perfekter Platz, um Artikel zu präsentieren, die Sie Ihren Kunden am meisten zeigen möchten. Wenn ein Kunde auf ein vorgestelltes Produkt klickt, wird er auf die Seite dieses Produkts in Ihrem Shop weitergeleitet.

Falls Sie einen kleinen Katalog haben, dann können Sie einfach alle Produkte im Abschnitt „Empfohlene Produkte“ darstellen. Falls Sie jedoch einen größeren Katalog haben, benötigen Sie wahrscheinlich ein System von Kategorien in Ihrem Shop. Um diese Kategorien direkt auf der Startseite Ihrer Instant Site anzuzeigen, können Sie einen speziellen Hauptkategorien-Block hinzufügen. Dieser Block enthält alle Ihre Hauptkategorien.

Um die Navigation der Kategorien zu vereinfachen, können Sie auch ein Kategorienmenü einrichten.

So fügen Sie einen Hauptkategorien-Block hinzu:

Gehen Sie in Ihrer Shop-Verwaltung zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf Block hinzufügen.
Scrollen Sie auf der geöffneten Seite nach unten zu Produkte.
Klicken Sie auf den Block Shop nach Kategorie.
Wenn Sie auf den Block klicken, wird er zur Bearbeitung geöffnet und zur Liste der Seitenblöcke hinzugefügt.

Sie können das Erscheinungsbild des Blocks „Empfohlene Produkte“ und des Blocks „Hauptkategorien“ auf der Startseite Ihrer Instant Site einstellen. Gehen Sie dazu auf die Gestaltung-Seite in Ihrer Shop-Verwaltung. Sie können auch das Layout dieser Blöcke ändern (z. B. den Produktnamen und -preis, die Anzeige der Schaltfläche „Jetzt kaufen“ und des Hauptproduktbilds usw.). Rufen Sie dazu den Site-Editor auf.

So ändern Sie das Layout der Shopblöcke im Site-Editor:

Gehen Sie in Ihrer Shop-Verwaltung zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf den Block.
Nehmen Sie die notwendigen Änderungen in den Registerkarten Inhalt und Design vor (legen Sie den Blocktitel fest, wählen Sie aus, welche Elemente angezeigt werden sollen, ändern Sie die Schriftarten, den Hintergrundstil und die -farbe usw.).

Einstellungen im Site-Editor haben Vorrang vor ähnlichen Einstellungen auf der Gestaltung-Seite in Ihrer Shop-Verwaltung.

Standardschriftarten und CSS anwenden

Es gibt zwei Hauptmöglichkeiten, die Schriftarten auf Ihrer Instant Site zu ändern. Zuerst können Sie die Schriftarten für jedes Element eines jeden Blocks individuell in der Registerkarte Gestaltung dieses Blocks einstellen. Dort können Sie die Schriftart, Größe und Stil (fett oder kursiv) sowie die Textfarbe anpassen. Weiterhin können Sie die Standardschriftart für alle Blöcke Ihrer Site mit globalen Schrifteinstellungen festlegen.

Sie können zum Beispiel globale Einstellungen verwenden, wenn Sie verschiedene Layout-Optionen ausprobieren und Sie keine unterschiedlichen Schriftarten für verschiedene Elemente Ihrer Seitenblöcke benötigen. Auf diese Weise sparen Sie Zeit und haben im Handumdrehen ein einheitliches Design auf Ihrer Website.

Folgendes können Sie festlegen:

Titelfonts (das sind die Schriftarten der Blocküberschriften)
Schriftarten für die Beschreibung (dies sind die Schriftarten von Textabschnitten, Schaltflächentexten und Untertiteln)

Nachdem Sie die Standardschriftart für Ihre Website festgelegt haben, können Sie die Schriftarten noch für einzelne Elemente ändern. Globale Schrifteinstellungen werden nur auf die Elemente angewendet, die in der Registerkarte Gestaltung des Editors die Schriftart „Standard“ gewählt haben.

Globale Schrifteinstellungen, die Sie im Instant Site Editor anwenden, werden nur für die Website selbst, einschließlich des Shop-Blocks angewendet. (Dies ist eine Vorschau, die Ihren Kunden zeigt, wo sie auf Ihrer Site auf den Shop zugreifen können). Sie werden nicht in Ihrem eigentlichen Shop verwendet, wo Ihre Kunden nach Produkten suchen, da das Schaufenster als eigenständiger Teil Ihrer Website betrachtet wird.

Für den Fall, dass Sie das Aussehen (einschließlich der Schriftarten) Ihres Shops anpassen müssen oder Sie das Aussehen Ihrer Instant Site anpassen möchten – zusätzlich zu den Einstellungen, die im Editor verfügbar sind – können Sie das tun, indem Sie benutzerdefinierten CSS-Code einfügen. Mit Hilfe von Cascading Style Sheets (CSS) können Sie den Stil ändern, der auf Ihren Seiten verwendet wird – passen Sie die Farbe von Schaltflächen an oder blenden Sie sie aus, passen Sie Schriftarten an, verbergen Sie Preise, und vieles mehr.

Um Schriftarten und/oder Stile anzuwenden:

Gehen Sie in Ihrem Shop-Admin zu Übersicht → Starterseite verwalten → Website bearbeiten (oder Webseite → Website bearbeiten).
Klicken Sie auf Einstellungen → Fonts & Stile.
Um die Standardschriftarten für Ihre Instant Site festzulegen, wählen Sie die Schriftarten in den Dropdowns Titel-Schriftart und Textschriftart des Body aus.
Um Stile anzuwenden, klicken Sie auf Erweiterte Einstellungen und geben Sie Ihren CSS-Code ein.

Falls Sie von der alten Version unserer Instant Site auf die Instant Site der neuen Generation gewechselt haben und einige aktive CSS-Themen besitzen, die Sie zuvor unter Gestaltung in Ihrem Shop-Admin angewendet haben, dann werden diese Codes nach wie vor in Ihrem Shop angewendet (bis Sie sie deaktivieren). Für den Fall, dass Sie später neue Codes im Instant Site Editor anwenden und es einige Überschneidungen gibt, werden die Codes, die Sie unter Gestaltung angewendet haben, auf Ihren Shop-Seiten priorisiert.

Ändern von Website-Adresse und Shop-Namen

Sie können den Namen und die Adresse Ihrer Shop-Website so bearbeiten, dass sie das das Konzept und den Namen Ihrer Marke widerspiegeln.

Um den Namen Ihrer Webseite zu bearbeiten:

Gehen Sie von Ihrem Shop-Admin aus zu Einstellungen → Allgemein → Shopprofil.
Geben Sie den Shopnamen in das Feld Shopnamen im Abschnitt Shopname und Webadresse ein.
Klicken Sie auf Speichern.

Um die Adresse Ihrer Webseite zu bearbeiten:

Gehen Sie von Ihrem Shop-Admin aus zu Übersicht → Starterseite verwalten.
Klicken Sie auf Adresse ändern.
Geben Sie den von Ihnen gewünschten Namen für Ihre Webadresse in das Feld „Verwenden Sie unsere Sub-Domain“ ein.
Klicken Sie auf Speichern.

Anzeigen des Banners für die Cookie-Einwilligung

In Ländern wie der EU müssen Sie möglicherweise das Cookie-Einverständnis-Banner auf Ihrer Shop-Website anzeigen. Gehen Sie dazu zu im Instant Site Editor auf Einstellungen → Tracking & Analysen und aktivieren Sie die Option Banner für Cookie-Einwilligung anzeigen.

Dieser Schalter aktiviert das Cookie-Zustimmungsbanner sowohl auf Ihrer Instant Site als auch in Ihrem Shop. Sie können auch das Banner deaktivieren, um es nur auf Ihren Shop-Seiten anzuzeigen.