In a previous post I discussed how to create a child theme admin page, and talked about a few of the new features of Genesis 1.8, . However, one thing I didn't discuss in the creation of the new admin pages is setting a custom screen icon.
While this may or may not make Genesis core, it is a simple addition. So in your __construct() method with $page_ops, enter a screen icon of 'custom'.
[php highlight="22,23,24"]
/**
* Create an admin menu item and settings page.
*
* @since 1.0.0
*/
function __construct() {
// Specify a unique page ID.
$page_id = 'child';
// Set it as a child to genesis, and define the menu and page titles
$menu_ops = array(
'submenu' => array(
'parent_slug' => 'genesis',
'page_title' => 'Genesis - WPS Starter Settings',
'menu_title' => 'WPS Starter Settings',
'capability' => 'manage_options',
)
);
// Set up page options. These are optional, so only uncomment if you want to change the defaults
$page_ops = array(
'screen_icon' => 'custom', // see $this->screen_icon() below
);
// Give it a unique settings field.
// You'll access them from genesis_get_option( 'option_name', CHILD_SETTINGS_FIELD );
$settings_field = CHILD_SETTINGS_FIELD;
// Set the default values
$default_settings = array(
'phone' => '',
'address' => '',
);
// Create the Admin Page
$this->create( $page_id, $menu_ops, $page_ops, $settings_field, $default_settings );
// Initialize the Sanitization Filter
add_action( 'genesis_settings_sanitizer_init', array( $this, 'sanitization_filters' ) );
}
[/php]
Next you will need a method to output the necessary CSS to display your icon.
[php highlight="42,43"]
/**
* Create an admin menu item and settings page.
*
* @since 1.0.0
*/
function __construct() {
// Specify a unique page ID.
$page_id = 'child';
// Set it as a child to genesis, and define the menu and page titles
$menu_ops = array(
'submenu' => array(
'parent_slug' => 'genesis',
'page_title' => 'Genesis - WPS Starter Settings',
'menu_title' => 'WPS Starter Settings',
'capability' => 'manage_options',
)
);
// Set up page options. These are optional, so only uncomment if you want to change the defaults
$page_ops = array(
'screen_icon' => 'custom', // see $this->screen_icon() below
);
// Give it a unique settings field.
// You'll access them from genesis_get_option( 'option_name', CHILD_SETTINGS_FIELD );
$settings_field = CHILD_SETTINGS_FIELD;
// Set the default values
$default_settings = array(
'phone' => '',
'address' => '',
);
// Create the Admin Page
$this->create( $page_id, $menu_ops, $page_ops, $settings_field, $default_settings );
// Initialize the Sanitization Filter
add_action( 'genesis_settings_sanitizer_init', array( $this, 'sanitization_filters' ) );
// Add custom screen icon
add_action( 'admin_head' , array( $this, 'screen_icon' ) );
}
[/php]
Now you will need to create the method within the class extension.
[php]
/**
* Custom Admin screen icon
*
* See /lib/classes/sanitization.php for all available filters.
*
* @since 1.0.0
*/
public function screen_icon() { ?>
<style>
#icon-custom { background-image: url('<?php echo WPS_ADMIN_IMAGES . '/staff_32x32.png'; ?>'); background-repeat: no-repeat; }
</style>
<?php
}
[/php]
Jordan says
Awesome -got any code for changing the login logo in Genesis? I don’t want to rely on a plugin for this. Tried this code, but -no go for me.
function login_logo() {
echo ‘
h1 a { background-image: url(‘.get_bloginfo(‘template_directory’).’/images/admin-logo.png); }
‘;
}
add_action(‘login_head’, ‘login_logo’);
Travis Smith says
Hello Jordan,
That’s actually a WordPress deal. The hook login_head occurs in the header, so you will need to do inline style. So something like this:
[php]<?php
add_action( ‘login_head’, ‘wps_login_logo’ );
/**
* Echoes HTML inline style.
*/
function wps_login_logo() {
echo ‘<style type="text/css" media="screen">’;
echo ‘h1 a { background-image: url("’ . CHILD_URL . ‘/images/admin-logo.png"); }’;
echo ‘</style>’;
}
[/php]
Or, if you want to use a custom stylesheet for the login area:
[php]<?php
add_action( ‘login_enqueue_scripts’, ‘wps_enqueue_login_style’ );
/**
* Enqueues login style.
*/
function wps_enqueue_login_style() {
wp_enqueue_style( ‘wps-login-style’, CHILD_URL . ‘/css/login.css’ );
}
[/php]