Obtener La URL Del Home Con JavaScript En WordPress

Aveces en JavaScript necesitamos acceder a la URL del home donde se encuentra la instalación de nuestro blog con WordPress, para no tener que especificar una URL estática en nuestro código, por lo tanto necesitamos obtenerla de forma dinámica por si en dado caso nuestro dominio o URL cambia.

Lo primero que debemos hacer es lo siguiente:

<script type="text/javascript">

var homeURL = '<?php echo home_url( "/" ); ?>';

/* resultado: http://mi-url.com/ */

</script>

De esta forma podemos usar esa variable como la URL del home en caso que se tenga que hacer referencia a ella mediante JavaScript. Un ejemplo más practico sería, si queremos acceder a la carpeta de imágenes de nuestro tema, solo tenemos que hacerlo de la siguiente manera:

<script type="text/javascript">

var templateImage = '<?php echo get_template_directory_uri( "/images/" ); ?>';

/* resultado: http://mi-url.com/wp-content/themes/images/ */

</script>

Y podemos hacer uso de ella en nuestro script:

jQuery( "body" ).css( "backgroundImage", templateImage );

Hay que tomar en cuenta que la variable la debemos declarar antes de la función wp_head() de nuestro tema, ya que WordPress utiliza esa función para llamar otros scripts como jQuery.

Otra manera un poco más limpia de implementar este método es haciendo uso de wp_localize_script.