Passando variáveis entre Javascript e PHP com WordPress

É muito comum precisarmos transitar dados entre o back-end e o front-end de uma aplicação, e nesta semana, em um projeto de ecommerce utilizando WordPress precisei utilizar um dado proveniente do PHP para que determinado evento ocorresse no front com o Javascript.

Sendo assim, fui atrás de uma transição nativa entre dados dentro do WordPress, com isto encontrei a função wp_localize_script que funciona da seguinte maneira:

Basicamente a ordem dos parâmetro é: nome do script que é registrado antes, em seguida vem o nome do objeto JS que guardará os dados recebidos e por último o array do PHP com os dados.

E então como aplicar isto?
Simples, pode-ser usar de N formas, desde inserindo no arquivo functions.php, até inserindo isto dentro do seu plugin. Para este exemplo irei aplicar o hook dentro do arquivo functions.php.

Vamos lá, tudo comentado:

Com isto, a variável passada pelo array no PHP estará disponibilizada dentro do objeto “objeto_javascript”, onde para acessar basta inserir no js, onde se deseja exibir, da seguinte maneira:

Já dentro do JS você se encontra livre para usar a variável onde e como bem quiser, neste caso acima o exemplo, no console, é para fins de debug do tutorial.

Espero que isto tenha lhe ajudado, qualquer tipo de dúvida basta mandar bala nos comentários abaixo!

Obrigadíssimo e bom domingo a todos!