Comment passer des variables PHP à JavaScript dans WordPress

Internet 2021-09-29 20:25:54 3 7,310

Lorsque vous créez un thème ou un plugin WordPress, vous avez parfois du code JavaScript qui doit utiliser des données/valeurs de PHP. Par exemple, vous avez besoin de ces valeurs dans votre code JavaScript :

    Homepage URL
    Theme option values
    WordPress posts data
    etc

Le moyen le plus simple de le faire est d’initialiser ces valeurs dans des objets JavaScript dans votre fichier de thème header.php ou votre hook wp_head. Par exemple :

<script>
var myThemeParams = {
   homeURL: <?php echo home_url(); ?>,
   themeOptions: <?php echo get_theme_mod( 'mytheme_options', false ); ?>,
}
</script>

Même si cela fonctionne, WordPress nous a fourni une fonction pour faire quelque chose comme ça. Il s’appelle wp_add_inline_script.

wp_add_inline_script( $handle, $data, $position = 'after' )
    $handle : Nom du script auquel ajouter le script en ligne.

    $data : Chaîne contenant le JavaScript à ajouter.

    $position : s’il faut ajouter le script en ligne avant ou après le handle.

Cette fonction ajoutera un script en ligne avant ou après votre code JavaScript. Il peut en fait faire plus que transmettre des variables PHP à JavaScript. Vous pouvez voir un autre cas d’utilisation ici.

Ainsi, pour utiliser wp_add_inline_script pour passer des variables de PHP à JavaScript, vous devez définir les propriétés de position sur before afin qu’il ajoute le script en ligne avant votre fichier JS. Et puis initialisez un objet JavaScript et définissez la valeur avec les données de PHP.

$myThemeParams = array(
    'homeURL' => home_url(),
    'themeOptions' => get_theme_mod( 'mytheme_options', false )
);
wp_enqueue_script( 'my-theme-script', get_template_directory_uri() . '/js/script.js' );
wp_add_inline_script( 'my-theme-script', 'var myThemeParams = ' . wp_json_encode( $myThemeParams ), 'before' );

Dans votre JavaScript, vous pouvez y accéder comme ceci :

console.log( myThemeParams.homeURL );
console.log( myThemeParams.themeOptions );

#WordPress#


Votre point de vue

Déjà 3 Réponses
  • forex 1楼
    Hi would you mind letting me know which hosting company you're working with? I've loaded your blog in 3 completely different web browsers and I must say this blog loads a lot faster then most. Can you recommend a good web hosting provider at a fair price? Thank you, I appreciate it!
    发布于 2022/03/17 09:11
  • free freaky porno 2楼
    Hi, all is going fine here and ofcourse every one is sharing data, that's in fact good, keep up writing.
    发布于 2022/03/11 07:16
  • cara buat robot forex sederhana 3楼
    Hello, all is going well here and ofcourse every one is sharing facts, that's in fact good, keep up writing.
    发布于 2022/02/03 21:59
  • Les meilleurs classements
    Dernière réponse