I see <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" /> in my themename/header.php file. How do i changed HEADER_IMAGE_WIDTH and/or HEADER_IMAGE_HEIGHT??
Here’s the answer.
If you are using default theme Twenty Ten 1.0 or Twenty Eleven 1.0
If you are using Twenty Ten 1.0 find the following code near 116-117 in your themes/themename/functions.php file and change it accordingly:
define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyten_header_image_width', 940 ) ); define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyten_header_image_height', 198 ) );
If you are using Twenty Eleven 1.0 find the following code near 122-123 in your themes/themename/functions.php and change it accordingly:
define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyeleven_header_image_width', 940 ) ); define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyeleven_header_image_width', 198 ) );
If you are using a custom theme that may not have the “header image” facility working at all you will need to place the following code in your theme’s function.php file.
/** Tell WordPress to run yourthemename_setup() when the 'after_setup_theme' hook is run. */
add_action( 'after_setup_theme', 'yourthemename_setup' );
if ( ! function_exists( 'yourthemename_setup' ) ):
/**
* Sets up theme defaults and registers support for various WordPress features.
*
* Note that this function is hooked into the after_setup_theme hook, which runs
* before the init hook. The init hook is too late for some features, such as indicating
* support post thumbnails.
*
* To override yourthemename_setup() in a child theme, add your own yourthemename_setup to your child theme's
* functions.php file.
* @uses add_custom_image_header() To add support for a custom header.
* @uses register_default_headers() To register the default custom header images provided with the theme.
* @uses set_post_thumbnail_size() To set a custom post thumbnail size.
*/
function yourthemename_setup() {
// This theme styles the visual editor with editor-style.css to match the theme style.
add_editor_style();
// Post Format support. You can also use the legacy "gallery" or "asides" (note the plural) categories.
add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );
// This theme uses post thumbnails
add_theme_support( 'post-thumbnails' );
// Add default posts and comments RSS feed links to head
add_theme_support( 'automatic-feed-links' );
// Make theme available for translation
// Translations can be filed in the /languages/ directory
load_theme_textdomain( 'yourthemename', get_template_directory() . '/languages' );
$locale = get_locale();
$locale_file = get_template_directory() . "/languages/$locale.php";
if ( is_readable( $locale_file ) )
require_once( $locale_file );
// This theme uses wp_nav_menu() in one location.
register_nav_menus( array(
'primary' => __( 'Primary Navigation', 'yourthemename' ),
) );
// This theme allows users to set a custom background
add_custom_background();
// Your changeable header business starts here
if ( ! defined( 'HEADER_TEXTCOLOR' ) )
define( 'HEADER_TEXTCOLOR', '' );
// No CSS, just IMG call. The %s is a placeholder for the theme template directory URI.
if ( ! defined( 'HEADER_IMAGE' ) )
define( 'HEADER_IMAGE', '%s/images/headers/path.jpg' );
// The height and width of your custom header. You can hook into the theme's own filters to change these values.
// Add a filter to yourthemename_header_image_width and yourthemename_header_image_height to change these values.
define( 'HEADER_IMAGE_WIDTH', apply_filters( 'yourthemename_header_image_width', 700 ) );
define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'yourthemename_header_image_height', 160 ) );
// We'll be using post thumbnails for custom header images on posts and pages.
// We want them to be 940 pixels wide by 198 pixels tall.
// Larger images will be auto-cropped to fit, smaller ones will be ignored. See header.php.
set_post_thumbnail_size( HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT, true );
// Don't support text inside the header image.
if ( ! defined( 'NO_HEADER_TEXT' ) )
define( 'NO_HEADER_TEXT', true );
// Add a way for the custom header to be styled in the admin panel that controls
// custom headers. See yourthemename_admin_header_style(), below.
add_custom_image_header( '', 'yourthemename_admin_header_style' );
// ... and thus ends the changeable header business.
// Default custom headers packaged with the theme. %s is a placeholder for the theme template directory URI.
register_default_headers( array(
'berries' => array(
'url' => '%s/images/headers/berries.jpg',
'thumbnail_url' => '%s/images/headers/berries-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Berries', 'yourthemename' )
),
'cherryblossom' => array(
'url' => '%s/images/headers/cherryblossoms.jpg',
'thumbnail_url' => '%s/images/headers/cherryblossoms-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Cherry Blossoms', 'yourthemename' )
),
'concave' => array(
'url' => '%s/images/headers/concave.jpg',
'thumbnail_url' => '%s/images/headers/concave-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Concave', 'yourthemename' )
),
'fern' => array(
'url' => '%s/images/headers/fern.jpg',
'thumbnail_url' => '%s/images/headers/fern-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Fern', 'yourthemename' )
),
'forestfloor' => array(
'url' => '%s/images/headers/forestfloor.jpg',
'thumbnail_url' => '%s/images/headers/forestfloor-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Forest Floor', 'yourthemename' )
),
'inkwell' => array(
'url' => '%s/images/headers/inkwell.jpg',
'thumbnail_url' => '%s/images/headers/inkwell-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Inkwell', 'yourthemename' )
),
'path' => array(
'url' => '%s/images/headers/path.jpg',
'thumbnail_url' => '%s/images/headers/path-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Path', 'yourthemename' )
),
'sunset' => array(
'url' => '%s/images/headers/sunset.jpg',
'thumbnail_url' => '%s/images/headers/sunset-thumbnail.jpg',
/* translators: header image description */
'description' => __( 'Sunset', 'yourthemename' )
)
) );
}
endif;
if ( ! function_exists( 'yourthemename_admin_header_style' ) ) :
/**
* Styles the header image displayed on the Appearance > Header admin panel.
*
* Referenced via add_custom_image_header() in yourthemename_setup().
*
* @since Twenty Ten 1.0
*/
function yourthemename_admin_header_style() {
?>
<style type="text/css">
/* Shows the same border as on front end */
#headimg {
border-bottom: 1px solid #000;
border-top: 4px solid #000;
}
/* If NO_HEADER_TEXT is false, you would style the text with these selectors:
#headimg #name { }
#headimg #desc { }
*/
</style>
<?php
}
endif;And the following code in your header.php (where you would want your header images be appeared):
// Check if this is a post or page, if it has a thumbnail, and if it's a big one if ( is_singular() && current_theme_supports( 'post-thumbnails' ) && has_post_thumbnail( $post->ID ) && ( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'post-thumbnail' ) ) && $image[1] >= HEADER_IMAGE_WIDTH ) : // Houston, we have a new header image! echo get_the_post_thumbnail( $post->ID ); elseif ( get_header_image() ) : ?> <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" /> <?php endif;
