Benutzer-Werkzeuge


Navigation

08 Design bearbeiten

Sie haben die Möglichkeit, das Shopdesign zu beeinflussen.
Dazu wechseln Sie im BackOffice zu Shop → Layout.

Abhängig vom gewählten Layout haben Sie hier unterschiedliche Möglichkeiten.

Mehr zum Thema Design
Aktuell gibt es 3 Templates, die Sie nutzen können. Dabei ist eines, das Standard-Template, bereits vorinstalliert und ermöglicht Ihnen, ohne große Anpassungen vornehmen zu müssen, den Verkauf zu starten. Aber auch bei dem Standardtemplate müssen Sie einige Einstellungen tätigen, bevor Sie live gehen können.

Wichtig ist es, dass Sie

  • das Aussehen des Shops kontrollieren
  • die Startseite kontrollieren
  • ein Shoplogo hinterlegen
  • das angepasste Layout veröffentlichen.

Vorschau- und Live-Modus


Alle Änderungen am Design unter Shop → Layout nehmen Sie zunächst im Vorschau-Modus vor.
Das bedeutet, dass Sie in aller Ruhe das Design bearbeiten können, auch nachdem Sie den Shop für den Kunden geöffnet haben. Der Kunde sieht nur das, was Sie in der Live-Version veröffentlicht haben.

Der Hintergrund ist, dass der Kunde einerseits nicht sieht, was Sie gerade am Design verändern und Sie anderseits verschiedene Einstellungen testen und optimieren können.

Klicken Sie auf den Button veröffentlichen, wenn der Kunde Ihre Änderungen in der Live-Version sehen soll.

Das Shop-Logo einbinden
Zeigen Sie unbedingt ein Shop-Logo in Ihrem Shop an, damit der Kunde gleich erkennen kann, welcher Shop hier Vertragspartner ist.
  • Das Logo soll von guter Qualität sein
  • Auf dem Logo sollte der Shopname sichtbar sein
  • Keine Internetadressen im Logo verwenden

Abhängig vom gewählten Template, können Sie das Shoplogo folgendermaßen einbinden:

StandardtemplateTemplate AurelioTemplate Pangea
Über die Seite Verwaltung > Einstellungen unter dem Punkt Ihr Logo können Sie das Shop-Logo hochladen
wird automatisch eingebundenist vorausgewählt im Look&Feel unter
Allgemein - Einstellungen für den oberen Bereich (Header)
muss im Look&Feel eingestellt werden
unter Header-Bereich → Shop-Logo
Alternativ aus den Eigenen Dateien kann ein Logo eingebunden werden Alternativ aus den Eigenen Dateien -> Bild/Grafik 1

Grafiken hochladen

Wichtig ist, dass Sie hochwertige Grafiken in Ihrem Shop verwenden.
Selbst moderne Kompaktkameras können gute bis hochwertige Bilder erstellen. → Lesen Sie mehr unter produktbilder_erstellen.

Überlegen Sie sich im Vorfeld, welche Farben und Grafiken Sie in Ihrem Shop verwenden wollen.

Wichtig ist, dass Sie ein Shoplogo hochladen. Dieses ist das Firmenschild für Ihren Online-Shop.

Passen Sie das Shopdesign an Ihre Produkte und Zielgruppe an.
Das Shoplogo sollte sich harmonisch einbinden lassen.


  • Ihr Berater / Ihre Beraterin hilft Ihnen hier mit Rat und Tat weiter und gibt im individuellen Gespräch weitere Tipps.

Gehen Sie zu Shop → eigene Dateien.


Eigene Dateien: Grafiken für das Design hochladen

Hier können Sie Ihre eigenen Grafiken und Bilder hochladen. Diese können Sie z.B. in Ihrem Template, in Ihrem Blog sowie in Ihren Inhaltsbereichen verwenden.

