什么是自定义Logo
使用自定义logo允许网站所有者为他们的网站上传一个图像,可以放在网站的顶部。它可以在管理面板中的外观>页眉处上传。首先应该使用add_theme_support()开启自定义logo支持,然后在主题中使用the_custom_logo()调用。自定义logo是可选的,但如果主题作者在他们的主题中包含一个logo,就应该使用这个函数。
主题添加自定义logo支持
要启用自定义logo支持,将以下代码添加到functions.php
文件:
add_theme_support( 'custom-logo' );
当启用自定义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钩子的是为了在主题加载后注册自定义logo支持。
height
预期的logo高度,单位是像素。自定义logo也可以使用内置的图像尺寸,如缩略图,或使用add_image_size()
注册一个自定义尺寸。width
预期的logo宽度,单位是像素。自定义logo也可以使用内置的图像尺寸,如缩略图,或使用
add_image_size()
注册一个自定义尺寸。flex-height
是否允许有一个灵活的高度。flex-width
是否允许有一个灵活的宽度。
header-text
要隐藏的元素样式类名。可以为所有构成页眉文本的元素传递一个类名数组,这些元素可以被logo所取代。
unlink-homepage-logo
如果unlink-homepage-logo参数被设置为 "true",使用get_custom_logo()或the_custom_logo()插入的logo图片将不再链接到主页。为了保持链接图片的风格,未链接的logo图片位于一个具有相同 "custom-logo-link "类的span标签内。
主题显示自定义logo
可以使用the_custom_logo()函数在主题中显示自定义logo。但建议用function_exists()来包装代码,以保持对旧版本WordPress的向后兼容,像这样:
if ( function_exists( 'the_custom_logo' ) ) { the_custom_logo(); }
一般来说,logo被添加到主题的header.php文件中,但它也可以在其他地方。
如果你想获得当前的logo 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>'; }
自定义logo模板标签
为了管理在前端显示的自定义logo,可以使用这三个模板标签:
get_custom_logo() -
返回自定义logo标记the_custom_logo() -
显示自定义logo标记has_custom_logo() -
返回一个布尔值true/false,即是否设置了自定义logo