Plugin: URL relativa a las imágenes en otra carpeta a la que se accede dentro de un archivo JS

2

Tengo esta estructura de archivos de plugins de Wordpress con "myfolder" como carpeta principal. Hay otra subcarpeta dentro de esta carpeta principal llamada "recursos". Dentro de esta carpeta de recursos contiene dos subcarpetas: a) JS b.) Imágenes

Dentro de la carpeta de imágenes tengo una imagen "myimage.png". Dentro del archivo JS, tengo un script llamado "myscript.js".

Me gustaría acceder a la imagen "myimage.png" en la carpeta de imágenes dentro de mi archivo javascript "myscript.js".

He intentado lo siguiente pero no funciona (no se resuelve):

<img src="../images/myimage.png">
<img src="images/myimage.png">
<img src="resources/images/myimage.png">
<img src="../resources/images/myimage.png">
<img src="myfolder/resources/images/myimage.png">
<img src="../myfolder/resources/images/myimage.png">

Por supuesto, la ruta URL absoluta funciona, pero quiero que esta aplicación funcione con otros sitios, por lo que codificar la ruta URL absoluta no es una solución viable.

Sé que Wordpress también tiene esta función mágica:

$myicons= plugins_url('resources/images/myimage.png', __FILE__ );

Pero eso funcionará solo dentro del archivo de complemento de PHP y estoy accediendo a la imagen dentro de un archivo JS. ¿Alguna idea de cómo hacer que esto funcione sin reorganizar la estructura de archivos actual? ¿Existe una función JS equivalente a "plugins_url" en Wordpress? Gracias por cualquier consejo.

    
pregunta Emerson Maningo 07.01.2013 - 05:35

1 respuesta

5

Para este propósito, puede utilizar la función wp_localize_cript() , como esto:

function localize_my_script() {
    $image_url = plugins_url( 'resources/images/myimage.png', __FILE__ );
    $localizations = array( 'imageURL' => $image_url );

    wp_localize_script( 'my-script-handle', 'localizedVars', $localizations );
}
add_action( 'wp_enqueue_scripts', 'localize_my_script' );

Suponiendo que hayas colocado correctamente tu secuencia de comandos con my-script-handle handle como ejemplo.

    
respondido por el Mateusz Hajdziony 07.01.2013 - 05:47

Lea otras preguntas en las etiquetas