Кастомное лого

Использование пользовательского (кастомного) логотипа позволяет владельцам сайтов загружать изображения, которые может размещать в шапке сайта и не только.

Логотип можно загрузить из раздела Appearance -> Header в панели администратора. Но прежде, поддержка пользовательского логотипа должна быть добавлена в вашу тему с помощью add_theme_support(), а уже затем вызвана в вашей теме с помощью the_custom_logo().

Пользовательский логотип необязателен, но авторы тем должны использовать эту функцию, если они включают логотипы в свои темы WordPress.

Добавление поддержки пользовательских логотипов в вашу тему

Чтобы включить использование пользовательского логотипа в вашей теме, добавьте следующий код в файл functions.php темы:

add_theme_support( 'custom-logo' );

При включении поддержки пользовательских логотипов вы можете настроить пять параметров, передавая аргументы функции add_theme_support() с помощью массива:

function themename_custom_logo_setup() {
    $defaults = array(
        'height'               => 100,
        'width'                => 400,
        'flex-height'          => true,
        'flex-width'           => true,
        'header-text'          => array( 'site-title', 'site-description' ),
        'unlink-homepage-logo' => true, 
    );
 
    add_theme_support( 'custom-logo', $defaults );
}
 
add_action( 'after_setup_theme', 'themename_custom_logo_setup' );

Хук after_setup_theme используется для того, чтобы поддержка пользовательских логотипов была зарегистрирована после загрузки темы.

• height
  Ожидаемая высота логотипа в пикселях. Пользовательский логотип может также использовать встроенные размеры изображений, такие как thumbnail, или зарегистрируйте пользовательский размер с помощью add_image_size().
• width
  Ожидаемая ширина логотипа в пикселях. Пользовательский логотип может также использовать встроенные размеры изображения, например, миниатюру, или зарегистрируйте собственный размер с помощью функции add_image_size().
• flex-height
  Следует ли разрешить гибкую высоту.
• flex-width
  Разрешить ли гибкую ширину.
• header-text
  Класс(ы) элементов, которые необходимо скрыть. Сюда можно передать массив имен классов для всех элементов, составляющих текст заголовка, который может быть заменен логотипом.
• unlink-homepage-logo
  Если параметр unlink-homepage-logo имеет значение true, изображения логотипа, вставленные с помощью get_custom_logo() или the_custom_logo(), больше не будут ссылаться на главную страницу, когда посетители находятся на этой странице. Чтобы сохранить стиль, заданный связанному изображению, изображение логотипа без ссылки находится внутри тега span с тем же классом custom-logo-link.

Отображение пользовательского логотипа в вашей теме

Пользовательский логотип можно отобразить в теме с помощью функции the_custom_logo(). Но рекомендуется обернуть код в вызов функции function_exists(), чтобы сохранить обратную совместимость со старыми версиями WordPress, как это сделано ниже:

if ( function_exists( 'the_custom_logo' ) ) {
    the_custom_logo();
}

Обычно логотипы добавляются в файл header.php темы, но могут быть размещены и в другом месте.

Если вы хотите получить URL текущего логотипа (или использовать собственную разметку) вместо разметки по умолчанию, вы можете использовать следующий код:

$custom_logo_id = get_theme_mod( 'custom_logo' );
$logo = wp_get_attachment_image_src( $custom_logo_id , 'full' );
 
if ( has_custom_logo() ) {
    echo '<img src="' . esc_url( $logo[0] ) . '" alt="' . get_bloginfo( 'name' ) . '">';
} else {
    echo '<h1>' . get_bloginfo('name') . '</h1>';
}

Пользовательские теги шаблона логотипа

Для управления отображением пользовательского логотипа во внешнем интерфейсе можно использовать эти три тега шаблона:

• get_custom_logo() - Возвращает разметку для пользовательского логотипа.
• the_custom_logo() - Отображает разметку для пользовательского логотипа.
• has_custom_logo() - Возвращает булево значение true/false, установлен ли пользовательский логотип или нет.