Neu Evo-Template: Infomessage beim ersten Aufruf einblenden

  • Temporäre Senkung der Mehrwertsteuer Hier findet ihr gesammelt alle Informationen, Videos und Fragen inkl. Antworten: https://forum.jtl-software.de/threads/mehrwertsteuer-senkung-vom-01-07-31-12-2020-offizieller-diskussionthread-video.129542/

Helge77

Aktives Mitglied
16. Oktober 2017
34
0
Hallo zusammen,

ich würde gerne ein Infofenster einblenden, was bei mir im Shop alles neu im Januar kommt. Dieses Infofenster soll als Modalwindow eingeblendet werden, wenn der User das erste Mal auf den Shop kommt, also entweder Startseite oder auch andere Einstiegsseiten.
Ist sowas möglich und wenn ja wie und wo im Template-Code?
 

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
4.701
780
Berlin
Weil gestern Weihnachten war :)

Ich habe zwei Sprachvariablen die du im Shop anlegst.
cssModalInfoHeadline = die Überschrift vom Modalen Hinweis
cssModalInfo = der eigentliche Text vom Hinweis.
die Variable timeoutcssModalInfo bestimmt die Zeit wie lange es dauert bis das Fenster angezeigt wird.

ist die Variable cssModalInfo leer wird kein Hinweis erscheinen, änderst du diesen Text, dann bekommt jeder
User diesen Hinweis neu angezeigt, egal ob er 5 Minuten vorher schon einen Hinweis angezeigt bekommen hatte
Nach einem Monat verfällt der Cookie und der Hinweis würde neu angezeigt werden

Die Stylesheets in meinem Code kannst du dann anpassen und in deinen eigenen Stylesheets einfügen.

Binde das hier in einer der immer geladenen tpl Dateien am Ende ein, footer / header / index.tpl egal, am besten ist es du machst dir eine Extra Datei in snippets und includest die dann einfach nur irgendwo im Child template.
Code:
{lang key=cssModalInfoHeadline section=custom assign=cssModalInfoHeadline}
{lang key=cssModalInfo section=custom assign=cssModalInfo}
{assign var='cssMD5ModalInfoHash' value=$cssModalInfo|md5}
{assign var='timeoutcssModalInfo' value=1000}

{if !empty($cssModalInfo) && (empty($smarty.cookies.cssModalInfo) || $smarty.cookies.cssModalInfo!=$cssMD5ModalInfoHash)}
    <div class="modal fade" id="cssModalInfo" role="dialog"  >
      <div class="modal-dialog ">
        <div class="modal-content">
         <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">{$cssModalInfoHeadline}</h4>
          </div>
          <div class="modal-body">
          {$cssModalInfo}
          </div>
        </div>
      </div>
    </div>
<script>

function cssDefer(toWaitFor, method) {
  if (window[toWaitFor] && (typeof $().emulateTransitionEnd == 'function') === true && (typeof $().modal == 'function') === true) {
      method();
  } else {
        if(window[toWaitFor]) {
        }
      setTimeout(function () { cssDefer(toWaitFor, method) }, 300);
  }
}

function waitFor() {
    cssDefer('jQuery', () => {
        startCSSModalPopup();   
  });
}

waitFor();

function startCSSModalPopup() {
    console.log("starte meine Funktionen");
    setTimeout(function () { $("#cssModalInfo").modal('show'); }, {$timeoutcssModalInfo});

}

var exdate=new Date();
exdate.setDate(exdate.getDate() + 30);
document.cookie = 'cssModalInfo={$cssMD5ModalInfoHash}; expires='+exdate.toUTCString()+' ; path=/';


</script>

<style>
@media(min-width:1000px) {
    #cssModalInfo .modal-dialog {
        width:800px;
    }
}

#cssModalInfo.modal {
  text-align: center;
  padding: 0!important;
}
#cssModalInfo.modal:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;
}
#cssModalInfo .modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}
</style>
{/if}
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: wum-plus
Ähnliche Themen Forum Antworten Erstelldatum des Themas
Gelöst Im JTL-Shop5.0.0 rc3 fehlt das EVO Template Gelöste Themen in diesem Bereich 3
Neu Die Master v. 02.10.2020 und das EVO Template? JTL-Shop - BETA - Feedback und Bugmeldungen 4
Gelöst Footer bearbeiten/Content verschieben in Shop 4 mit Evo Template Gelöste Themen in diesem Bereich 4
Neu EVO-Template Kategorie- und Banner Anzeige bzw. Design Templates für JTL-Shop 0
Neu Die "alte Leier": EVO Template der schwarze Footer-Hintergrund muss weg! Templates für JTL-Shop 3
Neu EVO-Template für ebay anpassen User helfen Usern 1
Neu Evo, Nova oder anderes Template? Templates für JTL-Shop 1
Neu Sprachauswahl im EVO Template - Drop Down in jeweiliger Landessprache User helfen Usern 0
Neu Template EVO Sprachauswahl Mobile unsichtbar Templates für JTL-Shop 4
Neu JTL-Shop5 - Wielange wird das EVO Template unterstützt? Allgemeine Fragen zu JTL-Shop 6
Neu Template EVO Allgemeine Fragen zu JTL-Shop 4
Neu Bewertungen in der Übersicht anzeigen lassen JTL Shop Evo-Template Allgemeine Fragen zu JTL-Shop 2
Neu evo live styler speichert nicht mehr JTL-Shop - Fehler und Bugs 0
Neu JTL Evo-Editor Plugins für JTL-Shop 0
Gelöst Evo Merkmalfilter – einzelne Merkmale ausblenden Templates für JTL-Shop 4
Neu Gute Alternative zum Evo Banner oder Slider? Mit Text und Buttons Templates für JTL-Shop 4
Neu Evo LiveStyler Variable verschwunden Technische Fragen zu Plugins und Templates 0
Neu Evo Custom 4.05 - Pfad zum Header User helfen Usern - Fragen zu JTL-Wawi 1
Neu EVO: Farbe der Buttons "Anmeldung" und "Warenkorb" ändern Einrichtung von JTL-Shop 1
Gelöst EVO Design ändern /JTL Adept eBay-Designvorlagen - Ideen, Lob und Kritik 4
Neu Bestehendes Template kopieren und als Child verwenden!? Wie geht das? Templates für JTL-Shop 0
Neu Bilder in Plugin-Template importieren Plugins für JTL-Shop 0
Abgelehnt JTL Shop 5 template Gelöste Themen in diesem Bereich 1
Neu Nova Template Kopf gestaltung JTL-Shop - BETA - Feedback und Bugmeldungen 31
Neu Template für WooCommerce WooCommerce-Connector 0
Gelöst Gelöst: Eigenes Child-Template beim Release Candidate v5.0.0.rc3 JTL-Shop - BETA - Feedback und Bugmeldungen 8
Neu Template Entscheidung ?? Templates für JTL-Shop 8
Gelöst Shop-Update 3 auf 4 - DB- & Template-Probleme Gelöste Themen in diesem Bereich 2
Neu JTL zu Shopware Artikel Template definieren Shopware-Connector 0
Neu NOVA - Template wird nicht angezeigt JTL-Shop - BETA - Feedback und Bugmeldungen 4
Neu Kostenlose Template Shop4 Templates für JTL-Shop 1
Neu Template Templates für JTL-Shop 1
Ähnliche Themen