Inhalte bearbeiten

Lesezeit 13 min

Nachdem der Installer alle Zusatzinhalte installiert hat, können diese nachbearbeitet werden. Schau in diesem Video an, wie das geht und auf was man achten soll.

Ein eigenes Logo hochladen und Services bearbeiten


Eigene Links in der Topbar platzieren


Das Megamenü, Kategorien und eigene Links


Startseiten-Text einfügen

Es gibt im Template zwei Möglichkeiten einen eigenen Startseiten-Text einzupflegen. Die erste Variante geht über „Eigene Seiten„, <Inhalte> <Eigene Seiten>. Hier kann, je nach Einstellung entweder die Linkgruppe <Kopf> oder die Linkgruppe <megamenu> sein. Dort nach der Seite „Startseite“ oder „Home“ suchen.

Die zweite Variante geht über die Boxenverwaltung, die auch im Demo-Shop definiert ist. Die Boxenverwaltung erreicht man unter <Inhalte> <Boxenverwaltung>. Wähle als Seite „Startseite“ aus und scrolle bis zum Bereich <Header>.

  1. Erstelle eine neue Box mit Rahmen oder ohne
  2. Klicke rechts in der Zeile auf das <Bearbeiten-Icon>
  3. Füge deinen Inhalt ein und speichere ab

Wichtig

Achte darauf, dass der Container „Header“ aktiv ist (ein Häckchen setzen bei der Checkbox) und dass die neu eigefügte Box ebenfalls aktiv ist.

Die Zwei-Spalten-Ansicht

Da wir einen WYSIWYG-Editor haben ist es möglich mit dem Bootstrap-Grid-System zu arbeiten. D.h. wir definieren zwei Spalten und packen da rein unseren Text.

<div class="row">
  <div class="col-xs-12 col-md-6">
    <p>
      Text...
    </p>
  </div>
  <div class="col-xs-12 col-md-6">
    <p>
      Text...
    </p>
  </div>
</div>

Kategorien auf der Startseite bearbeiten

Auf der Startseite ist die Anzeige der wichtigsten Kategorien integriert. Diese Kategorien können individuell mit eigenen Grafiken und Überschriften versehen werden.

Wechsle in den Backend-Bereich des Shops nach <Inhalte> <Eigene Seiten> und suche nach der  Linkgruppe Kategorien an, wie in der Abbildung zu sehen:

Das Layout der Kategorien beeinflussen

Es ist möglich die Kategorien auf der Startseite individuell einzustellen, wie viele davon pro Zeile angezeigt werden. Für diesen Fall haben wir die Möglichkeit geschaffen das Layout der Kategorien selbst einzustellen.

Das Feld für Meta-Keywords ausnutzen

Um das Layout einzustellen arbeitet man mit den CSS-Klassen des Grid-Systems. Somit ist es möglich jede einzelne Kategorien auf der Startseite individuell einzustellen, z.b. 3-3-3-3 oder 6-3-3.

2 Kategorien nebeneinander

col-xs-12 col-sm-6

3 Kategorien nebeneinander

col-xs-12 col-sm-4

4 Kategorien nebeneinander

col-xs-12 col-sm-6 col-md-3

6 Kategorien nebeneinander

col-xs-12 col-sm-4 col-lg-6

Mit dieser Methode ist man recht flexibel und kann auch andere Darstellungen abbilden.

// Die erste Kategorie geht über die halbe Seiten-Breite
col-xs-12 col-sm-6

// Die zweite und die dritte Kategorie teilen den restlichen Platz
col-xs-12 col-sm-3

Artikel auf der Startseite aktivieren

Es kommt oft die Frage „Wie kann man auf der Startseite bestimmte Artikel anzeigen lassen, wie in der Demo?“. Der JTL-Shop bietet die Möglichkeit auf der Startseite Artikel der vier Artikelgruppen anzuzeigen:

  1. Top-Angebote
  2. Neue Produkte
  3. Sonderangebote
  4. Bestseller

Top-Angebote und Neue Produkte

Die Artikel werden auf der Startseite nicht angezeigt solange diese in JTL-Wawi als solche nicht gekennzeichnet sind! Um dies zu machen, ruft man in JTL-Wawi den jew. Artikel auf, im unteren rechten Bereich der Artikelmaske auf den Reiter <Onlineshops> gehen und jeweils ein Häckchen bei Option <Artikel hervorheben> setzen.

Erst dann wird dieser Artikel im Shop als „Top-Angebot“ und/oder „Neu“ angezeigt.

Eine weitere Einstellung für „Wie lange ein Artikel als Neu angesehen wird“ kannst du unter der Shop-Einstellung 113 definieren.

Sonderangebote

Die Sonderangebote sind preislich reduzierte Artikel, welche ebenfalls zuerst in JTL-Wawi als solche definiert werden müssen. In den Reiter <Sonderpreise> gehen und dort einen neuen Preis eintragen.

Wichtig

Bitte aktiviere den neuen Preis für den Shop (den Shop-Reiter anklicken), sonst bleibt der Preis nur in JTL-Wawi reduziert und ist für die Shopkunden nicht ersichtlich!

