如果我将它显示为背景图像，TYPO3 Fluid FAL 图像会得到错误的路径

Question

您好，我正在使用 FluidTYPO3 以及最新的 TYPO3 Core 7.6 和 Flux/Fluid 扩展。

我正在使用 FAL 关系：

<flux:field.inline.fal name="backgroundimage" minItems="1" maxItems="1" />

现在我可以使用以下代码片段在前端显示我的图片（for/each 已过时，我只有一张图片）：

<f:for each="{v:content.resources.fal(field: 'backgroundimage')}" as="image">
    <f:image treatIdAsReference="1" src="{image.id}" alt=""/><br/>
</f:for>

图像将像 <img src="fileadmin/user_upload/.."

一样渲染

但是我需要我的图片作为背景图片，所以我试过：

<f:for each="{v:content.resources.fal(field: 'backgroundimage')}" as="image">
 <div class="back" style="background-image: url('{image.id}');"></div>
</f:for>

但我会得到.. <div class="back" style="background-image: url('1:/Editors_English/image.jpg');"></div>

我认为 treatIdAsReference 不见了，但它是如何工作的？我不知道..谢谢你的帮助。

Answer 1

您需要做的事情与您对 <img> 标签中的图像所做的基本相同：使用 ViewHelper 为您呈现图像 URL。在这种情况下，您只需要 URL，周围没有 <img> 标记，因此您必须改用 ViewHelper f:uri.image。在内联符号中使用它也很有帮助，它看起来像这样：

<f:for each="{v:content.resources.fal(field: 'backgroundimage')}" as="image">
  <div class="back" style="background-image: url('{f:uri.image(src: image.id, treatIdAsReference: 1)}');"></div>
</f:for>

我不确定您是否真的需要 treatIdAsReference 参数，您可以将其省略。

如果我将它显示为背景图像，TYPO3 Fluid FAL 图像会得到错误的路径

TYPO3 Fluid FAL images get wrong path if I will show it as background image

typo3

background-image

fluid

fal

typo3-7.6.x