Blog - Übersicht

Kategorien mit den neuesten Beiträgen

Donnerstag, 25 Mai 2017 08:37

JTL Shop "Call to Action": Banner auf Startseite aus WAWI steuerbar Empfehlung

geschrieben von
Artikel bewerten
(17 Stimmen)
JTL Shop "Call to Action": Banner auf Startseite aus WAWI steuerbar - 5.0 out of 5 based on 17 votes
Herausstechende Angebote Herausstechende Angebote Pixabay / Unsplash

JICAS für Ihren JTL-Shop

Die meisten Shops machen mit einem Slider auf, der ihre wichtigsten Top-Angebote als Klickfänger zeigt. Ein klassisches "Call to Action". Der JTL-Shop 4 bietet zwar die Möglichkeit der Einstellung eines Banners, doch lässt sich dieses nicht aus JTL heraus steuern - insbesondere auch nicht von Mitarbeitern, die keine HTML-Kenntnisse haben. Tatsächlich haben die meisten Shopbetreiber den Haken bei ihren "TOP-Angeboten" gesetzt und halten dieses Array aktuell. Ein idealer Punkt, um an ein integriertes Call to Action System anzuknüpfen. Und hier haben wir JICAS entwickelt.

JICAS 1.0 stable: JTL Shop Call to action im Material Card Design

Wir haben viel getestet und einige Designänderungen vorgenommen. JICAS ist jetzt als V.1.0 verfügbar.

jicasa named

 

Was ist JICAS

JICAS steht für "JTL INTEGRATED CALL TO ACTION SYSTEM". Und genau das soll auch vollbracht werden: Wir wollen ein System, das es ermöglicht bestimmte Artikel in JTL auszuwählen und mit Daten auszustatten, die dann auf der Startseite des Shops in einem großen Slider angezeigt werden. Das soll automatisch funktionieren und auch ohne HTML-Kenntnisse bedienbar sein.

Features

  • Responsive
  • Aus JTL-WAWI bedienbar
  • Ohne HTML-Kenntnisse bedienbar
  • Anzeige von Angebotspreis und Grundpreis
  • Feld für zusätzliche Informationen und Videos
  • Knüpft an das vorhandene TOP-Angebote array an
  • Praxiserprobt und erfolgreich
  • Kostenlos - Kaffee geht klar

 

Preview:

 

Was ist JICAS nicht?

Perfekt. Wir arbeiten noch an Design und Funktion. Natürlich freuen wir uns über Vorschläge und Anregungen.

Join us in our GitLab!

Ist die Verwendung kostenlos?

Ja. Sie können sich unseren Entwicklungsstand über diese Seite oder GitHub herunterladen und frei bearbeiten und verwenden. Wir freuen uns, wenn Sie Ihre Verbesserungen als Branch einbringen. Natürlich freuen wir uns, wenn Sie uns einen Kaffee spendieren!

 Vorgehensweise & Installation

Die Installation und Einrichtung ist schnell erledigt. Im wesentlichen müssen wir die JICAS.tpl in unser Template an einer entsprechenden Stelle inkludieren und entsprechendes mit der CSS-Datei tun oder die Regeln in eine vorhandene CSS-Datei anhängen.

Hinweise zu Childtemplates Download Aktuelle JICAS-Version im Git

 JICAS.tpl einbinden

Wir legen die JICAS.tpl zunächst an einem Ort ins unserem Templateordner ab. Wir haben hier /add gewählt. Nun müssen wir die Datei einbinden. Wir brauchen die Datei aus /page/index.tpl und kopieren die Datei in unser Child-Template. Die Datei beginnt etwa wie folgend:

{if !empty($cFehler)}
<div class="alert alert-danger">{$cFehler}</div>
{/if}

{include file="productwizard/index.tpl"}

 An dieser Stelle fügen wir nun den Befehl zum Einbinden ein:

 

{if !empty($cFehler)}
<div class="alert alert-danger">{$cFehler}</div>
{/if}

{include file='add/jicas.tpl'}

{include file="productwizard/index.tpl"}

 TPL anpassen - SMARTIE CONSOLE

Da das Array für die "Top-Angebote" keinen festen Wert in jedem Shop hat, müssen wir diesen zunächst herausfinden. Das geht einfach über die SMARTIE-Console, die Sie über das Admin-Menü - Plugins aktivieren können. Bitte achten Sie darauf, dass Sie die Debug-Konsole nach dem Vorgang wieder deaktivieren.

Nachdem Sie die Konsole aktiviert haben, können Sie das Frontend neu laden. Die Konsole rufen Sie mit STRG+ENTER auf. Suchen Sie nach "StartseiteBoxen" und erweitern Sie die Ergebnisse:

SMARTIE Konsole Shop

Wie Sie sehen hat "Top-Angebote" hier die Nummer 2. Diesen Wert fügen wir in der jicas.tpl an dieser Stelle ein.

