[英]How to output an image caption in custom typoscript template?
I use an image from page resources as a header image of the page.我使用页面资源中的图像作为页面的 header 图像。 I could not find a solution to output the image caption (description).
我找不到 output 图片标题(描述)的解决方案。 Here is the code.
这是代码。
lib.headerImage = COA
lib.headerImage {
30 = FILES
30 {
references {
table = pages
uid.data = page:uid
fieldName = media
}
begin = 0
renderObj = IMAGE
renderObj {
file {
import.data = file:current:uid
treatIdAsReference = 1
maxW = 640
maxH = 360
}
altText.data = file:current:alternative
titleText.data = file:current:title
layoutKey = picture
layout {
picture {
element = <picture class="header-image__picture">###SOURCECOLLECTION###<img src="###SRC###" ###PARAMS### ###ALTPARAMS### />###CAPTION###</picture>
source = <source srcset="###SRC###" media="###MEDIAQUERY###" />
}
}
sourceCollection {
big {
maxW = 2000
maxH = 1080
mediaQuery = (min-width: 1025px)
}
small {
maxW = 640
maxH = 360
mediaQuery = (max-width: 767px)
}
}
}
maxItems = 1
}
wrap = <div class="header-image">|</div>
}
Is it possible somehow to output the caption in the mark ###CAPTION###?是否有可能以某种方式 output 标记###CAPTION### 中的标题?
or somewhere below the image?或图像下方的某个地方? or it is better to use FLUID instead of typoscript?
或者最好使用 FLUID 而不是打字稿?
I found a solution.我找到了解决方案。 I put the image object inside COA
我将图像 object 放入 COA
renderObj = COA
renderObj {
10 = IMAGE
10 {
file {
import.data = file:current:uid
treatIdAsReference = 1
maxW = 640
maxH = 360
}
altText.data = file:current:alternative
titleText.data = file:current:title
layoutKey = picture
layout {
picture {
element = <picture class="header-image__picture">###SOURCECOLLECTION###<img src="###SRC###" ###PARAMS### ###ALTPARAMS### /></picture>
source = <source srcset="###SRC###" media="###MEDIAQUERY###" />
}
}
sourceCollection {
big {
maxW = 2000
maxH = 1080
mediaQuery = (min-width: 1025px)
}
small {
maxW = 640
maxH = 360
mediaQuery = (max-width: 767px)
}
}
}
20 = TEXT
20.data = file:current:description
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.