# Quick-View-Element - warum gibt es dort keinen Close-Button?

**URL:** https://forum.shopware.com/t/quick-view-element-warum-gibt-es-dort-keinen-close-button/51122
**Category:** Allgemein
**Created:** [14. Februar 2018 um 10:08 UTC](https://forum.shopware.com/t/quick-view-element-warum-gibt-es-dort-keinen-close-button/51122 "2018-02-14T10:08:17Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![raschu](https://avatars.discourse-cdn.com/v4/letter/r/839c29/32.png) [@raschu](https://forum.shopware.com/u/raschu)
#### Post date: [14. Februar 2018 um 10:08 UTC](https://forum.shopware.com/t/quick-view-element-warum-gibt-es-dort-keinen-close-button/51122/1 "2018-02-14T10:08:17Z")

</div>

Hallo liebe Leute,

ich hab da mal ne Frage zum Quick-View-Element. Kann man dort eine Einstellung vornehmen, dass ein Close-Button z.B. oben rechts angezeigt wird, der dann das Element schließt?

Das Problem stellt sich besonders im Mobile-View: hier nimmt das Quick-View-Overlay fast den ganzen Bildschirm ein und der User muss auf den schwarzen Shop-Overlay “neben” dem Quick-View-Element tippen. Mich rief jetzt tatsächlich ein Kunde an, der fragte, wie er das Fenster wieder schließen kann …

![](https://europe1.discourse-cdn.com/flex013/uploads/shopware/original/2X/2/2ff24e262cf75ffc72d957a21f6a8cb59035dbed.jpeg)

---

<div class="post-metadata">

### Author: ![Artij](https://avatars.discourse-cdn.com/v4/letter/a/d6d6ee/32.png) [@Artij](https://forum.shopware.com/u/Artij)
#### Post date: [6. März 2018 um 11:23 UTC](https://forum.shopware.com/t/quick-view-element-warum-gibt-es-dort-keinen-close-button/51122/2 "2018-03-06T11:23:41Z")

</div>

Hey Raschu,&nbsp;

bin gerade am selben Problem dran und versuche es über die vorhanden Modal close oder andere Javascript Komponenten zu lösen.  
Ich will da ungern extra ein JS dafür schreiben wollen / müssen.&nbsp;

We will see.

Gruß  
Artij

---

<div class="post-metadata">

### Author: ![raschu](https://avatars.discourse-cdn.com/v4/letter/r/839c29/32.png) [@raschu](https://forum.shopware.com/u/raschu)
#### Post date: [7. März 2018 um 11:21 UTC](https://forum.shopware.com/t/quick-view-element-warum-gibt-es-dort-keinen-close-button/51122/3 "2018-03-07T11:21:19Z")

</div>

Hier mal meine Lösung nach tagelangem stöbern und ausprobieren.  
Ohne Gewähr aber funktioniert:

1. im eigenen theme folgenden Ordner anlegen: mytheme\widgets\swag\_emotion\_advanced

2. darin die Datei index.tpl mit folgendem Inhalt anlegen (Bsp):

Dadurch wird die Quelldatei im Plugin SwagEmotionAdvanced überschrieben, die den Inhalt des QuickView-Elements erzeugt.

1. button mit css stylen:

2. EventHandler in eigener js-Datei ergänzen (meine sieht dann so aus und kommt ins Verzeichnis eigenestheme\frontend\_public\source\js:)

Entscheidend ist die Zeile in der Mitte des Codes:

```
me.$quickView.on(me.getEventName('click'), '#button-closeQuickView', $.proxy(me.hideQuickView, me));

```

diese setzt den Eventhandler auf den Button.

1. in der theme.php eintragen:

Dadurch überschreibt das eigene theme das Plugin.

Und dort natürlich auch die js-Datei einbinden:

```
protected $javascript = [.....];

```

Die Einbindung des Eventhandler geht bestimmt auch eleganter als gleich die ganze Plugin-Funktion zu überschreiben. Vielleicht hat ja da jemand eine bessere Idee?

Ergebnis sieht dann so aus:

 ![](https://europe1.discourse-cdn.com/flex013/uploads/shopware/original/2X/0/05b09b6ddb2e3d6290e8068786352b2f52d66334.jpeg)

---

<div class="post-metadata">

### Author: ![Artij](https://avatars.discourse-cdn.com/v4/letter/a/d6d6ee/32.png) [@Artij](https://forum.shopware.com/u/Artij)
#### Post date: [7. März 2018 um 15:33 UTC](https://forum.shopware.com/t/quick-view-element-warum-gibt-es-dort-keinen-close-button/51122/4 "2018-03-07T15:33:54Z")

</div>

Ja diesen Lösungsansatz will ich gerade vermeiden.

Bei den Schritten 1-3 bin ich deiner Meinung so vorzugehen.  
Jedoch würde ich nicht über ID trotz JS&nbsp;gehen sondern eine zusätzliche eigene CSS Klasse im camelCase anlegen und diese dann bearbeiten.

Ich versuche mit dem JS einen anderen Ansatz und gebe die Lösung dann weiter…

Gruß  
Artij
