how to add to html.twig from a node twig file?

drupal.stackexchange https://drupal.stackexchange.com/questions/251965

  •  12-01-2021
  •  | 
  •  

Pergunta

I need to add the article image to the post shared on facebook and twitter, this is done by meta tags added in the as shown below

<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 }}">

  {# RIGHT HERE  #}
  <meta name='og:image' content='{{ file_url(element['#object'].field_image.0.entity.uri.value) }}'>
  <meta name="twitter:card" content="photo" />
  <meta name="twitter:site" content="@nestle" />
  <meta name="twitter:title" content="Article Picture" />
  <meta name="twitter:description" content="A description" />
  <meta name="twitter:image" content="{{ file_url(element['#object'].field_image.0.entity.uri.value) }}" />
  <meta name="twitter:url" content="{{ base_path }}" />
</head>

I need to add meta tags in the in the html.html.twig file, the problem is those meta tags depend on the article being shared because I need to get the URL of the image, I cannot figure out how to do it such that a block of code written in the node.html.twig file would be placed in the in the html.html.twig file.

WHAT I TRIED i tried adding a block in start of node file and extending the html.html file node--article.html.twig (start of file) :

{% extends "html.html.twig" %}
{% block metablock %}
  <meta name='og:image' content='{{ file_url(element['#object'].field_image.0.entity.uri.value) }}'>
  <meta name="twitter:card" content="photo" />
  <meta name="twitter:site" content="@nestle" />
  <meta name="twitter:title" content="Article Picture" />
  <meta name="twitter:description" content="A description" />
  <meta name="twitter:image" content="{{ file_url(element['#object'].field_image.0.entity.uri.value) }}" />
  <meta name="twitter:url" content="{{ base_path }}" />
{% endblock %}

then calling this block from the html.html file like this:

  <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 }}">

    {# RIGHT HERE #}
    {{ block('metablock') }} 
  </head>

But this gives an error

The website encountered an unexpected error. Please try again later.Twig_Error_Syntax: A template that extends another one cannot include contents outside Twig blocks.

I tried putting the rest of code in node--article inside a block, this does work but the metablock block gets placed in the start of every article viewport (Not what I intended) I need it to be placed only in the head tag.

Hope I was clear enough, to summarize, How can I place meta tags in the head from the node--article.html file, not the html.html file.

Foi útil?

Solução

You're going about it the wrong way, you cannot affect other Twig template files, it needs to be done way before you get to Twig. Everything you want to can be done using the Metatag module:

Supports a large number of commonly used meta tags, including the page title, canonical URL, description, etc, and for Facebook's Open Graph, Twitter Cards and Dublin Core via included submodules (see full list)

Licenciado em: CC-BY-SA com atribuição
Não afiliado a drupal.stackexchange
scroll top