Wrapping image url in typo3 - typo3

Question

I used the typoscript below, only the image is not wrapped in <img src="|" class="tip-image" alt="">, it only generates the image url. Out is shown below. What do I wrong?
tipmenu = HMENU
tipmenu.special = directory
tipmenu.special.value = 8
tipmenu {
1 = TMENU
1 {
expAll = 1
wrap = <div class="left_links">|</div>
NO {
stdWrap.cObject = COA
stdWrap.cObject {
10 = FILES
10 {
references {
data = levelmedia:-1, slide
}
renderObj = COA
renderObj {
10 = IMG_RESOURCE
10 {
file.import.data = file:current:publicUrl
file.maxW = 50
file.maxH = 50
}
}
}
10.wrap = <img src="|" class="tip-image" alt="">
20 = TEXT
20.field = title
20.wrap = <span class="tip-title">|</span>
30 = TEXT
30.field = subtitle
30.wrap = <span class="tip-subtitle">|</span>
}
}
}
}
Hereby the html output:
<div class="left_links">
<a href="tips/verhalen-van-klanten/">
fileadmin/_processed_/csm_klanten_e92ee310e0.png
<span class="tip-title">Verhalen van klanten</span>
<span class="tip-subtitle">Wat vind jij?</span>
</a>
</div>

Answer 1

FILES has no wrap. Use your wrap inside a stdWrap.
10.stdWrap.wrap = <img src="|" class="tip-image" alt="">
Some hints:
Maybe you should add a maxItems = 1 inside Files. If an editor inserts two or more images the output would look like this: <img src="image1.jpgimage2jpgimage3.jpg" class="tip-image" alt="">
You do not need the COA. Use the IMG_RESOURCE directly unless there is a reason for the COA.
renderObj = IMG_RESOURCE
renderObj {
file.import.data = file:current:publicUrl
file.maxW = 50
file.maxH = 50
}