Как включить произвольную панель хидера с картинками в WordPress 3.0. Часть 1

В обновлении WordPress 3.0 появилась новая дефолтная тема под названием Twenty Ten. В неё было добавлено много интересных фич, однако наиболее примечательной, понравившейся многим пользователям, была «Произвольные заголовки». В этой статье мы поделимся с вами способом, как активировать произвольные заголовки с админ.панелью в WordPress 3.0.

Что именно эта фича делает?

Она создает вкладку в административной панели, которая позволяет вам изменять изображения хидера. Можно зарегистрировать дефолтные изображения, если вы разработчик темы, чтобы предоставить пользователю больше настроек. Также фича позволит пользователям загружать собственные картинки для хидера. И, наконец, эта фича использует миниатюры записей на отдельных страницах постов блога. Если ваша миниатюра достаточно большого разрешения, чтобы смогла разместиться в хидере, то она (миниатюра к записи) будет использована в качестве изображения для хидера, вместо указанного дефолтного хидера. Если изображение окажется еще больше, то оно обрежется соответственно.

Как это добавить?

Код мы взяли прямо из файла functions.php темы Twenty Ten. Вам необходимо вставить его в свой файл с тем же названием:

<?php
/** Указываем WordPress выполнить yourtheme_setup() когда хук 'after_setup_theme' выполняется. */
add_action( 'after_setup_theme', 'yourtheme_setup' );
if ( ! function_exists('yourtheme_setup') ):
/**
* @используем add_custom_image_header() для добавления поддержки произвольных хидеров.
* @используем register_default_headers() для регистрации дефолтных изображений для хидера, идущих вместе с темой.
*
* @ с 3.0.0
*/
function yourtheme_setup() {
// эта тема использует миниатюры
add_theme_support( 'post-thumbnails' );
// ваши изменяемые хидеры начинаются здесь
define( 'HEADER_TEXTCOLOR', '' );
define( 'HEADER_IMAGE', '%s/images/headers/forestfloor.jpg' );
// Высота и ширина вашего произвольного хидера. Вы можете перехватить фильтры темы для изменения этих значений.
// Добавляем фильтр в yourtheme_header_image_width и yourtheme_header_image_height для изменения этих значений.
define( 'HEADER_IMAGE_WIDTH', apply_filters( 'yourtheme_header_image_width', 940 ) );
define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'yourtheme_header_image_height',	198 ) );
// Мы будем использовать миниатюры записей для произвольного хидера с картинками в записях и на страницах.
// Мы устанавливаем их 940 пикселей в ширину и 198 пикселей в высоту (бОльшие изображения будут автоматически обрезаны для автоподгона).
set_post_thumbnail_size( HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT, true );
// Отключаем поддержку текста внутри изображений хидера.
define( 'NO_HEADER_TEXT', true );
// Добавляем возможность стилизации произвольного хидера через админ.панель
// Смотрим yourtheme_admin_header_style() ниже.
add_custom_image_header( '', 'yourtheme_admin_header_style' );
// … и заканчиваем настройку произвольного хидера.
// Дефолтные произвольные хидеры, идущие с темой. 
register_default_headers( array (
'berries' => array (
'url' => '%s/images/headers/berries.jpg',
'thumbnail_url' => '%s/images/headers/berries-thumbnail.jpg',
'description' => __( 'Berries', 'yourtheme' )
),
'cherryblossom' => array (
'url' => '%s/images/headers/cherryblossoms.jpg',
'thumbnail_url' => '%s/images/headers/cherryblossoms-thumbnail.jpg',
'description' => __( 'Cherry Blossoms', 'yourtheme' )
),
'concave' => array (
'url' => '%s/images/headers/concave.jpg',
'thumbnail_url' => '%s/images/headers/concave-thumbnail.jpg',
'description' => __( 'Concave', 'yourtheme' )
),
'fern' => array (
'url' => '%s/images/headers/fern.jpg',
'thumbnail_url' => '%s/images/headers/fern-thumbnail.jpg',
'description' => __( 'Fern', 'yourtheme' )
),
'forestfloor' => array (
'url' => '%s/images/headers/forestfloor.jpg',
'thumbnail_url' => '%s/images/headers/forestfloor-thumbnail.jpg',
'description' => __( 'Forest Floor', 'yourtheme' )
),
'inkwell' => array (
'url' => '%s/images/headers/inkwell.jpg',
'thumbnail_url' => '%s/images/headers/inkwell-thumbnail.jpg',
'description' => __( 'Inkwell', 'yourtheme' )
),
'path' => array (
'url' => '%s/images/headers/path.jpg',
'thumbnail_url' => '%s/images/headers/path-thumbnail.jpg',
'description' => __( 'Path', 'yourtheme' )
),
'sunset' => array (
'url' => '%s/images/headers/sunset.jpg',
'thumbnail_url' => '%s/images/headers/sunset-thumbnail.jpg',
'description' => __( 'Sunset', 'yourtheme' )
)
) );
}
endif;
if ( ! function_exists( 'yourtheme_admin_header_style' ) ) :
/**
* Стилизируем изображения хидера, отображаемые в Внешний вид > Произвольный заголовок.
*
* Ссылаемся на add_custom_image_header() в yourtheme_setup().
*
* @ с 3.0.0
*/
function yourtheme_admin_header_style() {
?>
<style type="text/css">
#headimg {
height: <?php echo HEADER_IMAGE_HEIGHT; ?>px;
width: <?php echo HEADER_IMAGE_WIDTH; ?>px;
}
#headimg h1, #headimg #desc {
display: none;
}
</style>
<?php
}
endif;
?>

Продолжение статьи ищите по ссылке Как включить произвольную панель хидера с картинками в WordPress 3.0. Часть 2