Well I am getting closer. Need a little more help though. I am now able to pull the css file into a specific page as long as it ends in .php, however my options page is /wp-admin/admin.php?page=wpgel-localseo
Again, any help with the below code would be much appreciated.
function wpgel_localseo_bootstrap_styles($hook) {
if ( 'options-general.php' == $hook ) {
wp_enqueue_style( 'wpgel_localseo_bootstrap_styles', plugins_url( 'wpgel-localseo/css/bootstrap.min.css' ) );
}
}
add_action('admin_enqueue_scripts', 'wpgel_localseo_bootstrap_styles');
I would go back one step. This might look like quite some overhead at first. But I think in the end this is the cleanest approach.
/**
* Step 1: Register your CSS file
*/
function myCustomAdminInit() {
wp_register_style( 'myCustomAdminStyles', '../your.css' );
}
add_action( 'admin_init', 'myCustomAdminInit' );
/**
* Step 2: This is how it will be loaded
*/
function loadMyCustomAdminStyles() {
wp_enqueue_style( 'myCustomAdminStyles' );
}
/**
* Step 3: Add your admin pages
*/
function registerMyCustomAdminPages() {
// Create your "wpgel-localseo" menu/page here
$pages['index'] = add_menu_page( ... );
$pages['options'] = add_submenu_page( ... );
// Of course, if you only have one page you won't need the foreach
foreach( $pages as $page ) {
// Finally, this is the line you're looking for...
add_action( 'admin_print_styles-' . $page, 'loadMyCustomAdminStyles' );
}
}
add_action( 'admin_menu', 'registerMyCustomAdminPages' );
Chris, thank you for your response. I looked at that solution and saw that print_style was not supposed to be used on Admin Pages.
Here is the solution I finally cam up with after a lot of digging and testing.
Just as a side not the purpose of this whole endeavor was to enqueue Bootstrap CSS and JS.
The solution was to set a global variable for the Admin Settings Page. If you see any way in which this code can be cleaned up or improved upon, please contribute.
function wpgel_localseo_menu() {
global $wpgel_localseo_settings_page;
$wpgel_localseo_settings_page = add_menu_page(
'Local SEO Dashboard',
'Local SEO',
'manage_options',
'wpgel-localseo',
'wpgel_localseo_options_page'
);
}
add_action( 'admin_menu', 'wpgel_localseo_menu' );
function wpgel_localseo_bootstrap_styles($hook) {
global $wpgel_localseo_settings_page;
if ( $hook == $wpgel_localseo_settings_page ) {
wp_enqueue_style( 'wpgel_localseo_bootstrap_styles', plugins_url( 'wpgel-localseo/css/bootstrap.min.css', dirname(__FILE__) ) );
wp_enqueue_script( 'wpgel_localseo_bootstrap_script', plugins_url( 'wpgel-localseo/js/bootstrap.min.js', dirname(__FILE__) ) );
}
}
add_action('admin_enqueue_scripts', 'wpgel_localseo_bootstrap_styles');
Ha. I didn’t know about not using print_style any longer. You never stop learning. Your code look fine now 🙂
I’m not a big fan of using globals. Though in your case it’s just semantics. Instead you could create an object where your admin page hook is a member variable that can be referenced by each function/method. But again, this would be a clean up (in terms of “separation of concerns”) but not an improvement.
