Hello devs, in this tutorial i will discuss about wp_localize_script() in wordpress. How we can use wp_localize_script() function in our wordpress app, i will show you it. Have you heard before about wp_localize_script() ?
Sometimes we need to pass data from php file to javascript file. Using wp_localize_script() we can pass data from php file to javascript easily. In this wp_localize_script() example tutorial, i will simply pass data from php file to javascript file.
Let's see the example.
wp_enqueue_script('this_is_your_handle_name', 'assets/js/script.js',array('jquery'),'1.0.0',true);
Look in this above we just include our script.js file with handle name. We need this handle name when we will use wp_localize_script().
functions.php
wp_localize_script( 'handle_name', 'js_file_object_name', [
//data goes here
]);
Look, wp_localize_script() take two parameter, one is handle name and other is object name. We can use this object name to access this value from wp_localize_script() data.
functions.php
wp_enqueue_script('this_is_your_handle_name', 'assets/js/script.js',array('jquery'),'1.0.0',true);
wp_localize_script( 'this_is_your_handle_name', 'your_object_name', [
'data' => 'CodeChief is Awesome'
]);
Look, now we can access this above data using your_object_name from script.js file. As we mentioned script.js with the handle name this_is_your_handle_name. Hope you will understand. Now in our script.js file
script.js
;(function($){
$(document).ready(function(){
//we can use data from here like
var _data = your_object_name.data;
console.log(_data);
});
})(jQuery);
Read also : How to Remove WordPress Version Number
Hope it can help you. Now you can use wp_localize_script() in your wordpress application to make it more awesome.
#wordpress