¿Cómo usar get_template_directory_uri() para cargar una imagen que está en una subcarpeta de mi tema?

Question

¿Cómo usar get_template_directory_uri() para cargar una imagen que está en una subcarpeta de mi tema?

21 ene 2014, 14:28:17

Vistas: 32.9K

Votos: 4

¿Cómo puedo insertar una imagen que está en una subcarpeta dentro del directorio de mi tema?

Tengo la siguiente situación: En el directorio de mi tema personalizado tengo la siguiente carpeta que contiene una imagen jpg: /assets/img/flexslider/flex-1.jpg

Ahora en mi archivo header.php, tengo algo como esto:

<li>
  <img src="assets/img/flexslider/flex-1.jpg">
  <div class="flex-caption">
    <p class="flex-caption-text">
      <span>Lorem ipsum</span><br>
      <span>sit dolor</span><br>
      <span>adipiscing elitur</span>
    </p>
  </div>
</li>

Obviamente, cuando cargo la página, la imagen flex-1.jpg no se carga porque no tiene la ruta correcta (de hecho, usando FireBug obtengo que intenta cargar la imagen assets/img/flexslider/flex-1.jpg) ¡así que podría usar la ruta absoluta pero esto es bastante horrible!

Entonces estoy pensando en usar la función get_template_directory_uri() proporcionada por WordPress para hacer esto y he intentado cambiar el código anterior de esta manera:

<li>
  <img src=<?php get_template_directory_uri().'/assets/img/flexslider/flex-1.jpg' ?>>
  <div class="flex-caption">
    <p class="flex-caption-text">
      <span>Lorem ipsum</span><br>
      <span>sit dolor</span><br>
      <span>adipiscing elitur</span>
    </p>
  </div>
</li>

Pero no está funcionando y usando FireBug puedo ver que no está cargando nada, de hecho en el código fuente de mi navegador tengo:

<img src="">

¿Qué me estoy perdiendo?

AndreaNobili

878

funciones desarrollo de temas imágenes

Todas las respuestas a la pregunta

Comentarios

muchas gracias :-)

AndreaNobili

21 ene 2014 16:11:01

¡¡¡Muchas gracias!!!

Vương Hữu Thiện

2 nov 2020 19:46:06

Una forma más dinámica es agregar esta línea en tu archivo functions.php

add_theme_support( 'custom-logo' );
Para mostrar la imagen usa

$custom_logo_id = get_theme_mod( 'custom_logo' );
$image = wp_get_attachment_image_src( $custom_logo_id , 'full' );
echo '<img src=$image[0] height="100px" />';

Saber más

MD SHAYON

111

28 dic 2020 01:53:38

Comentarios

¿Por qué crees que el OP quiere un logotipo personalizado? No veo cómo llegaste a esa conclusión a partir de la pregunta.

Tony Djukic

30 dic 2020 01:56:47

<img src='<?= get_template_directory_uri() . "./assets/img/flexslider/flex-1.jpg" ?>' alt="flex">

Estás cambiando <?php ?> por <?= ?> o <?php echo ?>

Duy Nguyen

1

3 ene 2024 13:14:16

Raja67 419 · Accepted Answer · 2014-01-21T14:39:42Z

Deberías hacer un echo y además estás cerrando incorrectamente tu etiqueta php. Mira el código fuente generado para tener una idea

<img src="<?php echo get_template_directory_uri()."/assets/img/flexslider/flex-1.jpg"?>" alt="nombre_alternativo">

o puedes usar bloginfo que es más fácil de recordar y usar (No necesitas hacer echo)

<img src="<?php bloginfo('template_url'); ?>/assets/img/flexslider/flex-1.jpg"/>

Raja67

419

21 ene 2014 14:39:42