フロントエンドレイアウトで列とバックエンドのレイアウトを決定する方法は？

Question

フロントエンドレイアウトでバックエンドレイアウト、テンプレートファイル、およびカラムを決定する方法はありますか？

現時点では、私はあなたがバックエンドレイアウトを設定することができ、適切なテンプレートファイルを使用する次のコードを持っています。しかし、レイアウトごとに異なる列の位置がある場合、これは非常に乱雑になります。

page.10 = FLUIDTEMPLATE 
page.10 { 
    #format = html 
    file= fileadmin/templates/example/partials/example_home.html  
    partialRootPath = fileadmin/templates/example/partials/ 
    layoutRootPath = fileadmin/templates/example/layouts/ 
    variables { 

     # Assign the Columns 
     main < styles.content.get 
     main.select.where = colPos = 0 

     news < styles.content.get 
     news.select.where = colPos = 1 
     } 
    } 
} 


# Assign the Template files with the Fluid Backend-Template 
page.10.file.stdWrap.cObject = CASE 
page.10.file.stdWrap.cObject { 
    key.data = levelfield:-1, backend_layout_next_level, slide 
    key.override.field = backend_layout 

    # Set the default Template 
    default = TEXT 
    default.value = fileadmin/templates/example/partials/example_home.html 

    # Set a second Template 
    23 = TEXT 
    23.value = fileadmin/templates/example/partials/example_internal.html 


} 

Answer 1

ない厄介まったく、ここでは、現実世界の例があります：あなたが言うように、

• フロントエンドのレイアウトを忘れる：

  page.10 = FLUIDTEMPLATE 
  page.10 { 
      file.stdWrap.cObject = CASE 
      file.stdWrap.cObject { 
      key.data = pagelayout 
  
      default = TEXT 
      default.value = {$customPagesTemplatePath}/Standard.html 
  
      1 = TEXT 
      1.value = {$customPagesTemplatePath}/Home.html 
  
      2 = TEXT 
      2.value = {$customPagesTemplatePath}/Landing.html 
  
      10 = TEXT 
      10.value = {$customPagesTemplatePath}/NewsDetail.html 
  
      11 = TEXT 
      11.value = {$customPagesTemplatePath}/LandingMini.html 
  
      12 = TEXT 
      12.value = {$customPagesTemplatePath}/FullWidth.html 
      } 
      layoutRootPath = {$customPagesLayoutPath} 
      partialRootPath = {$customPagesPartialPath} 
  
  } 
  

  はこのようにそれについて考えてみよう。それは遺産です。レイアウトはBEとFEに役立ちます。

• ページが都市だった場合、colPosは通りになります。バックエンドがあなたが描いている地図であると想像してください。そしてフロントエンドはあなたがマップしているレゴシティです:-)）それがうまくいけば、私はその隠喩に固執します。

ColPosは、レコードが存在するページの決定された部分です。可能であれば、データベースのtt_contentテーブルを見てみましょう。colPosが数字の列であることがわかります。だから街 "ページ1"には "colPos 7"と呼ばれる通りがあり、そこにはいくつかのレコード（それらは家になる）が含まれています。 TYPO3のbe_layoutウィザードを使用して、その都市の管理マップを作成します。エディタはこれらの通りをどのように見なければなりません。

選択したbe_layoutに応じてFLUIDTEMPLATEを呼び出すと、都市自体が作成されます。レンダリングされたフロントエンド

<f:render partial="Mobilenav" /> 
<f:render partial="Header"/> 

<div class="row"> 
<f:cObject typoscriptObjectPath="lib.home-teaser" /> 
</div> 

<aside> 
    <div class="row"> 
    <div class="columns"> 
     <div class="row"> 
     <div class="fp-teaser-outer small-48 medium-24 large-12 columns"> 
      <div class="fp-teaser-box-wrapper"> 
      <f:cObject typoscriptObjectPath="lib.home-something" /> 
      </div> 
     </div> 
     <div class="fp-teaser-outer small-48 medium-24 large-12 columns"> 
      <div class="fp-teaser-box-wrapper"> 
      <f:cObject typoscriptObjectPath="lib.home-somethingelse" /> 
      </div> 
     </div> 
     <div class="fp-teaser-outer small-48 medium-24 large-12 columns"> 
      <div class="fp-teaser-box-wrapper"> 
      <div class="fp-teaser-box"> 
       <f:cObject typoscriptObjectPath="lib.home-news-plugin-title" /> 
       <div class="fp-teaser-hr"></div> 
       <div class="fp-teaser-content"> 
       <f:cObject typoscriptObjectPath="lib.home-news" /> 
       </div> 
      </div> 
      </div> 
     </div> 
     <div class="fp-teaser-outer small-48 medium-24 large-12 columns"> 
      <div class="fp-teaser-box-wrapper"> 
      <div class="fp-teaser-box"> 
       <f:cObject typoscriptObjectPath="lib.home-blog-plugin-title" /> 
       <div class="fp-teaser-hr"></div> 
       <div class="fp-teaser-content"> 
       <f:cObject typoscriptObjectPath="lib.home-blog" /> 
       </div> 
      </div> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</aside> 

<f:render partial="Footer"/> 

...よく、しかしcolPosとの相関があります：

ここでは、そのような流体のテンプレート（Home.html）のための別の現実世界の例を示しますか？ まだありません！ （拡張子fluid_styled_contentを使用して）、そのページのコラム7のすべてのコンテンツを取得し、置く：このことにより、だから、

lib.home-something < styles.content.get 
lib.home-something { 
    select.where = colPos = 7 
} 

は、我々は流体テンプレートのコンテンツを準備：私は（他の方法があることを肯定的ながら）のTypoScriptでこれを行いますそれを "lib"コンテンツオブジェクトに変換します。その後、f:cObjectなViewHelper経由でページに挿入されます

：このように

<f:cObject typoscriptObjectPath="lib.home-something" /> 

は、第七通りにすべての家は、まさにこの場所で、市内に入れている - ので、あなたのページにレンダリング。