Neu Modal von eigener Produktliste auf Startseite aufrufen

[zentiva]

Hallo,

wie kann ich denn die Vorschau eines Artikels ähnlich des Quickview auf der Artikelliste aufrufen?

Mit class="popup" bleibt der Inhalt leer. Wie muss ich den Link übergeben oder was muss ich sonst noch beachten?

 

[FPrüfer]

Hallo,
ein einfacher Link reicht dafür nicht aus. Das Grundgerüst, um einen Artikel per modalem Quickview anzuzeigen sieht in etwa so aus:

<div id="result-wrapper">
    <div id="result-wrapper_buy_form_uniqueID">
        <a class="quickview image-content" data-src="url_des_artikels" data-target="buy_form_uniqueID" href="url_des_artikels">Artikelvorschau</a>
    </div>
</div>

Wenn es auf der Seite bereits einen Container #result-wrapper gibt (Das ist z.B. bei allen Artikellisten der Fall), dann kann/muss dieser weggelassen werden. Innerhalb von #result-wrapper können dann mehrere #result-wrapper_buy_form_uniqueID Container platziert werden, wobei dort das uniqueID durch eine eindeutige ID (am besten die Artikel-ID oder Artikelnummer) ersetzt werden muss.

 

[zentiva]

Vielen Dank!
Das funktioniert nun super... Wenn da nicht noch eine kleine Sache wäre...
Wenn sich das Modal öffnet, steht da kurz "undefinied" und dann wird der Inhalt geladen.
Irgendeine Idee woran das liegen könnte?

 

[FPrüfer]

Irgendeine Idee woran das liegen könnte?

Der Quickview-Loader holt sich die Überschrift und das Bild aus der Artikeldefinition um diese bereits anzuzeigen während im Hintergrund die Artikeldetails geladen werden. Da diese Informationen in dem Minimal-Wrapper nicht enthalten sind, wird kurz das "undefined" angezeigt. Um das zu vermeiden, kann man z.B. den Link selbst als image-content auszeichnen - also die class="quickview" zu class="quickview image-content" erweitern. Ich passe es im Code meines Post mal noch entsprechend an.
Wenn an Stelle des Link-Inhaltes irgendein anderer Text angezeigt werden soll, dann kann man auch einfach noch einen zusätzlichen Tag mit der Klasse "image-content" in den Wrapper setzen.

 

[zentiva]

Das hat prima geklappt! Jetzt wird einfach schon der Titel des Artikels angezeigt, bis der Inhalt geladen ist.

Vielen Dank für die Hilfe!

 

[301Moved]

Hallo,
ein einfacher Link reicht dafür nicht aus. Das Grundgerüst, um einen Artikel per modalem Quickview anzuzeigen sieht in etwa so aus:

<div id="result-wrapper">
    <div id="result-wrapper_buy_form_uniqueID">
        <a class="quickview image-content" data-src="url_des_artikels" data-target="buy_form_uniqueID" href="url_des_artikels">Artikelvorschau</a>
    </div>
</div>

Wenn es auf der Seite bereits einen Container #result-wrapper gibt (Das ist z.B. bei allen Artikellisten der Fall), dann kann/muss dieser weggelassen werden. Innerhalb von #result-wrapper können dann mehrere #result-wrapper_buy_form_uniqueID Container platziert werden, wobei dort das uniqueID durch eine eindeutige ID (am besten die Artikel-ID oder Artikelnummer) ersetzt werden muss.

Das ist ziemlich cool, aber...
... hab ich in einer Artikelseite versucht. Beim Laden des Modals wird kein Artikelbild geladen, dafür das auf der Artikelseite "gelöscht", sprich keines mehr angezeigt, wenn man das Modal schließt. Lässt sich das verhindern/optimieren?
... hab ich im Warenkorb versucht. Da klappt das soweit einwandfrei. Außer, dass, wenn das Modal einfach geschlossen wird, kein Reload des Warenkorbs passiert. Man sieht also nicht, dass der Artikel in den Warenkorb gelegt wird.

Wenn beides ginge, wäre das ziemlich cool für Zusatzverkäufe.