JTL-Shop 5 Template erstellen

So erstellst du dein eigenes JTL-Shop Theme

In deinem JTL-Shop 5 dein eigenes Template erstellen – Wie das funktioniert, welche Themes die Basis des Ganzen sein können, welche Content-Portlets und Layout-Portlets euch zur Verfügung stehen und wie euer JTL-Shop 5 Template dann am Ende aussehen kann, das seht ihr in dieser Screencast Folge.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren

Video laden

Zwei Basistemplates um euer JTL-Shop 5 Template zu erstellen

JTL-Software bietet mit ihrem hauseigenen Shopsystem zwei Basistemplates, die ihr ganz nach euren Wünschen individualisieren könnt, um daraus euer eigenes Template zu kreieren. Wie wir im Backend sehen können, sind in den Einstellungen unter Templates Beide standardmäßig aufzufinden. Wir haben aktuell das NOVA Template aktiv und schauen uns einmal an wie dieses beispielhaft aufgebaut werden kann. Zuvor wollen wir aber ein Blick auf die  Einstellungsmöglichkeiten werfen.

Einstellungen des NOVO Templates

Ihr könnt allgemeine Einstellung vornehmen wie bspw. bestimmte Dateien zu komprimieren und könnt bereits optische Theme Einstellungen umsetzen. Dazu zählt das Einfügen eines Favicons, was dann neben eurer URL ausgespielt wird oder die Aktivierung von Animationen wenn der Seitenbesucher über Schaltflächen hovert. Bei der Aktivierung würde dann ein kurzer Glanzeffekt auf der Schaltfläche zu sehen sein, wenn ein Kunde mit der Maus darüber fährt. Die Megamenü Einstellungen bestimmen welche Elemente im Megamenü dargestellt werden sollen oder nicht. Ist bspw. die Einstellung für Kategorien aktiv, werden die Kategorien im oberen Bereich der Seite im Megamenü eingeblendet. Falls diese Option deaktiviert ist, muss in der Boxenverwaltung eine Kategoriebox für jede Seite aktiviert werden, damit eure Kunden die Kategorien weiterhin erreichen können. Darüberhinaus kann dann eben eingestellt werden, ob Unterkategorien neben den Hauptkategorien im Megamenü dargestellt werden sollen und ob für diese auch Bilder ausgespielt werden sollen. Darunter können dann Anpassungen der Listen und Galerieansicht vollzogen werden, mit denen dann Filteroptionen wahlweise an bestimmten Stellen platziert werden. Also bspw. in der Seitenleiste oder in einem eigenen Fenster. Hiermit würde man dann festlegen, ob in der Listenansicht der Artikelübersicht die Schaltfläche “In den Warenkorb angezeigt werden soll. Zum Schluss kann in den NOVA Theme Einstellungen noch der Footer angepasst werden. So können sämtliche Social Media Kanäle untergebracht werden und euer Newsletter angezeigt werden.

JTL-Shop 5 Template erstellen​ im OnPage Composer

Wenn wir in unser Frontend gehen, sehen wir dann wie das Template letztendlich aussehen kann. Detailliertere Anpassungen können mittels OnPage Composer vorgenommen werden, den ihr im JTL-Shop 5 auch direkt mit dem Button oben links aus dem Frontend heraus steuern könnt. Wir haben als erstes Portlet einen Bild-Slider untergebracht, der den Kunden erst einmal visuell veranschaulicht, worum es sich bei eurem Shop handelt. Die Bilder innerhalb des Sliders können dann ganz einfach ausgetauscht werden, indem ihr auf das Bearbeitungssymbol (Bleistift) klickt und die Slides wählt. Darüberhinaus kann innerhalb der einzelnen Slider Sektionen auch Text untergebracht werden, der dann als Bauchbinde ausgespielt wird. Unter dem Slider kann dann eine Überschrift platziert werden, die entweder mittels Rich Text oder Überschrift per Drag & Drop aus dem Bereich für Content-Portlets in den Hauptbereich reingezogen wird.

