Obtenga la ruta a los activos del tema en la plantilla Twig

22

Tengo una pregunta sobre cómo obtener una ruta a una imagen en una plantilla Twig. La imagen no está asignada a un campo o algo. Solo una imagen estática que se almacena en "MYTHEME / image / icon / my-icon.png".

En Drupal 7 obtengo la ruta en mi nodo.template con el siguiente código:

<img src="<?php print base_path() . path_to_theme(); ?>/image/icons">/my-icon.png

¿Cómo funciona en Drupal 8? Traté de pasar una variable en template_preprocess_node().

MITO.tema:

$variables['images_path'] = \Drupal::theme()->getActiveTheme()->getPath() . '/image/';

Plantilla de ramita:

<img src="{{ images_path  ~ 'icons/' ~ 'my-icon.png' }}">

No funciona No hay error de PHP, pero se dice erróneamente que la ruta es http: //localhost/node/themes/template/image/icons/my-icon.png .

Stephan Hofmann
fuente
"la ruta es incorrecta", eso no es muy útil :) También debe hacer el preprocesamiento en el archivo de tema del tema, no en la función global tmeplate_preprocess_hook y debe usar drupal_get_path ('theme', 'yourtheme').
@ user21641 drupal_get_pathes para D7 :)
Chapabu
1
También es para 8 @Chapabu ...
Clive
Bueno, ¡derribadme con una pluma!
Coloréame
De hecho, también es para D8. Lo he usado así:$themePath = Url::fromUserInput('/' . drupal_get_path('theme', '[themename]')
Vodde

Respuestas:

51

puede usar {{ base_path ~ directory }}lo que solucionará el problema absoluto, no es necesario realizar ningún procesamiento previo, ambas variables están incluidas por core.

Por ejemplo

<img src="{{ base_path ~ directory }}/images/logo.png" alt="My Logo" />

PD. el ~ayudante en ramita es concatenar.

Editar: al menos en la página * .html.twig templates se incluye la variable base_path, posiblemente deba realizar un preprocesamiento para otras plantillas, puede verificar fácilmente {{ dump() }}si las variables están presentes

// File: THEMENAME.theme in your theme's root directory
function THEMENAME_preprocess(&$variables, $hook)
{
    $variables['base_path'] = base_path();
}
pjcarly
fuente
3
Gracias por compartir su solución. Un comentario rápido: tuve que agregar explícitamente $ variables ['base_path'] = base_path (); a mi gancho de tema THEME_preprocess_html para que esté disponible para el archivo de plantilla html.html.twig.
Marcos Buarque
1
Tenga cuidado al usar la {{ directory }}variable Twig en un tema que piensa usar como tema base y cree subtemas para: drupal.stackexchange.com/questions/277278
JamesWilson
1
El módulo de sugerencias de plantilla de ramita proporciona {{ base_bath }}a cada plantilla; de lo contrario, para algunas plantillas, tendrá que hacer lo que hizo Marcos Buarque en el comentario anterior, o Matoeil lo hizo en drupal.stackexchange.com/a/238535/4195
mlncn
9

Por defecto, hay una {{ directory }}variable que puede usar que apunta a su directorio de temas. El problema es que no es absoluto, como el que agregaste. Creo que es un error en el núcleo porque debería incluir la ruta base, pero cambiar eso, por supuesto, rompería los sitios existentes que lo usan.

Por lo tanto, debe agregar un / delante de él; esto se rompería si Drupal está instalado en una subcarpeta. Puede codificar eso en su plantilla o seguir usándolo base_path()como lo hizo en 7.x en una variable personalizada.

Berdir
fuente
¿Cómo usar la imagen de /sites/default/files/MyFolder? Tengo una imagen MyImage.jpg en MyFolder. Ahora, en la plantilla de ramita si escribí <img src={{ url }} alt={{ text }}>Aquí, la variable url tiene la ruta /MyFolder/MyImage.jpg pero no funciona.
Jasodeep Chatterjee
2
Como escribió Berdir: uno simplemente puede usar <img src="/{{ directory }}/path/to/image"/>para obtener un camino absoluto.
daniels
7
<img src="/{{ directory }}/images/logo.png"/> 

trabajó para mí cuando

<img src="{{ base_path ~ directory }}/images/logo.png" alt="My Logo" />

No

para la plantilla de contenido, tuve que usar en .module

   function hook_preprocess(&$variables, $hook) {

  $module_handler = Drupal::service('module_handler');
  $path = $module_handler->getModule('myModuleName')->getPath();

  if(isset($variables['region']) && $variables['region'] == 'content'){
    $variables['module_path'] = $path;
    $variables['http_host'] = $_SERVER['HTTP_HOST'];

y

  <img src="{{ module_path }}/images/error404.png" />
  <img src="//{{ http_host }}/{{ module_path }}/images/error403.png" />
Matoeil
fuente
3
Esta respuesta debería ser marcada como correcta en su lugar
Jignesh Rawal