Ferner hast du auch die Möglichkeit den reduzierten Preis zeitlich zu begrenzen. In dem Fall wird im Template die Funktion <DailyDeal> aktiv, welche einen Counter mit Ablaufdatum anzeigt.

Bestseller

Die Bestseller werden vom Shop automatisch aus den verkauften Artikeln erstellt. Ab welcher Menge ein Artikel als Bestseller angesehen werden soll, kann man unter der Shop-Einstellung 1308 definieren.

Artikel anzeigen und die Anzahl einstellen

Wir empfehlen nicht mehr als 7 Artikeln auf der Startseite anzuzeigen, damit die Startseite schnell genug ist und jede Artikelgruppe (Neue Produkte, Sonderangebote, Bestseller und Top-Angebote) übersichtlich bleibt. Die Startseite sollte einen schnellen Überblick über alle Neugkeiten und Aktionen verschaffen, übertreibe damit nicht.

Wo: <System> <Globale Einstellungen> <Startseite>


Aktionsbereich mit Paralax bearbeiten

Der Aktionsbereich soll deine Besucher zu bestimmten Aktionen animieren. Das können z.B. Sonderangebote, Exklusive Artikel oder Services sein. Welchen Inhalt du platzierst, bleibt an dieser Stelle dir überlassen.

Der Aktionsbereich wird zwischen den ersten und den zweiten Artikelgruppen angezeigt.

Fehlt das Bild?

Falls das Bild für den Parallax-Slider fehlt, bitte es über die Template-Einstellungen hochladen, s. den Punkt „Das Parallax-Bild austauschen„.

Wechsel in den Backend-Bereich des Shops nach <Inhalte> <Eigene Seiten> und lege eine neue Linkgruppe Parallax an, wie auf der Abbildung zu sehen: 

So kannst du dein Text formatieren:

<h4>Dies ist Neu</h4>
<h5>Sparen bis zu 30%</h5> 
<div>Hier steht der Inhalt...</div>
<a class="btn btn-primary" href="#">Jetzt anschauen</a>

Das Parallax-Bild austauschen

Das Bild für den Parallax-Slider kann man bequem über die Oberfläche der Template-Einstellungen austauschen.

<Template> <FlexChild> <Bearbeiten-Button> <Widgets>

Parallax-Bild austauschen

News aktivieren und pflegen

Die Anzahl der News bitte unter <Inhalte> <News>, Reiter „Einstellungen“ bei „Option Anzahl News auf Startseite“ auf 2 einstellen. 


Google-Map auf der Kontaktseite aktivieren

Die Kontaktseite beinhaltet gleich zwei Funktionen: eine Google-Map und das FAQ-Widget.

GoogleMap

Die Google-Map zeigt auf einer Karte die Adresse deines Ladenlokals oder Unternehmens an – und zwar die Adresse die du unter <Template-Einstellungen> <Kontaktdaten> eingetragen hast.

Google Map Key

Damit die Google-Map in deinem Shop angezeigt wird, muss unter https://developers.google.com/maps/documentation/javascript/get-api-key?hl=de ein API-Key vom Typ: Browser erstellt werden.

Wichtig

Bei „Anfragen von diesen HTTP-Referrern (Websites) annehmen“ bitte unbedingt die URL des Shops eintragen, damit dies nicht missbraucht werden kann.

Adresse für Google Map

Trage hier die Adresse(n) ein, die auf der Google-Map angezeigt wird. Bitte in Form von „Strasse, Haus-Nr., PLZ, Ort, Land“. Mehrere Adressen kannst du mit Semikolon „;“ trennen.


FAQ-Widget auf der Kontaktseite

Die FAQ können wichtige Fragen zur Bestellung, zum Ablauf, der Sendungsverfolgung oder zur Hotline aufnehmen. Das Widget ist so umgesetzt, dass eine hierarchische Struktur unterstützt wird.

Wichtig

Wird das Kontaktformular nicht angezeigt, richte erstmal einen Betreff mit einer Email-Adresse ein: <Storefront> <Kontaktformular>.

Wechsel in den Backend-Bereich des Shops nach <Inhalte> <Eigene Seiten> und klicke dort die Linkgruppe „FAQ“, wie auf der Abbildung zu sehen.

FAQ-Häufige Fragen

Jede Seite der FAQ-Linkgruppe stellt eine Frage-Antwort da und kann von dir jederzeit nachbearbeitet werden.

Neue FAQ anlegen

Klicke in der Zeile der Linkgruppe-Bezeichnung auf den Button <Seite hinzufügen> und erstelle eine neue Seite.

Kategorien-Struktur definieren

Wenn du aber deine FAQs Kategorien zuordnen möchtest, um es übersichtlicher zu gestalten, legst du erst einmal wie gehabt über den Button <Seite hinzufügen> eine neue Seite an und benennst diese so, wie die entsprechende Überschrift der Kategorie heißen soll, in unserem Beispiel „Fragen zur Bestellung“.

Damit diese nun als Kategorie mit Überschrift angezeigt wird, musst du eine weitere Seite anlegen und sie der „Fragen zur Bestellung-Seite“ unterordnen (untergeordnete Seiten erkennst du an den Pfeilen).