Overlay Content reinladen

Shopware 5 Themes & Design
1

Heyho - ich frage mich gerade wie ich etwas in das overlay div reinpacken kann. Eine Funktion scheint es da nicht zu geben oder einen Template Block, oder übersehe ich etwas ? Alternative wäre per jQuery append beim overlay.open in .js–overlay etwas reinzuladen. Wie ich finde aber relativ unschön. Gibts eine andere Möglichkeit die ich übersehen habe ? Alternativ gibt es ja auch noch das modal - Nur kann ich ja hier per JS kein smarty Template laden.

2

Hi kayyy,

würde mich auch interessieren. Wie hast du das gelöst?

3

inhalt in einer Modalbox geht so:

    text zum öffnen
    {*
        mit klick auf den oberen text wird jetzt eine Modalbox geöffnet mit dem Inhalt
        der folgenden `div.deinSelector` 
        beispielhaft habe ich hier ein snippet eingebunden
    *}
    
       {s name="foobar" namespace="frontend/index/foobar"}foobar{/s}

Du könntest auch bestimmte Inhalte bei jedem öffnen der Modal laden

var myModalConfig = {
    // lädt 2 icons, wird als javascript escaped
    // andere smarty funktionen auch möglich
    foo: '{"{include file='frontend/_helper/icon.tpl' icon='arrow_left'}"|escape:javascript}',
    bar: '{"{include file='frontend/_helper/icon.tpl' icon='arrow_left'}"|escape:javascript}',
}

// häng dich an die init method an 
// falls du eine andere methode zum subsciben brauchst, 
// unter frontend/_public/src/js/jquery.modal.js findest du das Javascript Module
$.subscribe('plugin/swModal/onInit', function(){
    // `this` context is in dem Fall $.modal
    // beispielhaft die oben erstellten Daten eingebunden
    this._$content.append(myModalConfig.foo);
    this._$content.prepend(myModalConfig.bar);
});

Je nachdem in was für einer Umgebung du arbeitest, kann es möglich sein, das du die Templates neu generiern musst, da sonst die Daten nicht bereitgestellt werden. Ich empfehle nicht in den JS Modulen von Shopware zu arbeiten, es sei denn du weißt genau was du tust und kannst die funktionalität jederzeit (auch nach updates) wieder herstellen. Mit $.subscribe() solltest du dich an den wichtigsten stellen im Code einhooken können, um deine eigene Funktionalität zu schaffen.

2 „Gefällt mir“
4

Vielen Dank, das gucke ich mir mal an!