Problem/Motivation

We're missing the section on "Storing configuration for the selected layout" on https://www.drupal.org/docs/8/api/layout-api/how-to-render-layouts

Proposed resolution

Provide a good example explaining how to do it.

Remaining tasks

Write up the example
Update the handbook page

User interface changes

None

API changes

None

Data model changes

None

Comments

Manuel Garcia created an issue. See original summary.

Manuel Garcia’s picture

Status: Active » Needs work

Here is a starting point we could use, sets up a layout with a simple configuration form, and then shows how to use it on the twig file. Works fine using field_layout module.

The layout class:

/**
 * A very advanced custom layout.
 *
 * @Layout(
 *   id = "layouts_tester_layout",
 *   label = @Translation("Layouts Tester Layout"),
 *   category = "Tester Layouts",
 *   description = @Translation("A testing layout for testing porpsues"),
 *   template = "templates/layouts_tester_layout",
 *   regions = {
 *     "main" = {
 *       "label" = @Translation("Main content"),
 *     }
 *   },
 *   type = "page",
 * )
 */
class LayoutsTesterLayout extends LayoutDefault implements PluginFormInterface {

  /**
   * {@inheritdoc}
   */
  public function defaultConfiguration() {
    return parent::defaultConfiguration() + [
      'background_colour' => '#111111',
    ];
  }

  /**
   * {@inheritdoc}
   */
  public function buildConfigurationForm(array $form, FormStateInterface $form_state) {
    $configuration = $this->getConfiguration();
    $form['background_colour'] = [
      '#type' => 'color',
      '#title' => 'Backround colour',
      '#default_value' => $configuration['background_colour'],
    ];

    return $form;
  }

  /**
   * {@inheritdoc}
   */
  public function validateConfigurationForm(array &$form, FormStateInterface $form_state) {
  }

  /**
   * {@inheritdoc}
   */
  public function submitConfigurationForm(array &$form, FormStateInterface $form_state) {
    $this->configuration['background_colour'] = $form_state->getValue('background_colour');
  }

}

And the twig file:

{%
  set classes = [
    'layout--tester-layout',
  ]
%}
<div{{ attributes.addClass(classes) }} style="background-color: {{ settings.background_colour }}">

{{ content.main }}
</div>

We could probably name this something better perhaps, and explain things a bit more bit by bit.

Version: 8.4.x-dev » 8.5.x-dev

Drupal 8.4.0-alpha1 will be released the week of July 31, 2017, which means new developments and disruptive changes should now be targeted against the 8.5.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.