JTL-Shop 4 | Best Practices Templateanpassung

JTL-Shop 4Best Practices:

Templateanpassung Ein Workshop mit David Hannappel & Pascal Kleefeld

von JTL-Software

03.05.2023 JTL-Software-GmbH, David Hannappel & Pascal Kleefeld

2

Ablauf des Workshops• Einführung in das Evo-Template• Technologische Grundlagen• Evo-LiveStyler• Evo-Editor• Child-Templates

• Live-Vorführung: Templateanpassung• Fragerunde• Abschluss

Dauer: ca. 35 Min.


3

Einführung in das Evo-Template• Kostenlos mit JTL-Shop• Vollständig responsive• Gleiches Shopping-

Erlebnis auf allen Endgeräten

• Einfach anzupassen


4

Technologische Grundlagen• Basiert auf dem

responsiven Framework Bootstrap 3

• LESS als CSS-Framework• Smarty 3 als

Templating-Engine• Evo-Editor als LESS- und

JS-Compiler• Evo-LiveStyler als Live-

Editor für Variablen• Inkl. 13 verschiedenen

Themes und 13 Hintergrundbildern


5

Evo-LiveStyler• Live-Anpassung von

Farbwerten, Abständen und Schrifteigenschaften

• Mit Vorschau-Modus


6

Evo-Editor• LESS- und JS-Compiler• Code-Editor im Shop-Backend• Keine Zusatzsoftware notwendig


7

Child-Templates• Bevorzugte Weg zum eigenen Template• Änderung, Austausch und Erweiterung des Evo-

Templates• Smarty Blocks• Spart sehr viel Zeit und Arbeit


8

Child-Templates<title>{block name="head-title"}{$meta_title}{/block}</title>

{block name="head-resources"} ... {/block}

{extends file="{$parent_template_path}/layout/header.tpl"}

{block name="head-title"}CHILD-TEMPLATE!{/block}

{block name="head-resources" append} {if isset($Artikel) && !empty($Artikel->Bilder)} <meta property="og:image" content= "Test" /> {/if} {/block}

<Shop-Root>/templates/Evo/layout/header.tpl

<Shop-Root>/templates/Child-Template/layout/header.tpl


9

FragerundeHabt ihr Fragen?


10

Vielen Dank für euer Interesse und eure Aufmerksamkeit!