JTL-Shop Stück für Stück individualisieren

In der dritten Reihe wurde sich eines Layout-Portlets bedient. Mit dem sogenannten Grid-Layout können nämlich zweispaltige Portlets erstellt werden, in die dann auf der einen Seite Text und auf der anderen Seite euer Produktvideo untergebracht werden kann. Solltet ihr noch kein Produktvideo euer Eigen nennen, helfen wir von eBakery euch auch dabei gern. Die nächsten beiden Portlet-Reihen wurden quasi kombiniert. Ihr habt eine Trennlinie mit Überschrift unter der dann eure Topseller, mittels Product Stream präsentiert werden können. Wenn wir uns das im Frontend mal anschauen, gelangen wir mit einem Mausklick auch direkt zum Produkt, das wir dann erwerben können.
Darüberhinaus kann dann ein Sonderangebots Countdown eingerichtet werden, den ihr in der Content Sektion findet.

Variationsmöglichkeiten der Layout-Portlets beim Erstellen eures JTL-Shop 5 Templates

Als nächstes wurde wieder das Grid Layout verwendet, mit dem ihr dann bspw. an der Stelle euch und euer Team näher beschreiben könnt. Am Ende wurde noch eine sogenannte Flipcard verwendet, die ihr in der Layout Sektion findet, mit der dann Testimonials präsentiert werden können. In das Layout Portlet, können dann jegliche verschiedene Content-Portlets untergebracht werden. In diesem Beispiel haben wir Rich Text als Überschrift genutzt, ein Bild-Portlet um unser Testimonial Model zu veranschaulichen und eine weitere Rich Text Bildunterschrift für den Namen. Wenn ihr nun auf die Flipcard drücken würde, würde die Bewertung in Textform erscheinen. Was aber genauso möglich wäre, ist die Unterbringung eines Videos anstatt Text.

eBakery unterstützt euch als JTL-Servicepartner gern

Wie ihr seht, bietet der JTL-Shop 5 mit seinem NOVA Template unzählige Möglichkeiten, dieses zu individualisieren und daraus euer eigenes Template zu erzeugen. Ich hoffe ihr habt aus dem Artikel einiges mitnehmen können. Sollte es über die Individualisierung des Templates hinaus Anliegen geben, unterstützen wir von eBakery euch als JTL-Servicepartner gern. Vereinbart dafür direkt einen Termin. 

  • 2/5
  • 8 ratings
8 ratingsX
Very bad! Bad Hmmm Oke Good!
62.5% 0% 25% 0% 12.5%

