PHP δεδομένα σε JavaScript,
WordPress | wp_localize_script

Έδειξα σε προηγούμενο άρθρο πως μεταφέρουμε PHP δεδομένα σε JavaScript μέσω JSON. Ο τρόπος είναι απλός και εύκολος.

Στο WordPress είναι ακόμα πιο εύκολος, με την δύναμη του wp_localize_script(). Είναι η συνάρτηση που κάνει ακριβώς αυτό το πράγμα, με τον παρακάτω τρόπο.

wp_localize_script: PHP -> JavaScript

Για να χρησιμοποιήσουμε το wp_localize_script, πρέπει προηγουμένως να έχουμε δημιουργήσει – “ενεργοποιήσει” ένα εξωτερικό JavaScript αρχείο μέσω της wp_enqueue_script (δεν είναι σκοπός του παρόντος άρθρου να αναλύσει το συγκεκριμένο).

Στη συνέχεια δημιουργούμε ένα PHP array, όπου αποθηκεύουμε όλα τα δεδομένα που θα χρειαστούμε στο JavaScript αρχείο.

Στο wp_localize_script δηλώνουμε κατά σειρά:

1. Το handle name του script μας που δηλώσαμε στο wp_enqueue_script
2. Ένα οποιδήποτε όνομα που θα το χρησιμοποιήσουμε ως JavaScript object
3. Το PHP array που δημιουργήσαμε με τα δεδομένα

PHP file

wp_enqueue_script('test', get_stylesheet_directory_uri() . '/js/test.js', array(), '1.0', true);
$my_array = array('key' => '123', 'name' => 'abc');
wp_localize_script('test', 'my_js_object_name', $my_array);

JavaScript file

console.log(my_js_object_name.key);
console.log(my_js_object_name.name);

Χρησιμοποιώντας το όνομα που δηλώσαμε στο βήμα 2. (το οποίο είναι πλέον JavaScript object) έχουμε πρόσβαση σε όλες τις τιμές.

…Τόσο απλά και τόσο γρήγορα