OOP 如何在菜单页面上加载脚本样式
<?php
/*
* Plugin Name: Custom Admin Menu
*/
class SO_WP_Menu {
private $plugin_url;
public function __construct() {
$this->plugin_url = plugins_url( '/', __FILE__ );
add_action( 'plugins_loaded', array( $this, 'init' ) );
}
public function init() {
add_action( 'admin_menu', array( $this, 'add_menu' ) );
}
public function add_menu() {
$hook = add_menu_page(
'My Menu', // Title, html meta tag
'<span style="color:#e57300;">My Menu</span>', // Menu title, hardcoded style
'edit_pages', // capability
'dummy-page-slug', // URL
array( $this, 'content' ), // output
null, // icon, uses default
1 // position, showing on top of all others
);
add_action( "admin_print_scripts-$hook", array( $this, 'scripts' ) );
add_action( "admin_print_styles-$hook", array( $this, 'styles' ) );
}
public function content() {
?>
<div id="icon-post" class="icon32"></div>
<h2>Dummy Page</h2>
<p> Lorem ipsum</p>
<?php
}
# Printing directly, could be wp_enqueue_script
public function scripts() {
?><script>alert('My page');</script><?php
}
# Enqueing from a CSS file on plugin directory
public function styles() {
wp_enqueue_style( 'my-menu', $this->plugin_url . 'my-menu.css' );
}
}
new SO_WP_Menu();
在这个例子中需要注意的重要一点是,当使用 add_menu_page()
时,它返回一个钩子,可用于定位我们的确切页面并在那里加载样式和脚本。
一个常见的错误是在没有定位的情况下入队,并且在整个过程中溢出脚本和样式。
使用 OOP,我们可以存储要在内部方法中使用的公共变量。