# Teil 3 - Image-Slider-Dosts ändern

**URL:** <https://forum.shopware.com/t/teil-3-image-slider-dosts-andern/59191>\
**Category:** Themes & Design\
**Created:** [23. April 2019 um 07:54 UTC](https://forum.shopware.com/t/teil-3-image-slider-dosts-andern/59191 "2019-04-23T07:54:06Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Siggi123b](https://avatars.discourse-cdn.com/v4/letter/s/c89c15/32.png) [@Siggi123b](https://forum.shopware.com/u/Siggi123b)\
**Post date:** [23. April 2019 um 07:54 UTC](https://forum.shopware.com/t/teil-3-image-slider-dosts-andern/59191/1 "2019-04-23T07:54:06Z")

</div>

Guten Morgen liebes Forum,

ich bitte um Verständnis das ich nun mehrere Theres öffne. So finde ich es Sachlicher und bei einer Problemlösung besser zu finden, gerade für Mitglieder die Später so ähnlich auch haben möchten.

* * *

**Es geht um Design-Anpassungen und TPL Änderungen:**  
Ich finde das Design von [https://www.mifcom.de/](https://www.mifcom.de/) sehr schön, da ich auch im Bereich Technik bin find ich die Formen sehr gut und diese möchte ich gerne auch umsetzten.  
Nach einer Analyse habe ich auch herausgefunden das Mifcom sehr viele Bilder verwendet und „Relativ“ wenig Programmiert hat, i.d.m „Nicht alles ist Gold was Glänzt“.

&nbsp;

In diesem Beitrag möchte ich Folgendes umsetzten (Hinweis: Bin kein Programmierer und lerne gerade mit Shopware):

- Den&nbsp; **Image-Slider-Dosts** statt Punkte, **Striche** anzeigen zu lassen ideal auch als Parallelogramm

P.S, wenn es geht mit den Shopware Basics ohne hinzu zu Programmieren.

Bild als Referenz:

 ![](https://europe1.discourse-cdn.com/flex013/uploads/shopware/original/2X/8/8395283e17e8200483b6961dcac6e42f39cd66cb.png)

---

<div class="post-metadata">

**Author:** ![Murmeltier](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/murmeltier/32/16126_2.png) [@Murmeltier](https://forum.shopware.com/u/Murmeltier)\
**Post date:** [23. April 2019 um 16:13 UTC](https://forum.shopware.com/t/teil-3-image-slider-dosts-andern/59191/2 "2019-04-23T16:13:00Z")

</div>

In der Regel bestehen dieses DOTS eigentlich fast immer aus:

1. einem&nbsp;SVG Element
2. oder einem simplen DIV (oder SPAN) mit einem extremen border-radius (50%).

Wenn Du anstatt eine Kreises dann eben solch eine Form haben möchtest, musst Du also nur Dein SVG Element anpassen. Auch beim DIV ist so eine Form durchaus möglich…und&nbsp;zwar mit simplem CSS und dem Transform Befehl:

```
transform: skew(30deg, 0deg);

```

&nbsp;