web-dev-qa-db-fra.com

Script de mise en file d'attente dans une page spécifique

Je construis un thème wordpress avec un tableau de bord avec des options, mais lorsque je lis quelque part, le code de script de mise en file d'attente que j'utilise se contente de le mettre en file d'attente dans le backend, mais il se charge dans chaque page du backend. Donc, j'ai des conflits JS ...

J'ai ce code:

add_menu_page($themename, $themename, 'administrator', basename(__FILE__), 'ikos_admin');
add_submenu_page(basename(__FILE__), $themename . ' Options', 'Theme Options', 'administrator',  basename(__FILE__),'ikos_admin'); // Default
}


function ikos_add_init() {

    $file_dir=get_bloginfo('template_directory');
    wp_enqueue_style("ikosCss", $file_dir."/functions/theme-options.css", false, "1.0", "all");
    wp_enqueue_script("ikosScript", $file_dir."/functions/theme-options.js");
    wp_enqueue_script("ikospickerScript", $file_dir."/functions/color-picker.js", array( 'farbtastic', 'jquery' ) );
    wp_enqueue_style( 'farbtastic' );
    wp_enqueue_style( 'farbtastic' );
    wp_register_script('my-upload', $file_dir."/functions/upload.js");
    wp_enqueue_script('my-upload');

        if(function_exists( 'wp_enqueue_media' )){
        wp_enqueue_media();
}else{
        wp_enqueue_style('thickbox');
        wp_enqueue_script('media-upload');
        wp_enqueue_script('thickbox');
      }

}

Alors, comment puis-je mettre en file d'attente ces scripts dans cette page d'administration spécifique uniquement ??? Merci: D

EDITYEAH NOW IT IS TRAVAILLE! Nouveau code utilisant le hook, puis j'ai ajouté le var_dump ($ hook_suffix); exactement avant l'instruction abort/return telle que @kaiser me l'a dit dans les commentaires et qui l'a imprimé: ** chaîne (0) "" chaîne (27) "toplevel_page_theme-options" **.

Donc, je viens d'ajouter le "toplevel_page_theme-options" dans ikos_add_init ($ hook_suffix) et ça marche!

$hook_suffix = add_menu_page($themename, $themename, 'administrator', basename(__FILE__), 'ikos_admin');
add_submenu_page(basename(__FILE__), $themename . ' Options', 'Theme Options', 'administrator',  basename(__FILE__),'ikos_admin'); // Default

}


add_action( 'admin_enqueue_scripts', 'ikos_add_init' );

function ikos_add_init($hook_suffix) {
    if ( 'toplevel_page_theme-options' !== $hook_suffix )
    return;
    $file_dir=get_template_directory_uri();
    wp_enqueue_style("ikosCss", $file_dir."/functions/theme-options.css", false, "1.0", "all");
    wp_enqueue_script("ikosScript", $file_dir."/functions/theme-options.js");
    wp_enqueue_script("ikospickerScript", $file_dir."/functions/color-picker.js", array( 'farbtastic', 'jquery' ) );
    wp_enqueue_style( 'farbtastic' );
    wp_enqueue_style( 'farbtastic' );
    wp_register_script('my-upload', $file_dir."/functions/upload.js");
    wp_enqueue_script('my-upload');

        if(function_exists( 'wp_enqueue_media' )){
            wp_enqueue_media();
}else{
        wp_enqueue_style('thickbox');
        wp_enqueue_script('media-upload');
        wp_enqueue_script('thickbox');
      }

}
wp-enqueue-scriptdashboard
5
Cynthia Lara

Dans admin-header.php, il y a les crochets suivants:

do_action('admin_enqueue_scripts', $hook_suffix);
do_action("admin_print_styles-$hook_suffix");
do_action('admin_print_styles');
do_action("admin_print_scripts-$hook_suffix");
do_action('admin_print_scripts');
do_action("admin_head-$hook_suffix");
do_action('admin_head');

L'un àtoujours _ utilise-le admin_enqueue_scripts, tous deux pour la feuille de styleetscripts. Plus d'infos dans cette réponse .

Il a un argument supplémentaire, le $hook_suffix. Cet argument estexactementidentique à la valeur de retour que vous obtenez de add_submenu_page() et aux fonctions associées (raccourci).

Exemple

Remarque: L'exemple suivant suppose que vous avez déjà enregistré le script précédemment. Il est donc disponible avec le descripteur/identificateur your_handle.

add_action( 'admin_enqueue_scripts', 'wpse113509_register_script' );
function wpse113509_register_script( $hook_suffix )
{
    if ( 'dashboard.php' !== $hook_suffix )
        return;

    wp_enqueue_script( 'your_handle' );
}

Notes complémentaires

Comme je vois que vous identifiez le répertoire racine Themes à l'aide de get_option('template_directory'), je dois laisser une petite note supplémentaire, car ce n'est pas comme cela que nous procédons aujourd'hui, cette information provient alors de la base de données, ce que vous souhaitez éviter. Il ignorera également les filtres par défaut en place pour cela:

  • get_template_directory() - Path au répertoire racine du thème parent
  • get_stylesheet_directory() - Path au répertoire racine du thème enfant
  • get_template_directory_uri() - URL au répertoire racine du thème parent
  • get_stylesheet_directory_uri() - URL au répertoire racine du thème enfant
  • plugin_dir_path( __FILE___ ) - Racine du fichier actuel, que ce soit dans le thème enfant/parent ou dans un plugin. Résultat final tronqué.

Ensuite, il y a wp_get_theme(), qui appelle une instance de WP_Theme pour le thème actuellement actif.

$current_theme = wp_get_theme();
$current_theme->get_theme_root();
$current_theme->get_template();
$current_theme->get_template_directory();

Si vous avez un thème enfant, vous pouvez aussi simplement appeler $current_theme->parent() pour accéder à toutes les autres méthodes WP_Theme de l'occurrence de thèmes parent. Par exemple.

$current_theme->parent()->get_theme_root();

Cela permet également d'accéder aux informations d'en-tête du thème. Par exemple Name, DomainPath, etc.

EDIT: Une explication mise à jour et encore plus détaillée peut être trouvée dans ce post sur WPKrauts .

6
kaiser

Examinez l’URL de la page dans laquelle vous souhaitez placer le fichier js. Ça pourrait être comme

/wp-admin/edit.php?post_type=cpt&page=thisfile.php

Ensuite, il suffit d'utiliser ça comme

if($_GET['page'] == 'thisfile.php' AND is_admin())
    wp_enqueue_script('media-upload');
1
Doug Cassidy