web-dev-qa-db-fra.com

Comment puis-je inclure du code JavaScript utilisant jQuery côté administrateur?

J'essaye ceci:

add_action('admin_print_scripts', 'custom_admin_scripts' ); 
function custom_admin_scripts() {   
    echo '<script type="text/javascript" src="' . get_bloginfo('stylesheet_directory') . /admin-scripts.js"></script>';
 }

mais de cette façon, il ne reconnaît pas jQuery. Donc, je reçois Uncaught ReferenceError: jQuery is not defined.
Je pense que c'est parce que jQuery est lié après mon script. Comme je le vois dans la source HTML:

<script type="text/javascript" src="http://localhost:8080/wp-test/wp-content/themes/test/admin-scripts.js"></script>
<script type="text/javascript" src="http://localhost:8080/wp-test/wp-admin/load-scripts.php?c=1&amp;load=jquery,utils&amp;ver=edec3fab0cb6297ea474806db1895fa7"></script>

Comment puis-je le réparer?

2
s976

Le problème est que vous chargez votre script avant le chargement de jQuery.

Ne pas imprimer les scripts directement .

Vous devez (enregistrer puis) ​​les mettre en file d'attente à l'aide de l'API fournie. jQuery est déjà un script enregistré, vous pouvez donc le mettre en file d'attente (par exemple sur le hook admin_enqueue_scripts).

Cependant, vous ne devez charger jQuery que si vous chargez un script personnalisé le nécessitant. Dans ce cas, vous devez mettre en file d'attente votre script personnalisé et ajouter jQuery en tant que dépendance. WordPress gérera alors le chargement des scripts et dans le bon ordre:

add_action('admin_enqueue_scripts','wptuts53021_load_admin_script');
function wptuts53021_load_admin_script( $hook ){
    wp_enqueue_script( 
        'wptuts53021_script', //unique handle
        get_template_directory_uri().'/admin-scripts.js', //location
        array('jquery')  //dependencies
     );
}

Remarques latérales

  • Utilisez get_template_directory_uri() plutôt que get_bloginfo()
  • Utilisez le $hook passé (qui sera edit.php, post.php, post-new.php etc.) et get_current_screen() pour déterminer si vous vous trouvez sur une page nécessitant le chargement de votre script. Ne chargez les scripts que lorsque vous en avez réellement besoin.

E.g (exemple du Codex):

function my_enqueue($hook) {
    //Load only on edit.php pages
    //You can use get_current_screen to check post type
    if( 'edit.php' != $hook )
        return;
    wp_enqueue_script( 'my_custom_script', plugins_url('/myscript.js', __FILE__) );
}
add_action( 'admin_enqueue_scripts', 'my_enqueue' );
7
Stephen Harris

Premièrement, incluons-les de manière appropriée.

add_action( 'wp_enqueue_scripts', 'custom_admin_scripts' );

function custom_admin_scripts() {

  wp_register_script( 'admin-scripts', get_template_directory_uri() . '/js/admin-scripts.js', array('jquery'), '1.0', true );

  if ( is_admin() ) {
    wp_enqueue_script('admin-scripts');
  }

}

Deuxièmement, lisez ici http://wpcandy.com/teaches/how-to-load-scripts-in-wordpress-themes

0
Daniel