Skip to content

PHP Customization: WPML - how to have different logo for different language version?

1 minute read

In this article we will try to describe how to change default logo into 3 different logos for user who use WPML. We will try to do it for 3 languages:

  • English
  • Italian
  • German
  1. 1 Please find wp-content/themes/myhome/includes/menu/class-myhome-menu.php file
  2. 2 Please backup the file
  3. 3 Please edit the file
  4. 4 Find logo code in this file:
php
<?php if ( ! empty( $logo ) ) : ?>
   <a class="logo_link" href="<?php echo esc_url( $homepage_url ); ?>"
      title="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>">
                <img
      src="<?php echo esc_url( $logo ); ?>"
      data-logo="<?php echo esc_url( $logo ); ?>"
                 <?php if ( ! empty( $logo_when ) ) : ?>
         data-logo-switch="<?php echo esc_url( $logo_when ); ?>"
                 <?php endif; ?>
      alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>"
   >
            </a>
<?php endif; ?>

Change it into this example:

php
<style>
    .logo_link--white {
        display:none!important;
    }

    .mh-header--transparent .logo_link--white {
        display:block!important;
    }

    .mh-header--transparent .logo_link--dark {
        display:none!important;
    }
</style>

<?php if (ICL_LANGUAGE_CODE == 'en'): ?>
    <a class="logo_link logo_link--white" href="http://link-to-english-version-of-the-homepage.com">
        <img src="http://link-to-english-logo-white-version">
    </a>
    <a class="logo_link logo_link--dark" href="http://link-to-english-version-of-the-homepage.com">
        <img src="http://link-to-english-logo-dark-version">
    </a>
<?php endif; ?>

<?php if (ICL_LANGUAGE_CODE == 'de'): ?>
    <a class="logo_link logo_link--white" href="http://link-to-german-version-of-the-homepage.com">
        <img src="http://link-to-german-logo-white-version">
    </a>
    <a class="logo_link logo_link--dark" href="http://link-to-german-version-of-the-homepage.com">
        <img src="http://link-to-german-logo-dark-version">
    </a>
<?php endif; ?>

<?php if (ICL_LANGUAGE_CODE == 'it'): ?>
    <a class="logo_link logo_link--white" href="http://link-to-italian-version-of-the-homepage.com">
        <img src="http://link-to-italian-logo-white-version">
    </a>
    <a class="logo_link logo_link--dark" href="http://link-to-italian-version-of-the-homepage.com">
        <img src="http://link-to-italian-logo-dark-version">
    </a>
<?php endif; ?>

Please change language codes for your own and point links to your logos image files (e.g. jpg / png). There are 2 version of logo for each language, because menu need one additional logo for transparent menu.

Please remember to put good version of protocol (http or https)

Ask the people who build MyHome WPBakery

We answer by email from support@tangiblewp.com. With Premium Support, we also fix your site when something breaks.

Was this guide helpful?