---
title: "Inner Wrap von Bildelement - Klasse hinzufügen - Layout 1"
url: "https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1"
source: "typo3.net"
tags: ["TYPO3","TypoScript","Bilder","Frage","Inhaltselemente"]
created: "2012-05-25"
last_reply: "2013-04-15"
replies: 7
solved: false
page: 1
pages: 1
lang: "de"
---

# Inner Wrap von Bildelement - Klasse hinzufügen - Layout 1

TYPO3 › TypoScript · 7 Antworten · gestartet 2012-05-25

## Eröffnungsbeitrag

**icke_der_tolga** · 2012-05-25 · [Beitrag #1](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/1)

Typo3 4.6.8
Templavoila

Hallo, ich möchte einem Bildelement eine Klasse hinzufügen, die sich "innerhalb" des Bildes befindet ala

```html
<img class="a" src="#">
```

Idealerweise von den Bildern, wo ich im Erscheinungsbild "Layout 1" oder wo ich eine andere Spezifizierung (Ausrichtung unten rechts o.ä.) eingestellt habe (so dass nicht alle Bilder die Klasse erhalten). Ich brauche die Klasse innerhalb des Bildes für eine jquery-Anfrage.

Im Typoscript Object Browser kann ich die divs (z.B. csc-textpic etc.)  ansprechen, die das Bild umgeben. Ich brauche aber eine Klasse innerhalb des Bildes.

Vielleicht irgendwie sowas in der Richtung? (Ich selber bin kein Typoscript-Experte und versuche mir zusammenzubasteln aus diversen Antworten)

```typoscript
tt_content.stdWrap.innerWrap.cObject.20 =< tt_content.stdWrap.innerWrap.cObject.default
tt_content.stdWrap.innerWrap.cObject.20.15.value = a
```

Das funktioniert aber schonmal nicht :-(

Über Hilfe, Tipps, Verweise, Suchwörter o.ä. würde ich mich freuen.
Tolga

## Antworten

### [#2](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/2) · icke_der_tolga · 2012-05-25

Also mit

```typoscript
tt_content.image.20.1.params = class = "a"
```

kann man schonmal Bilder mit der Klasse "a" versehen. Das ist ja schonmal gut. Aber wie bekomme ich es abhängig vom "Content Element Layout" von einem Text/Bild-Element hin? Folgendes geht leider nicht:

```typoscript
[globalVar=TSFE:content|layout=1]
tt_content.image.20.1.params = class = "a"
[global]
```

Kann mir Jemand weiterhelfen? Das wäre spiiiitze! :-)

### [#3](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/3) · icke_der_tolga · 2012-05-25

Im Prinzip bräuchte ich sowas in der Art

```typoscript
    tt_content.stdWrap.innerWrap.cObject{
            key.field = layout
           
            1 = TEXT
            1.value = <div class="innerLeft"> | </div>
    }
```

Nur anstatt einem Div, was das Bild umschließt halt sowas

```typoscript
tt_content.image.20.1.params = class = "a"
```

Ich denke jetzt mal laut, weil mir ja wahrscheinlich in diesem Leben keiner mehr mit dieser Angelegenheit weiterhilft. :-) Mal gucken, vielleicht komme ich so ja auf die Lösung...

### [#4](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/4) · icke_der_tolga · 2012-05-26

Ich komme nicht weiter #angry#

Wie kann ich

```typoscript
tt_content.image.20.1.params = class = "a"
```

von einem Wert des Bildelementes abhängig machen? Die Klasse "a" darf nicht in allen Bildern auftauchen. Ich sehe nur folgende Möglichkeiten:

1. vom "Content Element Layout" abhängig machen
2. von der ausrichtung des Bildes abhängig machen

Help

### [#5](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/5) · TimoF · 2012-06-21

genau vor dem gleichen problem stehe ich im moment auch. hast du schon eine lösung gefunden?

### [#6](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/6) · TimoF · 2012-06-21

ich habe jetzt für mich eine lösung gefunden. eigentlich recht simpel.

ich habe die image frames aktiviert: (grafische rahmen)

```typoscript
TCEFORM.tt_content.image_frames.disabled=0
TCEFORM.tt_content.image_frames.removeItems = 1,2,3,4,5,6,7,8
TCEFORM.tt_content.image_frames.addItems.10 = runde Ecken
```

dann im setup mache ich:

```typoscript
tt_content.image.20.1.params.field = image_frames
tt_content.image.20.1.params.if.isTrue.field = image_frames
tt_content.image.20.1.params.wrap = class="imageFrames-|"
```

wenn ich jetzt bei den neu aktivierten image frames "runde Ecken" auswähle, bekommen die bilder die klasse "imageFrames-10".
wenn ich bei image frames "keine" auswähle (default), bekommt das bild keine klasse. weil der wert 0 ist und die bedingung nicht greift.

so kannst du dann in deiner jquery abfrage auf "imageFrames-10" prüfen. und du kannst auch noch 11, 12, 13 etc. hinzufügen und diese auch mit jquery abfragen.

### [#7](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/7) · triskal · 2013-04-15

Danke, super Tipp!! Hab auch gerade überlegt, wie ich eigene Klassen in die img-Tags bekomme. Über die image-Frames schnell realisierbar.

Oft wird die Notwendigkeit hierfür in Frage gestellt, da TYPO3 alle Elemente bereits mit ausreichenden Klassen und Wraps ausstattet. Ist auch super so. War für mich jahrelang ausreichend. Jetzt aber habe ich drei Kontent-Elemente, alle gleich, alle mit Text im Bild. Nur eines dieser Elemente hat eine Badge-Grafik im Bild, die ich per CSS drüberlegen muss.

VG, triskal

### [#8](https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1/8) · rookie_37 · 2013-04-15

Du könntest das Ganze auch über Bildeffekte lösen:

Hierfür musst der Auswahlliste für Effekte (siehe Screenshot) weitere Effekte hinzufügen. Dies kannst du mit folgendem Eintrag ins TSconfig deiner Root-Seite (oder, wenn es nur auf bestimmten Seiten benötigt wird, ins TSconfig der entsprechenden Seiten):

```typoscript
TCEFORM.tt_content.image_effects.addItems {
30 = Klasse a
31 = Klasse b
32 = Klasse c
}
```

Anschliessend kannst du diese Effekte normal via Typoscript  (im Setup, nicht mehr im TSconfig) konfigurieren:

```typoscript
tt_content.image.20.1.params.cObject = CASE
tt_content.image.20.1.params.cObject {
  key.field = image_effects
  30 = TEXT
  30.value = class="a"
  31 = TEXT
  31.value = class="b"
  32 = TEXT
  32.value = class="c"
}
```

Somit kannst du deinen Bildern leicht und sehr flexibel spezielle Klassen zuweisen (unabhängig vom Layout) und du erhältst HTML wie von dir eingangs gewünscht:

```html
<img class="a" src="#">
```

Es entstehen keine zusätzlichen Wraps.

[Bild: \[upl-image-preview uuid=42db40ab-1ada-5deb-b0e6-1156d9d7c0d6 url=https://www.typo3.net/assets/files/typo3net/1134-img_effect.png alt=img_effect.png thumbnail_url=https://www.typo3.net/assets/files/typo3net/1134-img_effect.png\]](https://www.typo3.net/assets/files/typo3net/1134-img_effect.png)

---

Quelle: „Inner Wrap von Bildelement - Klasse hinzufügen - Layout 1“, typo3.net, https://www.typo3.net/d/110744-inner-wrap-von-bildelement-klasse-hinzufuegen-layout-1
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.
