ProcessWire - Layout Blöcke mit RepeaterMatrix: Unterschied zwischen den Versionen

Aus Wikizone
Wechseln zu: Navigation, Suche
Zeile 8: Zeile 8:
  
 
== Dateien ==
 
== Dateien ==
=== Kurzversion layout_blocks.php ===
 
Integriert die layout_blocks.inc ins Template und verkürzt diese. Vorteil: übersichtlich. Nachteil: nicht so schön zu debuggen. Muß noch getestet werden.
 
==== Template: layout_blocks.php ====
 
<syntaxhighlight lang="php">
 
include("./partials/layout_blocks.inc");
 
$layoutBlocks = renderLayoutBlocks($page);
 
$content = $layoutBlocks;
 
</syntaxhighlight>
 
  
 
=== Template z.b. layout_blocks.php ===
 
=== Template z.b. layout_blocks.php ===
Zeile 59: Zeile 51:
 
</syntaxhighlight>
 
</syntaxhighlight>
  
Variante (Kurzversion)
+
=== partials/layout_blocks.inc (Kurzversion) ===
partials/layout_blocks.inc (Version 2)
+
Integriert die layout_blocks.inc ins Template und verkürzt diese. Vorteil: übersichtlich. Nachteil: nicht so schön zu debuggen. Muß noch getestet werden.
Noch nicht getestet
+
 
 
<syntaxhighlight lang="php">
 
<syntaxhighlight lang="php">
 
<?php namespace ProcessWire;
 
<?php namespace ProcessWire;
Zeile 72: Zeile 64:
 
   $out = '';
 
   $out = '';
 
   foreach($page->layout_blocks_matrix as $item) {
 
   foreach($page->layout_blocks_matrix as $item) {
        $out .= $item->render(); // looks for templates/fields/layout_blocks_matrix/headline.php
+
    $out .= $item->render(); // looks for templates/fields/layout_blocks_matrix/itemTypeName.php
        break;
 
      case 'content':
 
        $out .= '<section>'.$item->body.'</section>';
 
        break;
 
      case 'responsive_image':
 
        $out .= $item->render();
 
        break;
 
      case 'accordion':
 
        $out .= $item->render(); // looks for templates/fields/layout_blocks/accordion.php
 
        break;
 
      default:
 
        $out .= '<div class="message">Keine Renderdefinition gefunden für den Typ: '.$item->type.'</div>';
 
        break;
 
    }
 
 
   }
 
   }
 
   return $out;
 
   return $out;
 
 
}
 
}
 
</syntaxhighlight>
 
</syntaxhighlight>
fields/layout_blocks_matrix/accordion.php (Bootstrap Accordion Style)
+
 
 +
=== Beispiele für Layout Blöcke ===
 +
==== Accordion (Bootstrap) ====
 +
'''fields/layout_blocks_matrix/accordion.php (Bootstrap Accordion Style)'''
 
<syntaxhighlight lang="php">
 
<syntaxhighlight lang="php">
 
<?php namespace ProcessWire;
 
<?php namespace ProcessWire;
Zeile 131: Zeile 111:
 
<syntaxhighlight lang="php">
 
<syntaxhighlight lang="php">
 
</syntaxhighlight>
 
</syntaxhighlight>
 
Layout Blocks Beispiele
 

Version vom 6. Oktober 2017, 18:55 Uhr

Mit einer RepeaterMatrix, kann man Einzelfelder zu Gruppen zusammenfassen um z.B. verschiedene Layoutblöcke zu definieren. Diese Gruppen kann man wiederholt nutzen. Im Gegensatz zum Repeater Feld können nicht nur gleichartige Felder wiederholt werden. Der Benutzer kann alle in der Matrix definierten Gruppen auswählen.

Quickstart

  • ProFields: Repeater Matrix installieren
  • Felder definieren die man später in den Gruppen nutzen möchte
  • Ein RepeaterMatrix Feld definieren und dort dann die Gestaltungsblöcke definieren.

Dateien

Template z.b. layout_blocks.php

include("./partials/layout_blocks.inc");
$layoutBlocks = renderLayoutBlocks($page);
$content = $layoutBlocks;

partials/layout_blocks.inc (Version 1)

<?php namespace ProcessWire;
/* Shows layout blocks
 * uses repeater Matrix field
 * uses standard render function which looks after templates/fields/matrix_field_name/child_field_name.php for returning markup
 */

function renderLayoutBlocks($page){
  $out = '';
  foreach($page->layout_blocks_matrix as $item) {
    switch ($item->type) {
      case 'headline':
        $out .= $item->render(); // looks for templates/fields/layout_blocks_matrix/headline.php
        break;
      case 'content':
        $out .= '<section>'.$item->body.'</section>';
        break;
      case 'responsive_image':
        $out .= $item->render();
        break;
      case 'accordion':
        $out .= $item->render(); // looks for templates/fields/layout_blocks/accordion.php
        break;
      default:
        $out .= '<div class="message">Keine Renderdefinition gefunden für den Typ: '.$item->type.'</div>';
        break;
    }
  }
  return $out;

}

partials/layout_blocks.inc (Kurzversion)

Integriert die layout_blocks.inc ins Template und verkürzt diese. Vorteil: übersichtlich. Nachteil: nicht so schön zu debuggen. Muß noch getestet werden.

<?php namespace ProcessWire;
/* Shows layout blocks
 * uses repeater Matrix field
 * uses standard render function which looks after templates/fields/matrix_field_name/child_field_name.php for returning markup
 */

function renderLayoutBlocks($page){
  $out = '';
  foreach($page->layout_blocks_matrix as $item) {
    $out .= $item->render(); // looks for templates/fields/layout_blocks_matrix/itemTypeName.php
  }
  return $out;
}

Beispiele für Layout Blöcke

Accordion (Bootstrap)

fields/layout_blocks_matrix/accordion.php (Bootstrap Accordion Style)

<?php namespace ProcessWire;
  /*
   * Accordion Bootstrap Style
   * Used fields: 
   * accordion_repeater (repeater field)
   * accordion_headline
   * accordion_content
   */

  $markup = '<div class="panel-group accordion" id="accordion-'.$page->id.'">';
	//return "render function Accordion class";
  //$firstClass = 'in'; // used for first panel
  $firstClass = '';
  foreach($page->accordion_repeater as $panel){
    $markup .= '
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a class="collapsed" data-toggle="collapse" data-parent="#accordion-'.$page->id.'" href="#collapse'.$panel->id.'">'
            .$panel->accordion_headline.'
          </a>
        </h4>
      </div>
      <div id="collapse'.$panel->id.'" class="panel-collapse collapse '.$firstClass.'">
        <div class="panel-body">'.$panel->accordion_content.'</div>
      </div>
    </div>';
    $firstClass='';
  }
  $markup .= '</div>';
  return $markup;

?>