web-dev-qa-db-ja.com

<head> ... </ head>セクションにメタタグを追加するにはどうすればよいですか?

Drupal 8の<head>...</head>セクション内に次のメタタグを追加するにはどうすればよいですか?

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
21
lesley n.

さまざまなソースから、Drupal 8でメタタグを追加するさまざまな方法を見つけ、すべての方法でコンパイルしました。


1. THEME.themeファイルの使用

同じ質問がstakeoverflowでも行われていると思います: headにdrupal 8にメタタグを追加 そして、もし @ Danielishko の答えが見つかれば、彼は次のコードを提供し、

_THEME.theme_ファイルに次のコードを追加し、キャッシュをクリアすれば、準備完了です。注:function theme_preprocess_html(&$variables) {...}は.themeファイルにすでに存在しているはずなので、新しいものを作成しないでください。作成しないと、エラーが発生します。

_function theme_preprocess_html(&$variables) {

  $xuacompatible = [
    '#tag' => 'meta',
    '#attributes' => [
      'http-equiv' => 'x-ua-compatible',
      'content' => 'ie=Edge',
    ],
  ];


  $variables['page']['#attached']['html_head'][] = [$xuacompatible, 'x-ua-compatible'];
}
_

出力画像:

enter image description here


2.テンプレートファイルから:

このトピックについて別の質問が尋ねられました: drupal 8メタタグを設定/削除する方法

上記のリンクの質問を読んだ場合、質問者は_html.html.twig_テンプレートファイルを使用してメタタグを直接_<head>....</head>_に追加できると述べています

_html.html.twig_にある_core/modules/sytem/templates/html.html.twig_ファイルをコピーして、テーマのテンプレートフォルダーに貼り付けると、テーマで使用されます。

from _html.html.twig_

_<!DOCTYPE html>
<html{{ html_attributes }}>
  <head>
    <head-placeholder token="{{ placeholder_token|raw }}">
    <title>{{ head_title|safe_join(' | ') }}</title>
    <css-placeholder token="{{ placeholder_token|raw }}">
    <js-placeholder token="{{ placeholder_token|raw }}">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
  </head>
  <body{{ attributes }}>
    {#
      Keyboard navigation/accessibility link to main content section in
      page.html.twig.
    #}
    <a href="#main-content" class="visually-hidden focusable">
      {{ 'Skip to main content'|t }}
    </a>
    {{ page_top }}
    {{ page }}
    {{ page_bottom }}
    <js-bottom-placeholder token="{{ placeholder_token|raw }}">
  </body>
</html>
_

出力画像:

enter image description here

注:これは私自身のロジックであり、これに関する参照を見つけようとしましたが、これに関する参照は見つかりませんでした。上記のリンクの質問者ですが、他のものを追加するためにテンプレートファイルを編集しているため、タグの追加に使用できないのはなぜですか。これが正しい方法ではない場合はコメントを提供してくださいIS正しい方法ではありません。また、私にとっては経験を学習することになります。


3.独自のカスタムモジュールを作成する

このチュートリアルを参照する場合 Drupal 8に新しいHTMLタグを追加する 、彼はDrupal 8でヘッドにタグを追加する一般的な方法を説明しています。私はあなたの要件に従って変更しました。このチュートリアルを参照できます:Drupal 8で単純なモジュールを開発する方法については Drupal 8:単純なモジュールを作成する で、次のコードがmodule_name.moduleファイルに挿入されます。 。

_module_name.module_ファイルの場合

_<?php
/**
 * Implements hook_page_attachments().
 */
function module_name_page_attachments(array &$page) {
  $xuacompatible = [
        '#tag' => 'meta',
        '#attributes' => [
          'http-equiv' => 'x-ua-compatible',
          'content' => 'ie=Edge',
        ],
      ];
  $page['#attached']['html_head'][] = [$xuacompatible, 'x-ua-compatible'];
}
_

この方法と第1オプションで説明した方法はまったく同じだと思います。


4. Drupalモジュールを使用する

この方法の使い方がわからないので、探してみました。ここで私が言及しているのは、メタタグを追加するポイントになると、このモジュールが常にポップアップするためです。

私はこのアプローチを使うべきだと思います。受け入れられた答えで彼はモジュールの方法を説明しており、あなたは使用することができます Metatag module for that。このモジュールには依存モジュール TokenCtools がありますが、これは非常に一般的なことです。その答えでは手順全体が説明されているので、ここでは触れません。

50
CodeNext

コントローラー、ブロック、エンティティ、フィールド、またはその他の場所にコンテンツを追加する場合、フックを作成する必要はありません。

メタタグをテーマまたはレンダリング要素(#theme#type#markup)に直接追加できます。

$build['username'] = [
  '#theme' => 'username',
  '#account' => \Drupal::currentUser(),
  '#attached' => [
    'html_head' => [
      [
        [
          '#tag' => 'meta',
          '#attributes' => [
            'name' => 'foo',
            'content' => 'bar',
          ],
        ],
        'my_module_foo',
      ],
    ],
  ],
];

レンダリングされると、タグはページレベルまでバブルし、<head>...</head>セクションに追加されます。

$variablesの最上位に接続できる前処理フックで、 https://drupal.stackexchange.com/a/288989/47547 を参照してください。

4
4k4

ここではMetatagモジュールを使用できます。

Metatag:Mobile&UI Adjustmentsサブモジュールを有効にする必要があります。

メタタグ設定ページからこれを実行すると、各メタタグタイプの下にWindowsとWindows Mobileが表示され、要件に応じて、グローバルまたはページ固有のX-UA互換コンテンツを追加できます。

0
Vidit Anjaria