---
title: "HTML Data Attribut bei Bildern"
url: "https://www.typo3.net/d/120300-html-data-attribut-bei-bildern"
source: "typo3.net"
tags: ["TYPO3","TypoScript","Frage"]
created: "2015-06-03"
last_reply: "2015-06-03"
replies: 2
solved: true
page: 1
pages: 1
lang: "de"
---

# HTML Data Attribut bei Bildern

TYPO3 › TypoScript · 2 Antworten · gelöst · gestartet 2015-06-03

## Frage

**knutwiler** · 2015-06-03 · [Beitrag #1](https://www.typo3.net/d/120300-html-data-attribut-bei-bildern/1)

Hallo!

Ich habe folgendes Rendering für Bilder:

```typoscript
tt_content.image.20 {
  addClassesCol.override >
  addClassesCol.override.cObject = CASE
  addClassesCol.override.cObject {
    key.field = imagecols
    default = TEXT
    default.value = large-12 
    1 = TEXT
    1.value = small-12 medium-12 large-4 columns 
    2 = TEXT
    2.value = small-12 medium-6 large-6 columns portfolio
    3 = TEXT
    3.value = small-12 medium-4 large-4 columns portfolio
    4 = TEXT
    4.value = small-6 medium-6 large-3 columns 
    6 = TEXT
    6.value = large-2 columns                             
    12 = TEXT
    12.value = large-1 column
  }
```

Dies ergibt z.B. die folgende HTML Ausgabe:
<div class="csc-textpic-imagecolumn small-12 medium-4 large-4 columns portfolio">

Wie kann ich nach der klasse ein html5 Data Attribut wie z.B. data-equalizer-watch hinzufügen, so dass es später z.B. zur folgenden Ausgabe kommt:

<div class="csc-textpic-imagecolumn small-12 medium-4 large-4 columns portfolio" data-equalizer-watch>

Ich bin froh um jeden Hinweis. Vielen Dank.

## Beste Antwort

**knutwiler** · 2015-06-03 · [Beitrag #3](https://www.typo3.net/d/120300-html-data-attribut-bei-bildern/3)

Danke Chrissli

Bin inzwischen auf eine Alternative Lösung gestossen und habe das Image Rendering von CSS Styled Content entsprechend angepasst.

```typoscript
tt_content.image.20 {
  addClassesCol.override >
  addClassesCol.override.cObject = CASE
  addClassesCol.override.cObject {
    key.field = imagecols
    default = TEXT
    default.value = large-12 
    1 = TEXT
    1.value = small-12 medium-12 large-4 columns 
    2 = TEXT
    2.value = small-12 medium-6 large-6 columns portfolio
    3 = TEXT
    3.value = small-12 medium-4 large-4 columns portfolio
    4 = TEXT
    4.value = small-6 medium-6 large-3 columns 
    6 = TEXT
    6.value = large-2 columns                             
    12 = TEXT
    12.value = large-1 column
  }
  rendering {
    splitCaption.columnStdWrap.wrap = <div class="csc-textpic-imagecolumn ###CLASSES###" data-equalizer-watch> | </div>
}
```

## Antworten

### [#2](https://www.typo3.net/d/120300-html-data-attribut-bei-bildern/2) · Chrissli · 2015-06-03

Aus deinem "CASE" ein COA machen, dass
als Inhalt einmal das jetzige "CASE" enthält und anschliessend z.b. ein "TEXT"-Object?

### [#3](https://www.typo3.net/d/120300-html-data-attribut-bei-bildern/3) · knutwiler · 2015-06-03 · Beste Antwort

(Text siehe oben unter „Beste Antwort“.)

---

Quelle: „HTML Data Attribut bei Bildern“, typo3.net, https://www.typo3.net/d/120300-html-data-attribut-bei-bildern
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.