Eigene Altersklassen hinterlegen

Standardmäßig enthält der Shop die Altersfreigabeklassen der USK. Diese werden als Siegel in der Artikeldetailansicht im Shop dargestellt, wenn dem Artikel im Reiter Onlineshop der Artikelverwaltung ein korrespondierender Wert im Feld "Altersfreigabe" eingetragen wird.

Wird also der Altersfreigabewert von 16 hinterlegt, erscheint folgender Hinweis im Shop:

Es kann aber auch vorkommen, dass andere Kennzeichen hinterlegt werden sollen, die nicht über das System der Energieeffizienzklassen gesteuert werden sollen.

Im Folgenden wird eine Einrichtung einer neuen Altersklasse anhand der Kennzeichnung der Spielzeugrichtlinie durchgeführt.

---

Vorbemerkung

Die Richtlinie 2009/48/EG des Europäischen Parlaments und des Rates vom 18. Juni 2009 (auch "Spielzeugrichtlinie" genannt) fordert in Anhang V, Teil B eine Kennzeichnung für Spielzeug, welches nicht für Kinder bis zu einem Alter von 36 Monaten bestimmt ist.

Derartige Produkte müssen bspw. mit folgendem Kennzeichen versehen werden:

Template anpassen

Grafik hinterlegen

Im Template-Ordner \nav\icons muss die neue Grafik hinterlegt werden.

Diese sollte vom Dateityp PNG sein und die Abmaße 40 x 40 px haben, um sich in das bestehende Informationsgefüge der Artikeldetailansicht einzufügen.

In unserem Beispiel also diese:

[image:altersklassen-03.png|verweis=]

Template-Datei erstellen

aktuellen Template-Satz herunterladen im Shop-Management unter Shop-Design > Shop-Templates

Ordner: \templ

neue Datei: altersflag_3.htm

<div class="agerating agerating_3" title="{s}Nicht f&uuml;r Kinder unter drei Jahren geeignet.{e}">
<span class="icon-spielzeug3"></span>
<div class="text font--small"><br>
{s}Nicht f&uuml;r Kinder unter drei Jahren geeignet.{e}
</div>
</div>

CSS hinterlegen

im Shop-Management unter Design und Darstellung > Shop-Design > Erweiterung durch individuelle CSS-Inhalte > CSS - Anfang

.agerating_3 {
  font-size:0.9em;
}

.agerating_3 .icon-spielzeug3 {
  background-image:url(../nav/icons/unter3.png);
  background-repeat:no-repeat;
  width:40px;
  height:40px;
  display:block;
  background-position:0 0;
}

.agerating_3 .text {
  padding-left:44px;
  margin-top:-40px;
}