Adding a style sheet to your backend theme options page is easy and can be done with just a few lines of code. This code will only work in your theme options and not the whole wordpress admin area. The key here is use to use admin_enqueue_script() to add the stylesheet. To get this code to work you will need to use the $hook of your theme options page. This is the unique menu slug, you have specified in add_theme_page(). The value of hook looks something like this: appearance_page_sl-theme-options
The easy way to find the $hook variable, go to your theme options page, open firebug and in the body you will find something like this.
<body class="wp-admin wp-core-ui js appearance_page_sl-theme-options auto-fold admin-bar branch-3-7>
Use the hook value in the below code to compare.
function mytheme_enqueue($hook) {
if( 'appearance_page_my-theme-options' != $hook )
{ return; }
wp_enqueue_style( 'my_custom_script', get_template_directory_uri() . '/admin.css' );
}
add_action( 'admin_enqueue_scripts', 'mytheme_enqueue' );
But Wait! The correct way as per WordPress guidelines is like this: (to get the theme approved)
Themes are required to use the Theme-specific hook for admin-enqueued scripts/stylesheets, e.g. admin_print_scripts-appearance_page_$menu_slug. Open firebug and on top you will find the $menu-slug variable which will look something like this “appearance_page_softlights-options”
add_action( 'appearance_page_$menuslug', 'mytheme_admin_scripts' );
function mytheme_admin_scripts() {
wp_enqueue_style( 'my_custom_script', get_template_directory_uri() . '/admin.css' );
}
