如何将自己的javascript/css文件添加到wordpress插件菜单页面？

我想写我的第一个WordPress插件，可能需要一些帮助。当我点击我的插件的菜单项时，我不知道如何将我的JavaScript文件添加到仪表板区域的头部。这是我迄今所做的：如何将自己的javascript/css文件添加到wordpress插件菜单页面？

第一步：创建的目录，在目录wp-content/plugins一个php文件，添加插件这样的头：

/* Plugin Name: Test Plugin 
Plugin URI: http://my-plugin.com/ 
Description: test test test 
Version: 1.0 
Author: me 
Author URI: http://my-plugin.com/ 
License: GPLv2 or later 
*/

第2步：使用此功能，我可以在仪表板菜单底部添加我的插件名称（顶级菜单项名称）。我甚至不知道名字和slu name名称为什么被列出两次。我从：here得到了该代码。我也不知道“mt-top-level-handle”在做什么。它没有功能，它仍然有效。 “manage_options”是定义此页面上用户权限的能力变量。（任何人都知道如何使管理员此页面accessable，（作家）只？）

add_action('admin_menu', 'register_my_menu_item'); 
function register_my_menu_item() { 
    add_menu_page(__('top level menu item name','slug-name'), __('top level menu item name','slug-name'), 'manage_options', 'mt-top-level-handle', 'my_plugins_page'); 
}

第三步：插件页面这个简单的功能显示“Hello World”。

function edit_table_page() { 
?> 
    <h2>Hello World</h2> 
<?php 
}

现在我想知道如何在该插件页面上使用我的JavaScript文件。我需要在jquery文件加载后添加它。

所有我发现有关添加脚本是这样的：

add_action('wp_enqueue_scripts', 'my_scripts'); 
function my_scripts() { 
    wp_enqueue_script('jquery'); 
    wp_register_script('my_script', plugins_url('js/my_script.js', __FILE__),array("jquery")); 
    wp_enqueue_script('my_script'); 
}

这没有奏效。那么如何做到这一点？ :)

来源

2013-12-18 user2718671

检查这个答案http://stackoverflow.com/a/38050537/1153703 –

成功，则返回hookname。您可以利用，要排队脚本的动态load-{$hookname}钩：

add_action('admin_menu', 'register_my_menu_item'); 
function register_my_menu_item() 
{ 
    $my_plugins_page = add_menu_page(
     __('top level menu item name','my_plugin_textdomain'), 
     __('top level menu item name', 'my_plugin_textdomain'), 
     'manage_options', 
     'mt-top-level-handle', 
     'my_plugins_page' 
    ); 
    add_action('load-' . $my_plugins_page, 'so20659191_enqueue'); 
} 

function so20659191_enqueue() 
{ 
    wp_enqueue_script('my_script', plugins_url('js/my_script.js', __FILE__), array('jquery'), null, true); 
} 

function my_plugins_page() { 
?> 
    <h2>Hello World</h2> 
<?php 
}

来源

2013-12-18 13:51:19 diggy

Thx！很高兴知道！我会试试:) – user2718671

找到解决方案！加入JS-文件：

add_action('admin_enqueue_scripts', 'my_scripts'); // add scripts to dashboard head 
function my_scripts() { 
    wp_enqueue_script('jquery'); 
    wp_register_script('my_script', plugins_url('js/my_script.js', __FILE__),array("jquery")); 
    wp_enqueue_script('my_script');  
}

添加CSS文件：

add_action('admin_enqueue_scripts', 'my_styles'); 
function my_styles() { 
    wp_register_style('custom_wp_admin_css', plugins_url('my-plugin/css/style.css')); 
    wp_enqueue_style('custom_wp_admin_css'); 
}

来源

2013-12-18 13:50:55 user2718671

这将加载在所有管理页面脚本，不只是你的插件页面 – diggy

如何将自己的javascript/css文件添加到wordpress插件菜单页面？

回答

相关问题