1. HTML:


<ul class="nostyle">


<li class="checkmark" style="text-align: left;"><i class="icon--check">&nbsp;</i><strong>Vorteil 1</strong></li>

<li class="checkmark" style="text-align: left;"><i class="icon--check">&nbsp;</i><strong>Vorteil 2</strong></li>

<li class="checkmark" style="text-align: left;"><i class="icon--check">&nbsp;</i><strong>Vorteil 3</strong></li>

<li class="checkmark" style="text-align: left;"><i class="icon--check">&nbsp;</i><strong>Vorteil 4</strong></li>

</ul>

 

“Vorteil X” ersetzen Sie durch eigenen Text. Die Zeilen von <li… bis  …/li>  können beliebig oft wiederholt werden.

 

2. CSS-Klasse in Einkaufswelt: ekw_w_o_border

 

 


Technische Hinweise:

CSS:

ul.nostyle {
    list-style:none !important;
    margin-left: -17px !important;
}

.ekw_w_o_border .panel.has--border{
border: none;
}

.ekw_w_o_border .panel--body.is--wide {
    padding: 0;
}


i.icon--check {
    color: #2ab9ce;
}

.checkmark {
padding-left: 25px !important;

}

.icon--check {
    margin-left: -20px;
}

Wichtig:

Funktioniert nur mit Erweiterter TinyMCE

 

Weitere Links:

https://developers.shopware.com/styletile/components.html#icon-set

https://developers.shopware.com/designers-guide/responsive-theme-default-components/#icons