Haben Sie Fragen oder brauchen ein individuelles Angebot? Zögern Sie nicht, uns zu kontaktieren.


    eBakery benötigt die Kontaktinformationen, die Sie uns zur Verfügung stellen, um Sie bezüglich unserer Produkte und Dienstleistungen zu kontaktieren. Sie können sich jederzeit von diesen Benachrichtigungen abmelden. Informationen zum Abbestellen sowie unsere Datenschutzpraktiken und unsere Verpflichtung zum Schutz Ihrer Privatsphäre finden Sie in unseren Datenschutzbestimmungen.*.

    Related Posts
    Comments
    pingbacks / trackbacks
    • JTL Shop 5 Template erstellen – Tipps von eBakery – Presseengel.de

      […] Stuttgart, 19.01.2021 (PresseBox) – E-Commerce boomt und die aktuelle Situation zwingt mehr und mehr stationäre Händler dazu, einen eigenen Onlineshop als zusätzlichen Absatzkanal zu erstellen. Doch mit einem technisch funktionierenden Onlineshop alleine ist es nicht getan, wenn es darum geht langfristig erfolgreich im Internet zu verkaufen. Ein nachhaltig erfolgreicher Onlineshop muss zahlreiche Faktoren erfüllen. Neben attraktiven Waren, effizientem Marketing und einem kompetenten Kundendienst ist vor allem auch das Design des Shops relevant für den Erfolg. Was gilt es in diesem Zusammenhang zu beachten?Der erste Eindruck zähltWie so oft im Leben ist es auch beim erstmaligen Betreten eines Onlineshops so, dass der erste Eindruck zählt. Genau wie man kaum in ein Ladengeschäft gehen würde, welches schon von Außen einen schmuddeligen Eindruck macht, werden potenzielle Kunden einen Onlineshop nur dann betreten, wenn der Shop einen professionellen Eindruck vermittelt. Das Webdesign ist hier eine entscheidende Stellschraube. Die Webdesign-Welt ist allerdings sehr schnelllebig und von stetigen Veränderungen geprägt. Was beispielsweise noch vor zwei Jahren der absolute Standard war, kann heute schon längst überholt sein. Es ist also wichtig, das Erscheinungsbild eines Onlineshops schnell und unkompliziert verändern und anpassen kann. Die Templates in JTL Shop 5 lassen sich unkompliziert und flexibel an die eigenen Anforderungen und Vorstellungen anpassen.LESS und SassJTL 5 bietet von Haus aus zwei Basistemplates, welche individualisiert und ganz an das eigene Design angepasst werden können. Beide Templates basieren dabei auf unterschiedlichen Technologien zur Seitendarstellung. Während das EVO-Template LESS als CSS-Spracherweiterung nutzt, verwendet das NOVA-Template Sass. Beide Technologien erweitern den herkömmlichen CSS-Syntax und ermöglichen ein sehr komfortables Programmieren.Mit LESS und Sass lassen sich verschiedene Werte für Farben, Schriften, Abstände, Rahmen und Co definieren. Um das Aussehen eines JTL-Shops einfach und effektiv an die eigenen Vorstellungen anzupassen, ist es sinnvoll die LESS- oder Sass-Variablen des Templates in einem Child-Template zu überschreiben.Weitreichende Anpassungen und IndividualisierungenDetaillierte Anpassungen können mit dem Onpage Composer vorgenommen werden. Mit diesem Tool lässt sich jede einzelne Seite des Shops individuell anpassen. Die mitgelieferten Layout-Portlets lassen sich ganz einfach per Drag-and-Drop auf den gewünschten Seitenbereich ziehen und können sofort verwendet werden. Dem Gestaltungsspielraum sind so kaum Grenzen gesetzt und der Shop kann auf jeder einzelnen Seite genau so angepasst werden, wie es gewünscht wird. Unter Umständen ist das Erstellen eines eigenen JTL Shop 5 Templates jedoch aufwändig, insbesondere dann, wenn komplexe Onlineshops erstellt werden sollen.Bei größeren Projekten kann es daher durchaus vorteilhaft sein, eine professionelle Agentur für die Erstellung des JTL Shop 5 Template mit ins Boot zu holen. Agenturen, die täglich mit der Erstellung und Anpassung von JTL Shop 5 Templates zu tun haben, sind in der Lage entsprechende individuelle Templates innerhalb eines Bruchteils der Zeit zu erstellen, als es ein ungeübter in der Lage wäre. Darüber hinaus kann so sichergestellt werden, dass die Templates frei von Programmierfehlern sind, was die Funktionalität des gesamten Shops einschränken oder gar zu einem Totalausfall führen kann. Eine auf JTL spezialisierte E-Commerce-Agentur ist in der Lage die Templates schnell nach den Vorgaben ihrer Auftraggeber anzupassen und zu optimieren. Weitere Informationen zu diesem Thema findet man hier: https://ebakery.de/jtl-shop-5-template-erstellen/ […]

    Leave a Comment

    JTL-Shop 5 Live-Chat Smartsupp

    Hat dir der Artikel gefallen?

    Dann melde dich doch zu unserem Newsletter an!

    Neben unseren Blog Themen informieren wir dich darin regelmäßig zu neuen Features und Tutorials