Skip to research

Création de custom Metatags pour Drupal 8

Image
Illustration for metatags
Temps de lecture
Environ 2 minutes

Économies

On peut gagner en performances en s'attachant à déployer uniquement les fonctionnalités nécessaires à nos besoins.

La communauté Drupal est exceptionnelle, en tant que site builder, on peut y trouver un large panel de fonctionnalités en mode contrib, en tant que dev, quasiment toutes les problématiques sont abordées dans les modules proposés, qui peuvent servir de base à nos développements customs.

Malheureusement en tant que site Builder, on est rapidement limité, non pas en modules ou fonctionnalités mais en performances, en stabilité ou encore en sécurité.

Modules Contribs

En effet, on se retrouve souvent à installer des modules parce qu'ils proposent des fonctionnalités dont on a besoin, mais qui ajoutent un tas d'autres fonctionnalités que l'on n'utilisera jamais.

Cela peut introduire des incompatibilités avec les autres fonctionnalités, mais aussi des failles de sécurité, c'est pour cela qu'il est important, au maximum, de développer ces customs modules, ou fonctionnalités sur mesure, cela évite bien des tracas.

Modules Customs

Ma logique est la suivante, si je n'utilise pas 70% des fonctionnalités que me propose un module contrib, alors j'écris mes fonctionnalités.

Par exemple, ces quelques lignes vont me permettre d'ajouter des metatags aux pages du contenu de type Media, sans avoir à installer le module Métatags, module très gourmand et lourd.

 

Contexte

Pour le contexte, si vous utilisez le module Bricks (que je trouve beaucoup plus user friendly que le module Paragraph, modules utilisés pour permettre aux contributeurs de composer des pages à base de titres, de textes, et de médias etc...) en mode site multi-language, en installant le module Metatags, il est ensuite impossible de valider les changements de configurations de l'interface admin de traduction.
En clair : il est impossible d'activer la traduction des champs pour tout nouveaux bundles Bricks ou autres entités, créer après l'activation du module Metatags. Très ennuyant comme beug ! Le problème, le beug peut se contourner en passant par l'interface de configuration du champs du bundle ou de l'entité en question, mais s'agissant des champs par défault des bundles ou des entités, le titre par exemple, impossible. C'est bloquant, si l'on utilise le titre du bundle comme élément s'affichant en front, dans le cas des bundles bricks.

Lorsqu'on est confronté à ce beug, si l'on doit à tout prix traduire le titre du nouveau bundle, il vous faudra désactiver le module Métatags, activer la traduction des bunbles en question et ensuite, réactiver le module métatags et reconfigurer nos valeurs méta, laborieux, et finalement, pas viable !.

 

Pratique

Dans le cas suivant, je n'ai pas besoin de configuration, mais on pourrait créer facilement une custom forme, une interface permettant de la configuration utilisateur, à base de tokens (custom?) et de références.

Dans le fichier .module de mon custom module ou dans le fichier .theme du theme actif, ajouter la function hook_preprocess_html avec la logique suivante.
 

/**
 * Implements hook_preprocess_html() for html templates.
 */
function nom_du_module_preprocess_html(&$variables) {
  // Check if the current page is a node
  // Load the node entity from current route
  $node = \Drupal::routeMatch()->getParameter('node');
  // If a node, continue
  if ($node) {
    // Check if the current type node is a 'media type node'
    // If is a 'media type node', continue
    if ($node->getType() === 'media') {
      // Process the title metaTags
      $title = [
        '#tag' => 'meta',
        '#attributes' => [
          'name' => 'title',
          'content' => $node->get('title')->value,
        ],
      ];
      $variables['page']['#attached']['html_head'][] = [$title, 'title'];
      // Process the description metaTags
      $description = [
        '#tag' => 'meta',
        '#attributes' => [
          'name' => 'description',
          'content' => strip_tags(text_summary($node->get('body')->value, NULL, 200)),
        ],
      ];
      $variables['page']['#attached']['html_head'][] = [$description, 'description'];
      // Process the og:title metaTags
      $ogtitle = [
        '#tag' => 'meta',
        '#attributes' => [
          'name' => 'og:title',
          'content' => $node->get('title')->value,
        ],
      ];
      $variables['page']['#attached']['html_head'][] = [$ogtitle, 'og:title'];
      // Process the og:image metaTags
      if ($node->hasField('field_media_galerie') 
        && $node->get('field_media_galerie')->getValue() 
        && $node->get('field_media_galerie')->getValue()[0]) {
        $fid = $node->get('field_media_galerie')->getValue()[0]['target_id'];
        $file = \Drupal\file\Entity\File::load($fid);
        $galerieUrl = $file->url();
        $ogImage = [
          '#tag' => 'meta',
          '#attributes' => [
            'name' => 'og:image',
            'content' => $galerieUrl,
          ],
        ];
        $variables['page']['#attached']['html_head'][] = [$ogImage, 'og:image'];
      }
    }
  }
}