Wordpress 插件开发 - 只在我们需要的地方加载排队的文件

Question

我开发了 2 个 Wordpress 插件，我正在尝试仅在我需要的地方加载所需的 css 和 js 文件。

我写了一个函数：

function ds_shortcodes_enqueue() {

$shortcodes_pages = array(
    "shortcodes_plugin",
    "add_shortcode",
    "edit_shortcode"
);
$the_page = isset($_GET['page']);
if(in_array($the_page,$shortcodes_pages)){

    // enqueue all our scripts
    wp_enqueue_style( 'ds-shortcodes-style', plugins_url( '/admin/css/shortcodes-style.css', __FILE__ ) );

    wp_enqueue_script( 'ds-shortcodes-script', plugins_url( '/admin/js/shortcodes-scripts.js', __FILE__ ) );

    }
}
add_action( 'admin_enqueue_scripts', 'ds_shortcodes_enqueue' );

该函数应该只在包含数组中提到的 slug 的页面上加载文件。

然后，我写了第二个插件。不同的名称，不同的文本域，不同的功能，我使用了相同的功能：

function ds_videos_enqueue() {

$videos_pages = array(
  "videos_plugin",
  "add_video",
  "edit_video",
  "edit_video_category",
  "video_categories",
  "edit_video_level",
  "video_levels",
  "video_shortcode"
);
$current_page = isset($_GET['page']);
if(in_array($current_page,$videos_pages)){
    wp_enqueue_style( 'ds-videos-style', plugins_url( '/admin/css/videos-style.css', __FILE__ ) );

    wp_enqueue_script( 'ds-videos-script', plugins_url( '/admin/js/videos-scripts.js', __FILE__ ) );
    }
}
add_action( 'admin_enqueue_scripts', 'ds_videos_enqueue' );

问题来了。

他们在管理中的任何插件页面上从两个插件加载文件。

我只是不明白。

我找不到解决这个问题的方法。

似乎 in_array() returns 总是正确的。

希望能帮到你

谢谢。

Answer 1

wp-admin 中有一个名为 $pagenow 的全局变量，它保存当前页面的名称，即 edit.php、post.php 等

您还可以检查 $_GET 请求以进一步缩小您的位置范围，例如：

function ds_shortcodes_enqueue() {

$shortcodes_pages = array(
    "shortcodes_plugin",
    "add_shortcode",
    "edit_shortcode"
);
if ( isset($_GET['page']) ) {
    global $pagenow;
if(in_array($pagenow,$shortcodes_pages)){


    // enqueue all our scripts
    wp_enqueue_style( 'ds-shortcodes-style', plugins_url( '/admin/css/shortcodes-style.css', __FILE__ ) );

    wp_enqueue_script( 'ds-shortcodes-script', plugins_url( '/admin/js/shortcodes-scripts.js', __FILE__ ) );

    }
    }
}
add_action( 'admin_enqueue_scripts', 'ds_shortcodes_enqueue' );




function ds_videos_enqueue() {

$videos_pages = array(
  "videos_plugin",
  "add_video",
  "edit_video",
  "edit_video_category",
  "video_categories",
  "edit_video_level",
  "video_levels",
  "video_shortcode"
);
if ( isset($_GET['page']) ) {
    global $pagenow;
if(in_array($pagenow,$videos_pages)){
    wp_enqueue_style( 'ds-videos-style', plugins_url( '/admin/css/videos-style.css', __FILE__ ) );

    wp_enqueue_script( 'ds-videos-script', plugins_url( '/admin/js/videos-scripts.js', __FILE__ ) );
    }
}
}
add_action( 'admin_enqueue_scripts', 'ds_videos_enqueue' );

似乎 in_array() returns 总是正确的。

<?php 

$videos_pages = array(
  'videos_plugin',
  'add_video',
  'edit_video',
  'edit_video_category',
  'video_categories',
  'edit_video_level',
  'video_levels',
  'video_shortcode'
);
$current_page = isset($_GET['page']);
if(in_array($current_page,$videos_pages,true)){
    echo 'I am debug point';
}else{
    echo 'I am debug point 2';
}

exit;
?>

Answer 2

我也试过了，但 in_array 似乎不起作用。

function ds_shortcodes_enqueue() {

    $shortcodes_pages = array(
      "shortcodes_plugin",
      "add_shortcode",
      "edit_shortcode"
    );

    if(in_array("shortcodes_plugin", $shortcodes_pages)){

    // enqueue all our scripts
    wp_enqueue_style( 'ds-shortcodes-style', plugins_url( '/admin/css/shortcodes-style.css', __FILE__ ) );

   wp_enqueue_script( 'ds-shortcodes-script', plugins_url( '/admin/js/shortcodes-scripts.js', __FILE__ ) );

}
add_action( 'admin_enqueue_scripts', 'ds_shortcodes_enqueue' );

它应该只在带有 slug "shortcodes_plugin" 的页面上排队 2 个文件。它到处加载文件。

Answer 3

admin_enqueue_scripts 将页面挂钩传递给回调函数。所以，你可以这样做，

function ds_shortcodes_enqueue($hook) {
    if($hook != 'page_where_you_want_scripts') {
        return;
    }
    wp_enqueue_style( 'ds-shortcodes-style', plugins_url( '/admin/css/shortcodes-style.css', __FILE__ ) );
    wp_enqueue_script( 'ds-shortcodes-script', plugins_url( '/admin/js/shortcodes-scripts.js', __FILE__ ) );
}
add_action( 'admin_enqueue_scripts', 'ds_shortcodes_enqueue' );

Reference

Wordpress 插件开发 - 只在我们需要的地方加载排队的文件

Wordpress plugin development - Load the enqueued files only where we need them

wordpress

enqueue