You are here

Home » API reference » Panels 8.3

panels-twocol-bricks.html.twig in Panels 8.3

Template for a 2 column panel layout.

This template provides a two column panel display layout with full width areas at the top, bottom and in the middle.

Variables:

  • $id: An optional CSS id to use for the layout.
  • $content: An array of content, each item in the array is keyed to one panel of the layout. This layout supports the following sections:

    • content.top: Content in the top row.
    • content.left_above: Content in the top left column.
    • content.right_above: Content in the top right column.
    • content.middle: Content in the middle column.
    • content.left_below: Content in the bottom left column.
    • content.right_below: Content in the bottom right column.
    • content.bottom: Content in the bottom row.

File

layouts/twocol_bricks/panels-twocol-bricks.html.twig
View source 
  1. {#

  2. /**

  3.  * @file

  4.  * Template for a 2 column panel layout.

  5.  *

  6.  * This template provides a two column panel display layout with full width

  7.  * areas at the top, bottom and in the middle.

  8.  *

  9.  * Variables:

  10.  * - $id: An optional CSS id to use for the layout.

  11.  * - $content: An array of content, each item in the array is keyed to one

  12.  *   panel of the layout. This layout supports the following sections:

  13.  *   - content.top: Content in the top row.

  14.  *   - content.left_above: Content in the top left column.

  15.  *   - content.right_above: Content in the top right column.

  16.  *   - content.middle: Content in the middle column.

  17.  *   - content.left_below: Content in the bottom left column.

  18.  *   - content.right_below: Content in the bottom right column.

  19.  *   - content.bottom: Content in the bottom row.

  20.  */

  21. #}

  22. <div class="panel-2col-bricks" {% if css_id %}{{ css_id }}{% endif %}>

  23.   <div class="panel-panel panel-full-width">

  24.     {{ content.top }}

  25.   </div>

  26. 

  27.   <div class="panel-panel">

  28.     {{ content.left_above }}

  29.   </div>

  30. 

  31.   <div class="panel-panel">

  32.     {{ content.right_above }}

  33.   </div>

  34. 

  35.   <div class="panel-panel panel-full-width">

  36.     {{ content.middle }}

  37.   </div>

  38. 

  39.   <div class="panel-panel">

  40.     {{ content.left_below }}

  41.   </div>

  42. 

  43.   <div class="panel-panel">

  44.     {{ content.right_below }}

  45.   </div>

  46. 

  47.   <div class="panel-panel panel-full-width">

  48.     {{ content.bottom }}

  49.   </div>

  50. </div>