Hallo zusammen,
sorry, hab mich in der Überschrift verschireben. Es handelt sich um das Seitenelement "Bild"
Irgendwie bekomme ich es nicht gebacken, den Inhalt des Caption-Feldes über das Image zu bringen. Kann mir da jemand weiterhelfen?
Im Objectbrowser finde ich für meine Kenntnisse keine Anhaltspunkte.
Danke schon mal.
Der Quelltext (Standard):
<div class="csc-textpic-imagewrap" style="width: 860px;">
<dl class="csc-textpic-image csc-textpic-firstcol" style="width: 135px;">
<dt>
<a href="index.php?id=16">
<img height="105" border="0" width="135" alt="" src="uploads/pics/01_manuell-schrauber.jpg"/>
</a>
</dt>
<dd class="csc-textpic-caption">
test1
<br/>
</dd>
</dl>
</div>
Schau dir mal mit dem Template Analyzer das css_styled_content setup an. Dort wird das Bild mit Caption generiert und dort kannst du auch Änderungen vornehmen.
Ahh, ok. Danke.
Jetzt habe ich folgendes versucht:
tt_content.image = COA
tt_content.image.10 = < lib.stdheader
tt_content.image.15 = TEXT
tt_content.image.15 {
field = imagecaption
required = 1
parseFunc =< lib.parseFunc
br = 1
fontTag = <p class="csc-caption">|</p>
wrapAlign.field = imagecaption_position
split.token.char = 10
split.token.if.isPositive = {$styles.content.imgtext.imageTextSplit} + {$styles.content.imgtext.captionSplit}
split.returnKey.data = register : IMAGE_NUM_CURRENT
}
Jetzt wird aber noch nicht der Inhalt des Feldes auf die Bilder aufgeteilt. Ich sehe jetzt nur den ersten Eintrag über dem ersten Bild. Das klappt schon mal.
Hast Du da auch noch einen Rat? 8-)
Hmm... ich glaube, das kann so gar nicht funktionieren,
denn das Caption wird doch mit dem Image mit gerendert.
Aber wie bekomme ich das nur über das Bild?
Ich finde keinen Anhaltspunkt. #angry#
Hier ist das Rendering festgelegt:
tt_content.textpic.20.rendering {
dl {
imageRowStdWrap.wrap = <div class="csi-imagerow" style="width:{register:rowwidth}px;"> | </div>
imageRowStdWrap.insertData = 1
noRowsStdWrap.wrap =
oneImageStdWrap.wrap = <dl class="csi-image" style="width:{register:imagewidth}px;"> | </dl>
oneImageStdWrap.insertData = 1
imgTagStdWrap.wrap = <dt> | </dt>
editIconsStdWrap.wrap = <dd> | </dd>
captionStdWrap.wrap = <dd class="csi-caption"> | </dd>
}
}
Aber wo wird die Reihenfolge festgelegt?
In der TSref finde ich auch nicht mehr darüber. 😢
Also, da es wohl über TS nicht lösbar ist, habe ich folgenden Weg gefunden:
tt_content.image.20.rendering {
dl {
imageRowStdWrap.dataWrap = <div class="csc-textpic-imagerow" style="width:{register:rowwidth}px;"> | </div>
noRowsStdWrap.wrap >
oneImageStdWrap.dataWrap = <div class="csc-textpic-image###CLASSES###" style="width:{register:imagespace}px; position:relative; display:block;"> | </div>
imgTagStdWrap.wrap = <div class="bild">|</div
editIconsStdWrap.wrap = <div class="editicon">|</div>
caption {
required = 1
wrap = <div class="caption fontsize_10"> | </div>
1.br = 0
}
}
}
Die Positionierung habe ich per CSS so gelöst:
div.csc-textpic-image
{
position: relative;
height: auto;
}
.csc-textpic-image .bild
{
margin-top: 31px;
}
.csc-textpic-image .caption
{
position: absolute;
top: 0px;
left: 0px;
height: 30px;
}