主题默认Favicon设置咨询：用户未自定义时如何显示默认图标？

Absolutely! This is a super common (and smart) feature to build into a WordPress theme—here’s exactly how to make it work:

Step 1: Prepare Your Default Favicon Files #

First, gather your default favicon assets for broad compatibility:

• A .ico file (works across most desktop browsers)
• A apple-touch-icon.png for iOS devices
• favicon-16x16.png and favicon-32x32.png for modern browsers

Place these files in a dedicated folder in your theme (e.g., assets/images/—create the folder if it doesn’t exist).

Step 2: Add Code to Your Theme’s functions.php #

You have two solid, WordPress-native approaches to choose from:

Approach 1: Use the wp_head Hook #

This method manually outputs favicon link tags only when no custom site icon is set:

add_action('wp_head', 'mytheme_enqueue_default_favicon');
function mytheme_enqueue_default_favicon() {
    // Check if the user has configured a custom site icon
    $custom_favicon = get_site_icon_url();
    
    // Load default favicons if no custom one exists
    if (!$custom_favicon) {
        $theme_uri = get_template_directory_uri();
        
        // Output links for different favicon formats
        echo '<link rel="icon" href="' . esc_url($theme_uri . '/assets/images/favicon.ico') . '" type="image/x-icon">';
        echo '<link rel="apple-touch-icon" sizes="180x180" href="' . esc_url($theme_uri . '/assets/images/apple-touch-icon.png') . '">';
        echo '<link rel="icon" type="image/png" sizes="32x32" href="' . esc_url($theme_uri . '/assets/images/favicon-32x32.png') . '">';
        echo '<link rel="icon" type="image/png" sizes="16x16" href="' . esc_url($theme_uri . '/assets/images/favicon-16x16.png') . '">';
    }
}

Approach 2: Filter the wp_site_icon Output #

This is a cleaner, more integrated way—we hook into WordPress’s core site icon function and override it when no custom icon is present:

add_filter('wp_site_icon', 'mytheme_set_default_favicon', 10, 3);
function mytheme_set_default_favicon($icon_url, $size, $blog_id) {
    // Return default favicon URL if no custom icon is set
    if (!$icon_url) {
        $icon_url = get_template_directory_uri() . '/assets/images/favicon.ico';
    }
    return $icon_url;
}

Note: This filter only handles the main favicon link. For mobile-specific icons like apple-touch-icon, add those via the wp_head hook alongside this code.

Step 3: Test and Troubleshoot #

• Clear Caches: Browser and WordPress caching plugins can hold onto old favicon data—clear them after adding the code to see changes.
• Verify Paths: Double-check that your file paths match where you stored your default favicons. get_template_directory_uri() ensures the path works regardless of your theme’s folder name.
• Test Both Scenarios: First, leave the Site Identity settings blank to confirm the default favicon loads. Then set a custom icon via Admin → Customize → Site Identity and verify it replaces the default.

内容的提问来源于stack exchange，提问作者user7432810