Enviar variables PHP a un JS en WordPress

Vamos a mostrar la forma correcta de envíar variables PHP a un JS en un WordPress y para ello usaremos funciones que nos brinda el CODEX.

Primero debemos registrar el JS usando la función wp_register_script()  y luego hay que colocarlo en el front con la función wp_enqueue_script()  y una vez ahí, vamos a pasarle variables con la función wp_localize_script() .

Vamos a poner un ejemplo aquí, este código debe ir en tu plugin:

<?php
function letsgo_enqueue_scripts() {

	$apikey = 'APIKEY_GOOGLE_MAPS';

	// Google Maps
	wp_register_script('letsgo-map', '//maps.googleapis.com/maps/api/js?key='.$apikey.'&v=3.exp&libraries=geometry',array('jquery'),false,true);
	wp_enqueue_script('letsgo-map');


	// Voffer JS
	$array_voffers = array( 'var1' => 1, 'var2' => 3 );

	wp_register_script('letsgo-ext', plugins_url('assets/js/voffers.js', __FILE__),array('jquery'),false,true);
	wp_enqueue_script('letsgo-ext');

	wp_localize_script('letsgo-ext', 'vofferjs', $array_voffers );

}
add_action('wp_enqueue_scripts', 'letsgo_enqueue_scripts');
?>

 

Aquí hemos agregado 2 JS, uno de Google Maps el cual registramos y luego colocamos en el pie de página (el 5to parámetro dice true). Además con ayuda de los parámetro estamos indicando que este JS depende de JQuery, así que esto afecta el orden de como aparecerá en el front.

Y el segundo es un JS que está dentro del mismo plugin llamado voffers, pero aquí si hemos agregado la parte donde envíamos variables PHP al JS.

Como ven wp_localize_script()  se encarga de enviar esas variables en un array, y los encierra en una variable global llamado vofferjs. Ahora vamos a ver como debe ser llamado en el js voffers.js.

console.log(vofferjs.var1);
console.log(vofferjs.var2);

 

Y lo podrán ver en su consola. Y si desean pasar variables de JS a PHP en generar debes usar AJAX.

Recuerden que deben usas estas funciones para tener un código limpio y ordenado.

 

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
Back to Top
0
Would love your thoughts, please comment.x
()
x