Mit Klick auf Durchsuchen öffnet sich ein kleines Explorer-Fenster „Datei hochladen“, in dem Sie nach Ihrem Bild auf Ihrem Rechner suchen können. Haben Sie es gefunden, können Sie mit Doppelklick (alternativ: Einfachklick mit anschließendem Klick auf „Öffnen“) den Pfad zu Ihrem Bild übernehmen. Anschließend klicken Sie auf Datei hochladen.

  • HINWEIS: Bilder dürfen maximal 2,5 MB groß sein. Die erlaubten Dateiformate sind JPG, GIF und PNG. Dies kann je nach Größe des Bildes einige Zeit in Anspruch nehmen.

Sobald das Bild erfolgreich hochgeladen wurde, erscheint dies in der „Dateien“-Liste:

Sie können aber auch PDF-Dokumente auf die gleiche Weise hochladen. Die Formate, die Sie hochladen können, sind: JPG, GIF, PNG, ICO, PDF, JS, CSS, XML und SWF.

  • Über den Look&Feel Editor können Sie auf einfache Weise Bilder aus Eigene Dateien an verschiedenen Stellen einbinden. Sie können auch Dateien aus diesem Ordner in die Produktbeschreibung einfügen.

Das Verzeichnis lautet uploads, wenn Sie es von Hand einbinden wollen.

  • Laden Sie hier zum Beispiel Ihr Firmenlogo hoch. Dies können Sie dann über den Look & Feel-Editor in Ihr Shopdesign integrieren.
Template auswählen: 3 Templates zur Wahl

In Ihrem Backoffice haben Sie drei Grundlayouts für Ihren Rakuten-Shop zur Verfügung.

Diese können Sie individualisieren.
Einmal funktioniert dies über den Look&Feel-Editor, mit dem Sie auch ohne HTML-Kenntnisse das Design bearbeiten können. Dieser inst in allen drei Designs nutzbar.

Zum anderen können Sie in die HTML-Struktur bei den Templates Aurelio und Pangea über den Template-Editor eingereifen. Dafür brauchen Sie HTML-Kenntnisse. Wenn Sie den Template-Editor starten, wird eine Kopie des Templates für Sie erstellt, das Sie bearbeiten können.

Im folgenden erfahren Sie die Grundeinstellungen für die Templates.

Standardmäßig ist das Standardtemplate installiert. Möchten Sie das Template wechseln, gehen Sie zu Shop → Layout und klicken dort auf den Reiter Templateauswahl.


Templateauswahl

Diese werden zentral bereitgestellt und Sie können hier sehen, welches Template im Vorschau-Modus ist und welches in der Live- Ansicht dem Kunden gezeigt wird.

Daneben haben Sie die Möglichkeit, eines der bereitgestellten Templates in den Vorschaumodus zu laden.

Mit dem Button Beispiel gelangen Sie zu einem Beispielshop, in dem Sie sich das gewählte Template testen können.

Es besteht damit die Möglichkeit, im Hintergrund ein anderes Template im Vorschau-Modus zu bearbeiten, während Ihre Kunden ein anderes Template im Live-Modus sehen.

Sie haben die Möglichkeit mit dem Button in Vorschau-Modus laden, ein anderes Template zu wählen, um dieses im Vorschau-Modus zu bearbeiten. * Es wird immer der letzte Bearbeitungsstand eines Templates gespeichert. Damit können Sie ein Template in den Vorschau-Modus laden und bearbeiten und wieder zum Bearbeitungsstand des vorhergehenden Templates wechseln.

Look&Feel-Editor: Design ohne HTML bearbeiten
Abhängig, welches Template Sie nutzen, haben Sie im Look&Feel-Editor unterschiedliche Einstellungsmöglichkeiten. Diese sind beim Template Pangea sehr umfangfreich, bei Aurelio haben Sie nur minimale Anpassungsmöglichkeiten. Das Standardtemplate besitzt nur minimale Anpassungsoptionen und keinen Template-Editor.

Dabei können Sie die Einstellungen auch ohne HTML-Kenntnisse vornehmen.

