No results found. Try again with different words?

Search must be at least 3 characters.

How to Change the Logo on Specific Pages?

This helpful guide will show you how to change the regular logo to your own custom logo on certain pages of your WordPress website. This personalization can make your site look better and help with your brand, giving your visitors a special experience.

Before you begin, make sure you have the following in place:

  • A WordPress Website: Ensure that you have an active WordPress website.
  • Basic PHP and WordPress Theme Development Knowledge: Familiarity with PHP and WordPress theme development basics will be helpful.

How to Change the Logo of a Specific Page

Before you make any customizations, it’s a best practice to create a child theme to avoid affecting your main theme. If you already have a child theme, you can skip this step. Now, follow these steps to change the logo on specific pages:

  1. Login to your WordPress website.
  2. Navigate to Appearance > Theme Editor.
  3. Select the Child theme from the right-top corner dropdown.
  4. Open the `functions.php` and Insert the following code snippet at the end of the file.
  5. After adding the code, click on the “Update File” button.
function custom_astra_logo_output($html) {

    // Check if the current page has a specific slug (e.g., "example-page").
    if (is_page('example-page')) {

        // Replace this URL with the URL of the custom logo for the specific page.
        $custom_logo_url = 'URL_OF_YOUR_CUSTOM_LOGO_FOR_THIS_PAGE';
    } else {


        // Get the default custom logo set in WordPress.
        $custom_logo_id = get_theme_mod('custom_logo');
        $custom_logo_url = wp_get_attachment_image_url($custom_logo_id, 'full');
    }

    // Customize the logo HTML output.
    $html = sprintf(
        '<a href="%1$s" class="custom-logo-link" rel="home" itemprop="url"><img src="%2$s" class="custom-logo" alt="%3$s"></a>',
        esc_url(home_url('/')),
        esc_url($custom_logo_url),
        esc_attr(get_bloginfo('name'))
    );

    return $html;
}

add_filter('get_custom_logo', 'custom_astra_logo_output');

This code will enable you to display a custom logo on specific pages. Ensure that you replace `‘URL_OF_YOUR_CUSTOM_LOGO_FOR_THIS_PAGE’` with the actual URL of the custom logo you want to display on the specific page.

Finally, visit the specific page (e.g., “example-page”) on your website to see the custom logo displayed. Other pages should still display the default logo.

We hope this document has been helpful. Please feel free to leave a comment below if you have any queries.

Was this article helpful?
Did not find a solution? We are here to help you succeed.

Related Docs

Astra is Free. Now & Forever.

We believe creating beautiful websites should not be expensive. That's why Astra is free for everyone. Get started for free and extend with affordable packages.

REWIND

YEAR IN REVIEW

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form
Scroll to Top
Now choose your preferred
page builder addon
Choose your preferred page builder addon

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form