TYPO3流體FAL圖像得到錯誤的路徑，如果我將它顯示爲背景圖像

Question

您好我正在與FluidTYPO3和最新的TYPO3 Core 7.6和Flux/Fluid Extensions。

我使用FAL-關係有：

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

現在，我可以告訴我的前端圖像與下面的代碼段（在對/每個是obsolet，我只有一個圖像）：

<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> -tag中的圖像做的事情相同：使用ViewHelper爲您呈現圖像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參數，你或許可以離開它。