Typo3 - 動的レイアウト

Question

動的なTypo3 - 流体レイアウトを作成したいと思います。列の幅は自動的に調整する必要があります。 FluidとTyposcriptの制限により、私は中央の列の複雑な状態を定式化するのに問題があります。 AND、OR演算子は機能しません。

誰かが私を助けてくれることを願っています。

のTypoScript：

variables { 
     top < styles.content.get 
     top.select.where = colPos=3 
     left < styles.content.get 
     left.select.where = colPos=1 
     center < styles.content.get 
     center.select.where = colPos=0 
     right < styles.content.get 
     right.select.where = colPos=2 
     footer < styles.content.get 
     footer.select.where = colPos=4 
    } 

レイアウト：あなたは新しい変数を設定したい場合

<div class="container-fluid"> 
    TEST: {f:if(condition:'{right} AND {left}', then:'8', else:'{f:if(condition:\'{left} OR {right}\', then: \'9\', else:\'12\')}')} 
    <div class="row"> 
    <div id="top_nav"> 
     {top -> f:format.raw()} 
    </div> 
    </div> 
    <div class="row"> 
    <f:if condition="{left}"> 
     <div id="left" class="col-xs-12 col-md-{f:if(condition:'{right}', then:'2', else:'3')}"> 
     {left -> f:format.raw()} 
     </div> 
    </f:if> 

    <div id="center" class="col-xs-12 col-md-{f:if(condition:'{right} AND {left}', then:'8', else:'{f:if(condition:\'{left} OR {right}\', then: \'9\', else:\'12\')}')}"> 
     {center -> f:format.raw()} 
    </div> 

    <f:if condition="{right}"> 
     <div id="right" class="col-xs-12 col-md-{f:if(condition:'{left}', then:'2', else:'3') }"> 
     {right -> f:format.raw()} 
     </div> 
    </f:if> 
    </div> 

Answer 1

論理演算子のみが、TYPO3のV8も

https://wiki.typo3.org/Fluid#Logical_operators

から利用できるようになります（あなたはクラス名で何をしたいか）あなたが設定できる https://fluidtypo3.org/viewhelpers/vhs/master/Variable/SetViewHelper.html

例：VHS変数セットなViewHelperであなたのhtml外ウルロジック

<f:if condition="{right}"> 
<f:then> 
<v:variable.set name="classCenter" value="2" /> 
</f:then> 
<f:else> 
<v:variable.set name="classCenter" value="9" /> 
</f:else> 
</f:if> 

<div id="center" class="col-xs-12 col-md-{classCenter}" > 

あなたがVHSをインストールして流体テンプレートに名前空間を設定するofcourseの必要があります。{namespace v=FluidTYPO3\Vhs\ViewHelpers}

Answer 2

ことテンプレートのためのロジックがたくさんあります。テンプレートでそれを行うことにした場合、特にインライン表記（{f:if(…)}）で条件を繰り返さないようにしてください。私はセクションを使用する方が好きですが、同じテンプレート/部分ファイル、あるいは変数を設定することができます。

あなたのコードは、こののように読める得ることができます：条件部については

<f:section="main"> 
    <f:if condition="{right}"> 
     <f:then> 
      <f:if condition="{left}"> 
       <f:then><f:comment>left and right</f:comment> 
        <f:render section="top" arguments="{top:top}" /> 
        <f:render section="left" arguments="{columns:2,left:left}" /> 
        <f:render section="center" arguments="{columns:8,center:center}" /> 
        <f:render section="right" arguments="{columns:2,right:right}" /> 
       </f:then> 
       <f:else><f:comment>right only</f:comment> 
        <f:render section="top" arguments="{top:top}" /> 
        <f:render section="center" arguments="{columns:9,center:center}" /> 
        <f:render section="right" arguments="{columns:3,right:right}" /> 
       </f:else> 
      </f:if> 
     </f:then> 
     <f:else>   
      <f:if condition="{left}"> 
       <f:then><f:comment>left only</f:comment> 
        <f:render section="top" arguments="{top:top}" /> 
        <f:render section="left" arguments="{columns:3,left:left}" /> 
        <f:render section="center" arguments="{columns:9,center:center}" /> 
       </f:then> 
       <f:else><f:comment>neither left nor right</f:comment> 
        <f:render section="top" arguments="{top:top}" /> 
        <f:render section="center" arguments="{columns:12,center:center}" /> 
       </f:else> 
      </f:if> 
     </f:else> 
    </f:if> 
</f:section> 

<f:section name="top"> 
    <div class="row"> 
     <div id="top_nav"> 
      {top -> f:format.raw()} 
     </div> 
    </div> 
</f:section> 

<f:section name="left"> 
    <div id="left" class="col-xs-12 col-md-{columns}"> 
     {left -> f:format.raw()} 
    </div> 
</f:section> 

<f:section name="right"> 
    <div id="right" class="col-xs-12 col-md-{columns}"> 
     {right -> f:format.raw()} 
    </div> 
</f:section> 

<f:section name="center"> 
    <div id="center" class="col-xs-12 col-md-{columns}"> 
     {center -> f:format.raw()} 
    </div> 
</f:section> 

、IMOそれは流体テンプレートが中に置かれるべき最大の複雑で、あなたのロジックの進歩は、データを使用することを検討しています。プロセッサ。ビューがレンダリングされる前に列をテストし、結果をテンプレートに割り当て、目的に合わせて流体レイアウトを使用できます。

データプロセッサには、いくつかのPHPスキルが必要です。コードist TYPO3\CMS\Frontend\DataProcessing\CommaSeparatedValueProcessorからそれらを理解するのに適した出発点。