Wichtig bei allen Templates ist es, dass Sie die Farben des Shops an Ihre Bedürfnisse anpassen und auf jeden Fall Ihr Shoplogo einbinden, das Sie unter Eigene Dateien bzw. Verwaltung unter Ihr Logo hochgeladen haben.

Ebenso sollten Sie die Startseite anpassen.

Weiterführende Einstellungsmöglichkeiten erhalten Sie unter Look&Feel.


Standard-TemplateAurelioPangea
Farben einstellen
Im Standard-Template ist keine Anpassung der Farben möglich.Im Template Aurelio haben Sie die Möglichkeit, über den Punkt Allgemein - Farb- und Schrifteinstellungen die Möglichkeit, allgemeine Farbeinstellungen einzustellen.Im Template Pangea haben Sie die Möglichkeit, über den Punkt Farbeinstellungen und Erscheinungsbild Farbeinstellungen vorzunehmen.
Hintergrundeinstellungen
Den Shop-Hintergrund können Sie im Standard-Template nicht anpassen.Den Shophintergrund richten Sie im Template Aurelio unter Allgemein - Hintergrundeinstellungen ein.Im Template Pangea haben Sie die Möglichkeit, über den Punkt Farbeinstellungen und Erscheinungsbild die Hintergrundgrafik und -farbe des Shops einzustellen.
Shoplogo einbinden
Das Shop-Logo binden Sie im Standard-Template über Verwaltung → Ihr Logo ein.Im Template Aurelio binden Sie das Shoplogo unter Allgemein - Einstellungen für den oberen Bereich (Header). Im Template Pangea stellen Sie das Shoplogo unter Header-Bereich (Pangea) ein.
Startseite bearbeiten
Sie können im Standard-Template die Slider-Grafiken, den Startseiten-Text und Produktlisten anpassen. (new_standard)Auf der Startseite von Aurelio können Sie nur den Startseitentext bearbeiten unter Startseite - Allgemeine Einstellungen. Sie können die Inhalte der Startseite unter Startseite (Pangea) bearbeiten. Hier hinterlegen Sie u.a. den Willkommenstext.
Startseitenslider /Bildergalerie bearbeiten
Den Startseiten-Slider können Sie beim Standard-Template bearbeiten.Die Bildergalerie auf der Startseite bearbeiten Sie unter Startseite - Bildergalerie (mit großem schmalen Bild)Die Bildergalerie (Slider) bearbeiten Sie unter Startseiten Widget: Slider.
Template-Editor für Experten
Im Template-Editor / Experten-Modus haben Sie Zugriff auf die HTML-Struktur Ihres Rakuten-Shops.
Beachten Sie bitte, dass Sie hierzu Kenntnisse in HTML benötigen.
Es wird beim Aktivieren des Experten-Modus eine eigenständige Kopie des Templates für Ihren Shop generiert, die Sie bearbeiten können.
Das automatische Update-System greift auf diese Kopie nicht zu. Aktualisierungen müssen hier von Ihnen manuell vorgenommen werden.

Eine Dokumentation der Variablen finden Sie unter http://dokumentation.storefront.rakuten.de


  • Der Template-Editor steht nicht im Standard-Template zur Verfügung.
Vorschau veröffentlichen

Alle Änderungen am Design unter Shop → Layout nehmen Sie zunächst im Vorschau-Modus vor.
Das bedeutet, dass Sie in aller Ruhe das Design bearbeiten können, auch nachdem Sie den Shop für den Kunden geöffnet haben. Der Kunde sieht nur das, was Sie in der Live-Version veröffentlicht haben.

Der Hintergrund ist, dass der Kunde einerseits nicht sieht, was Sie gerade am Design verändern und Sie anderseits verschiedene Einstellungen testen und optimieren können.

Klicken Sie auf den Button veröffentlichen, wenn der Kunde Ihre Änderungen in der Live-Version sehen soll.