web-dev-qa-db-ja.com

領域テンプレートで変数をクラスとして設定(セットクラスを使用)

私のテーマに序文の領域が表示された場合、私は共通のクラスを設定しようとしています。私のテーマの領域テンプレートでset classes = []を使用して変数でこれをレンダリングしようとしています。

これまでのところ、次のように前処理領域に変数を設定しています。

function gratis_preprocess_region(&$vars) {
  // Check to see if any of the preface regions have content and if so
  // Set a common var for use as a class in the region template.
  if (!empty($vars['page']['preface_first']) || !empty($vars['page']['preface_second']) || !empty($vars['page']['preface_third'])) {
    $vars['preface_region'] = '';
  }
}

次に、テーマの領域テンプレートで、変数をset classes領域内にレンダリングしようとします。

  set classes = [
    'region',
    'region-' ~ region|clean_class,
    region == preface_region ? 'region-preface'
  ]

私はこれを正しい方法で行っていないと確信していますが、うまくいきません。

1
Danny Englander

これを行う方法は、すべての序文領域のテーマフックを作成することであり、独自のテンプレートを持つことができます。したがって、最初に、テーマの.themeファイルに変更前処理関数を作成します。

function MYTHEME_theme_suggestions_region_alter(&$suggestions, $vars, $hook) {
  // Print the $vars.
  kint($vars);

  // Define a var for the #region. 
  $preface = $vars['elements']['#region'];

  // Now check for any of the three preface regions and create a theme hook. 
  if ($preface == 'preface_first' || $preface == 'preface_second' || $preface == 'preface_third') {
    $suggestions[] = 'region' .  '__' . 'preface';
  }
}

次に、ほら、Twig debugを見ると、新しいテーマフックの提案が表示されます。

   * region--preface.html.twig >> **** This is the new template from the alter
   * region--preface-second.html.twig
   x region.html.twig

これで、region--preface.html.twigを使用して、3つの序文領域すべてに共通のテンプレートを作成できます。

次に、新しいテンプレートで、クラスを次のように出力します。

 {%
set classes = [
'region',
'region-preface',
'region-' ~ region|clean_class
]
%}

これは私がやろうとしていることを正確に与え、このHTMLを印刷します:

<div class="region region-preface region-preface-second">

これで、.region-prefaceを使用して、3つの序文領域の共通テーマ/ HTMLを使用できます。

1
Danny Englander