什么是自定義Logo?
使用自定義Logo可以讓網站所有者上傳他們網站的圖片,這些圖片可以放在他們網站的頂部。 它可以從您的管理面板中的外觀>標題上傳。 應該使用add_theme_support()將自定義徽標支持首先添加到您的主題中,然后the_custom_logo在主題中調用。 自定義Logo是可選的,但如果主題作者在其主題中包含Logo,則應使用此功能。
官方文檔:
the_custom_logo();
https://developer.wordpress.org/reference/functions/the_custom_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' ),
????);
????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代替。
在主題中顯示自定義Logo
可以使用the_custom_logo()函數在主題中顯示自定義徽標。 但是建議將代碼包裝在一個function_exists()調用中,以保持與舊版本WordPress的向后兼容性,如下所示:
if ( function_exists( 'the_custom_logo' ) ) {
????the_custom_logo();
}
通常,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] ) .'">';
} else {
????????echo '<h1>'. esc_attr( get_bloginfo( 'name' ) ) .'</h1>';
}
自定義Logo模板標簽
要管理在前端顯示自定義Logo,可以使用以下三個模板標簽:
- get_custom_logo() – 返回自定義Logo的標記。
- the_custom_logo() – 顯示自定義Logo的標記。
- has_custom_logo() – 返回一個布爾值true/false,是否設置了自定義徽標。