# Artikelbild Gesamtansicht verkleinern? Als Lightbox?

**URL:** <https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771>\
**Category:** Allgemein\
**Created:** [5. April 2016 um 07:41 UTC](https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771 "2016-04-05T07:41:02Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![thering](https://avatars.discourse-cdn.com/v4/letter/t/8e7dd6/32.png) [@thering](https://forum.shopware.com/u/thering)\
**Post date:** [5. April 2016 um 07:41 UTC](https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771/1 "2016-04-05T07:41:02Z")

</div>

Guten Tag,

Aktuell (standardmäßig) wird das Artikelbild, nach Klicken des Thumbnails, auf der kompletten Bildschirm angezeigt und läst sich nur durch Xen oben rechts wegklicken.

**Gibt es eine Einstellung im BackEnd oder kann mir jmd die Datei nennen** , wo man das einstellen kann?

Am besten soll das Fenster so beibehalten werden - allerdings zentriert angezeigt mit je 20% Abstand zur Bildschirmrand…

&nbsp;

---

<div class="post-metadata">

**Author:** ![thering](https://avatars.discourse-cdn.com/v4/letter/t/8e7dd6/32.png) [@thering](https://forum.shopware.com/u/thering)\
**Post date:** [5. April 2016 um 07:52 UTC](https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771/2 "2016-04-05T07:52:35Z")

</div>

Sorry ^^ erst denken, dann fragen.

.js–modal{

max-width: 80%;

max-height: 80%;

}

ist die Lösung.

---

<div class="post-metadata">

**Author:** ![simkli](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/simkli/32/13124_2.png) [@simkli](https://forum.shopware.com/u/simkli)\
**Post date:** [5. April 2016 um 08:03 UTC](https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771/3 "2016-04-05T08:03:15Z")

</div>

Vielleicht solltest du dir überlegen, dass du die CSS Regeln erst ab einer Bildschirmgröße von " \> Tablet " aktivierst. Auf einem kleinen Handydisplay soll die Modalbox doch die volle Größe einnehmen oder?

```
@media screen and (min-width: @tabletLandscapeViewportWidth) {
  .js--modal {
    max-width: 80%;
    max-height: 80%;
  }
}

```

&nbsp;

---

<div class="post-metadata">

**Author:** ![thering](https://avatars.discourse-cdn.com/v4/letter/t/8e7dd6/32.png) [@thering](https://forum.shopware.com/u/thering)\
**Post date:** [5. April 2016 um 08:36 UTC](https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771/4 "2016-04-05T08:36:21Z")

</div>

@simkli‍ sehr überragend!

Das hatte mich auch etwas gestört, dass es überall dann diesen Abstand hat - also auch auf de Smartphone. Aber das hat sich ja dank deiner aUfmerksamkeit wie von selbst gelöst.

Vielen Dank für den Hinweis 🙂

---

<div class="post-metadata">

**Author:** ![dooni](https://avatars.discourse-cdn.com/v4/letter/d/49beb7/32.png) [@dooni](https://forum.shopware.com/u/dooni)\
**Post date:** [16. Oktober 2017 um 20:47 UTC](https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771/5 "2017-10-16T20:47:06Z")

</div>

Hallo, der Thread ist nun schon ewas älter, aber mein Problem noch aktuell.

Ich verstehe nicht, in welche Datei dieser Code hin soll.

Danke für den Tipp&nbsp; ![Undecided](https://forum.shopware.com/plugins/CKEditor/plugins/smiley/images/undecided.png "Undecided")

---

<div class="post-metadata">

**Author:** ![sschreier](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/sschreier/32/23296_2.png) [@sschreier](https://forum.shopware.com/u/sschreier)\
**Post date:** [16. Oktober 2017 um 21:02 UTC](https://forum.shopware.com/t/artikelbild-gesamtansicht-verkleinern-als-lightbox/35771/6 "2017-10-16T21:02:57Z")

</div>

Hallo,

der Code kommt in eine eigene LESS-Datei im **eigenen** Theme, siehe: [Getting started with Shopware templating](https://developers.shopware.com/designers-guide/getting-started/#add-less-files) .

Beste Grüße

Sebastian