theme development - How to Globally Use wp_localize_script() Ajax URL

I have added this to my functions.php and need to use ajaxURL in all of enqueued scripts in the template (instead of enqueuing only one script here

add_action( 'wp_enqueue_scripts', 'ajaxify_enqueue_scripts' );
function ajaxify_enqueue_scripts() {
   wp_localize_script( 'ajaxify', 'ajaxURL', array('ajax_url' => get_template_directory_uri() . '/app/login.php' ));
}
add_action( 'wp_ajax_nopriv_set_ajaxify', 'set_ajaxify' );
add_action( 'wp_ajax_set_ajaxify', 'set_ajaxify' );

but when I try to call an ajax method I am getting this error

Uncaught ReferenceError: ajaxURL is not defined

Is there any way to add the ajaxURL to all scripts?

I have added this to my functions.php and need to use ajaxURL in all of enqueued scripts in the template (instead of enqueuing only one script here

add_action( 'wp_enqueue_scripts', 'ajaxify_enqueue_scripts' );
function ajaxify_enqueue_scripts() {
   wp_localize_script( 'ajaxify', 'ajaxURL', array('ajax_url' => get_template_directory_uri() . '/app/login.php' ));
}
add_action( 'wp_ajax_nopriv_set_ajaxify', 'set_ajaxify' );
add_action( 'wp_ajax_set_ajaxify', 'set_ajaxify' );

but when I try to call an ajax method I am getting this error

Uncaught ReferenceError: ajaxURL is not defined

Is there any way to add the ajaxURL to all scripts?

• theme-development
• ajax
• wp-localize-script

Share Improve this question edited Nov 16, 2018 at 4:47 Behseini asked Nov 16, 2018 at 4:29 BehseiniBehseini 53522 gold badges99 silver badges2525 bronze badges 2

• What action is ajaxify_enqueue_scripts hooked to? – Milo Commented Nov 16, 2018 at 4:40
• Hi Milo sorry I just updated the code (forget to add the action). As you can see it is hooked to 'wp_enqueue_scripts' – Behseini Commented Nov 16, 2018 at 4:48

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 2

You can conditionally echo the code on only few templates or specific pages. Here is an example:

add_action ( 'wp_head', 'my_js_variables' );
function my_js_variables(){
  // for specific page templates
  $current_template =  get_page_template();

  // return if there is no page template, or if the page template is other than template-x1.php or template-x2.php
  if( !isset($current_template) || ( $current_template != 'template-x1.php' && $current_template != 'template-x2.php' ) ){ return; } ?>
  <script type="text/javascript">
    var ajaxurl = <?php echo json_encode( admin_url( "admin-ajax.php" ) ); ?>; 
    var ajaxnonce = <?php echo json_encode( wp_create_nonce( "itr_ajax_nonce" ) ); ?>;
    var myarray = <?php echo json_encode( array(
         'foo' => 'bar',
         'available' => TRUE,
         'ship' => array( 1, 2, 3, ),
       ) ); ?>
  </script>
<?php
}

To have the ajaxurl variable available on the frontend the easiest way is to add this snippet to you theme’s function.php file:

add_action('wp_head', 'myplugin_ajaxurl');
function myplugin_ajaxurl() {
    echo '<script type="text/javascript">
           var ajaxurl = "' . admin_url('admin-ajax.php') . '";
         </script>';
}

This get the url of the ajax submission page and creates a variable in the head of the HTML with it. Now ‘ajaxurl’ is available in your theme so you can start making it more modern and dynamic.