web-dev-qa-db-ja.com

段落の画像フィールドのレスポンシブ画像スタイルをプログラムでレンダリングまたは変更するにはどうすればよいですか?

エディターユーザーがさまざまなレスポンシブ画像スタイルを選択して、段落フィールドから画像フィールドをレンダリングできるようにしたいのですが。そこで、ユーザーが希望するレスポンシブスタイルを選択できる別のフィールドを定義しました。

問題は、twigテンプレートでオンザフライでそのレスポンシブスタイルを適用できないため、フィールドを変更するか、画像要素を作成して、アクセスできる変数に割り当てようとしたことです。 hook_preprocess_fieldのテンプレートからですが、変数内の画像のURLにアクセスできないため、実行方法がわかりません。

これを達成する方法はありますか?

5
jmzea

画像を交換する必要はありません。画像のレンダリング方法に関する情報だけです。また、フィールドテンプレートではこれを行うことはできません。これは、両方のフィールドが使用可能な段落テンプレートでのみ可能です。

function mytheme_preprocess_paragraph(&$variables) {
  if ($variables['paragraph']->hasField('field_image_style')) && isset($variables['content']['field_image']['0']) {
    $image_style = $variables['paragraph']->field_image_style->value;
    $variables['content']['field_image']['0']['#responsive_image_style_id'] = $image_style;
  }
}
4
4k4

私はこの問題に数回遭遇し、私が見つけた最良の解決策は Zurb Interchange のようなものを使用することでした。これは画像を取得し、画面サイズに基づいて画像srcを動的に交換します。

Drupal 8のバージョンはありませんが、Drupal 7.のバージョンはあります。7の派生物を生成する必要がある画像スタイルを選択できます。およびその順序(メディアクエリにとって重要な順序)。Zurbのプラグインに興味がある場合は、おそらく port it Drupal 8 です。時間またはまだそうする機会。

しかし、私が理解しているように、Drupal 8の場合、8.xに追加された新しいもので https://www.bluecoda。 com/blog/using-responsive-images-drupal-8 -しかし、ユーザーがブラウザのサイズを変更したときに、適切な画像と入れ替わるかどうかはわかりません(インターチェンジやプラグインなど)。

1
Kevin