{foreach from=$StartseiteBoxen[2]->Artikel->elemente item=name}

 Nun müssen Sie nur noch die CSS-Regeln einbinden und ihr Shop ist bereit.

Eigene Felder in JTL-WAWI anlegen

 

In JTL-WAWI müssen wir nun nur noch die entsprechenden Felder für die Steuerung anlegen - Artikel - Eigene Felder.

Feldgruppe JICAS mit den Feldern jicasurl jicastext jicasbeschreibung. Wählen Sie für URL den Feldtyp URL und für die anderen Felder Freitext.

Bedienung

Soll ein Artikel nun in JICAS erscheinen, müssen wir ihn hierfür vorbereiten. Dazu öffnen wir den Artikel und setzen zunächst den Haken bei "Top". Unter Eigene Felder füllen wir wie folgend aus:

jicasurl:

URL zu dem Bild, das im Hintergrund angezeigt werden soll. Sie sollten alle Bilder im gleichen Seitenverhältnis zuschneiden. Wir empfehlen 21:9. Beachten Sie, dass das Bild öffentlich zugänglich sein muss. Sollten Sie einen Bildspeicher mit Zuschneidefunktion benötigen, melden Sie sich gerne bei uns. Bitte beachten Sie: Sie sollten die Bilder über https:// einbinden, wenn Ihr Shop ebenfalls über eine gesicherte Verbindung läuft. Sonst wird die Verbindung als nicht sicher angezeigt.

jicastext:

Hier können Sie einen Call To Action Text eingeben.

jicasbeschreibung:

An dieser Stelle können Sie weitere Informationen eingeben, Videos einbinden usw.

Fragen und Einbau? Erweiterung? Änderung?

Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein!

Wie immer gilt: Wir übernehmen keine Haftung für das, was Sie mit unseren Projekten anstellen! ;)

Gelesen 526 mal Letzte Änderung am Sonntag, 17 September 2017 18:40
iotex

THE DIGITAL TECHNOLOGY EXPERTS

iotex.co

4 Kommentare

  • Kommentar-Link Super User Sonntag, 24 September 2017 13:59 gepostet von Super User

    Hallo Jens,

    wir haben dir nochmal alles per Mail erklärt. Anfragen gerne an support@iotex.co

  • Kommentar-Link Jens M. Freitag, 15 September 2017 06:16 gepostet von Jens M.

    Hallo zusammen,
    ich bin gerade dabei einen neuen Shop mit JTL Shop4 umzusetzen und bin auf eure sehr interessante "Möglichkeit" gestoßen. Da auch die JTL Cild-Templates noch Neuland für mich sind, habe ich offensichtlich Probleme, euer "Tool" richtig einzubauen.
    Ich habe mir das Gesamtpaket runtergeladen, in meinem (Child)-Templateordner einen Ordner "add" angelegt und dort die angepasste jicas.tpl platziert.
    Desweiteren habe ich mir die page/index.tpl kopiert und in das Child-Template root abgelegt und die add/jiclas.tpl eingebunden!
    Das Script jiclasslide.js liegt im js-Ordner von meinem Child-Template.
    Auch die eigenen Felder in JTL Wawi habe ich angelegt und gefüllt.
    Wo genau muss ich die anderen Dateien aus eurem Paket auf dem Server ablegen?
    Vielen Dank für eure Hilfe!

  • Kommentar-Link Super User Montag, 29 Mai 2017 14:10 gepostet von Super User

    Hey Sören,

    danke für das Feedback und sorry für die späte Antwort. Tatsächlich bin ich damit auch noch etwas unzufrieden - falls dir was dazu einfällt, ist deine Idee herzlich willkommen.
    Danke für den Kaffee, hat gut geschmeckt ;).
    Wir haben hierfür ein System mit dem SlimImageCropper aufgebaut - kannst du dir hier mal ansehen: http://slimimagecropper.com ist tatsächlich eine ziemlich solide Sache und lässt sich vielfach einsetzen!

  • Kommentar-Link Sören H. Donnerstag, 25 Mai 2017 13:00 gepostet von Sören H.

    Uff, habe lange nach sowas in der Art gesucht! :) Danke! Sieht super aus und funktioniert in unserer Testinstanz gut. Die Navigationsleisten sind schwierig - aber spontan weiß ich auch nicht, wie das besser geht.
    Wie würdet ihr denn Bilder online zuschneiden? Nur aus Interesse.
    Danke für die Arbeit - Google Alert hat heute echt mal was gebracht (ja, ich nutze das noch).
    Kaffee habt ihr sicher ;)

Schreibe einen Kommentar

Bitte achten Sie darauf, alle Felder mit einem Stern (*) auszufüllen. HTML-Code ist nicht erlaubt.

Made with ♥ in Freiburg im Breisgau

Copyright © 2017 by iotex freiburg - Alle Rechte vorbehalten!
Cookies erleichtern die Bereitstellung unserer Dienste. Mit der Nutzung unserer Dienste erklären Sie sich damit einverstanden, dass wir Cookies verwenden.
Weitere Informationen