Wie füge ich ein Meta-Tag im Abschnitt <head>… </ head> hinzu?

19

Wie kann ich das folgende Meta-Tag in den <head>...</head>Abschnitt in Drupal 8 einfügen?

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

Antworten:

49

Aus verschiedenen Quellen habe ich in Drupal 8 verschiedene Methoden zum Hinzufügen von Meta-Tags gefunden und damit alle Methoden kompiliert.


1. Verwenden der Datei THEME.theme

Ich denke, die gleiche Frage wurde bei stakeoverflow gestellt: füge ein Meta-Tag zu head in Drupal 8 hinzu und wenn du die Antwort von @Danielishko siehst , hat er den folgenden Code bereitgestellt.

Fügen Sie einfach folgenden Code in Ihre THEME.themeDatei ein, leeren Sie den Cache und schon können Sie loslegen. Hinweis: function theme_preprocess_html(&$variables) {...}Sollte sich bereits in Ihrer .theme-Datei befinden, erstellen Sie keine neue, da sonst ein Fehler auftritt.

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'];
}

Ausgabebild:

Bildbeschreibung hier eingeben


2. Über die Vorlagendatei:

Zu diesem Thema wurde eine weitere Frage gestellt: So setzen / entfernen Sie Drupal 8-Meta-Tags .

Wenn Sie die Frage unter dem oben genannten Link lesen, hat der Fragesteller erwähnt, dass Sie mithilfe der html.html.twigVorlagendatei Meta-Tags direkt hinzufügen können<head>....</head>

html.html.twigDatei finden Sie unter core/modules/sytem/templates/html.html.twig. Sie können diese kopieren und in den Vorlagenordner Ihres Themas einfügen, und Ihr Thema verwendet diesen Ordner.

von 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>

Ausgabebild:

Bildbeschreibung hier eingeben

HINWEIS: Dies ist meine eigene Logik und ich habe versucht, eine Referenz dafür zu finden. Ich habe keine Referenz zu dieser gefunden, mit Ausnahme einer Zeile, die der Fragesteller im obigen Link zur Verfügung stellt Stichworte. BITTE KOMMENTARE GEBEN, WENN DIES KEINE RICHTIGE MASSNAHME IST. Es wird auch eine Lernerfahrung für mich sein. Danke.


3. Erstellen Sie Ihr eigenes benutzerdefiniertes Modul

Wenn Sie dieses Tutorial von beziehen: Hinzufügen neuer HTML-Tags in Drupal 8 , hat er die allgemeine Methode zum Hinzufügen von Tags zu head in Drupal 8 beschrieben. Ich habe sie gemäß Ihren Anforderungen geändert. Sie können auf dieses Tutorial verweisen: Drupal 8: Erstellen eines einfachen Moduls zum Entwickeln eines einfachen Moduls in Drupal 8. Der folgende Code wird in die Datei module_name.module eingefügt.

zum module_name.module datei,

<?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'];
}

Ich denke, diese Methode und die in der ersten Option beschriebene Methode sind ziemlich gleich.


4. Verwenden des Drupal-Moduls

Ich bin mir nicht sicher, wie ich diesen Ansatz anwenden soll. Hier erwähne ich, weil dieses Modul beim Hinzufügen von Meta-Tags immer eingeblendet wird.

Ich denke, diesen Ansatz sollten Sie verwenden. In der akzeptierten Antwort hat er den Modulweg beschrieben und Sie können das Metatag- Modul dafür verwenden. Dieses Modul hat abhängige Module Token & Ctools , was sehr häufig vorkommt. In dieser Antwort wurde das gesamte Verfahren beschrieben, so dass ich hier nicht erwähne.

CodeNext
quelle
Ich habe das Metatag-Modul überprüft, bevor ich meinen Beitrag geschrieben habe, aber ich weiß nicht, welches Feld ich auswählen muss, um auszugeben, was ich will. Und selbst wenn es so wäre, müsste ich dies für jeden Inhaltstyp tun. Vielleicht gibt es einen bequemeren Weg?
Lesley n.
@lesleyn. Ich habe meine Antwort aktualisiert, ich habe eine andere Methode zum Hinzufügen von Metatags eingefügt, aber wie Sie habe ich auch nicht herausgefunden, wie man Metatag-Module verwendet. Ich denke, über dieses Modul können wir auf alles zugreifen, was in der Token-Liste angegeben ist Verwenden Sie Ihr gelistetes Metatag. Ich denke, wir müssen ein Token dafür erstellen. Dies ist nur meine wilde Vermutung. Ansonsten habe ich getestet, und sie arbeiten.
CodeNext
1
Dies sollte als korrekt markiert sein =) +1
Cyclonecode
1
@ AntonínSlejška, Sowohl n-1 als auch n-3 sind ziemlich gleich. Der Unterschied besteht darin, dass Sie in n-1 Code in die .theme-Datei einfügen, während Sie in n-3 ein benutzerdefiniertes Modul dafür erstellen. Ich würde sagen, gehen Sie für n-1, wird sauber und einfach sein. Und für HOMEPAGE müssen Sie eine zusätzliche Codezeile in dem Code einfügen, den ich in n-1 angegeben habe. Ich habe gerade ein Update in n-1 hinzugefügt, lass es mich wissen, wenn du das kopierst, ich muss das löschen. Wenn immer noch ein Problem vorliegt, lassen Sie es mich bitte wissen.
CodeNext
@ CodeNext Es tut mir leid. Ich habe vergessen, den Cache zu leeren. Es funktioniert perfekt Danke für die Hilfe. Ich habe den Code kopiert.
Antonín Slejška
4

Wenn Sie einem Controller, Block, Objekt, Feld oder anderen Orten Inhalt hinzufügen, müssen Sie keinen Hook erstellen.

Sie können den Meta - Tag direkt zu einem beliebigen Thema hinzufügen oder Element machen ( #theme, #type, #markup):

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

Beim Rendern sprudelt das Tag bis zur Seitenebene und wird dem <head>...</head>Abschnitt hinzugefügt .

In einem Preprocess-Hook können Sie eine Verbindung zur obersten Ebene von herstellen $variables(siehe /drupal//a/288989/47547)

4k4
quelle