19

How can I set the logo in my custom theme in Drupal 8?

I can see that Drupal looks for the logo.svg file. I have a PNG logo.png file that I used in Drupal 7 and I would like to re-use it. I cannot set the logo as a theme setting as in Drupal 7.

Is there a way through UI or custom code in the theme to set the logo?

2
  • Looking at Drupal 8 code, I can see it still has the setting for a custom logo, if the default one has not been enabled.
    – apaderno
    Nov 18, 2015 at 21:17
  • Yes, indeed if you disable " Use the default logo supplied by the theme " then you can choose a logo. I was thinking of letting Drupal pick my logo.png as default logo
    – batigolix
    Nov 18, 2015 at 21:30

9 Answers 9

21

After Drupal 8.6.x

In your THEME.info.yml add a line like logo: logo.png. You need to clear cache for Drupal to detect this change.

Before Drupal 8.6.x

Default logo file has now become logo.svg in Drupal 8. However, to use logo.png or something else, you need to add custom settings definition in your theme. To do this, add the following lines to config/install/THEME.settings.yml file in your theme folder (replace THEME with your theme's machine name).

logo:
  path: 'themes/THEME/logo.png'
  use_default: false

After doing this, you must reinstall your theme if already installed. The file asks Drupal to install the given settings when the theme is installed. Hence, when you install the theme, the logo path parameter gets saved to the database and the default logo is disabled by the use_default parameter.

3
  • 1
    Hope you executed the instructions as mentioned. Also, do not forget to re-install the theme or import the configuration like drush cim -y --partial --source=path/to/theme/config/install. I've used this several times and it works.
    – Jigarius
    May 29, 2017 at 16:55
  • You can also re-import the config using the following code (e.g. from an update hook). NOTE this will wipe any config added since the theme was installed: \Drupal::service('config.installer')->installDefaultConfig('theme', 'theme_name');
    – leon.nk
    Jun 7, 2017 at 11:11
  • I've tried setting the theme to Bartik and then back to my theme and the settings havent updated. I dont have access to command line for drush. How do I reinstall the theme?
    – Jeff
    Oct 26, 2018 at 20:30
8

For regular themes, you can just go to the appearance page, go to the settings tab and deselect Use the logo supplied by the theme. The upload form that appears allows to upload another image instead.

steps

If you are actually building the theme and want to supply a default image, please refer to one of the other answers.

6

As of Drupal 8.6 your contrib or custom theme (say it's called mythemename) can easily define the default logo in its mythemename.info.yml file:

logo: images/acme-logo-stacked.png

See https://www.drupal.org/docs/8/theming-drupal-8/defining-a-theme-with-an-infoyml-file#logo

Note that to be used the logo use_default setting must be true.

1
5

In the MYTHEME.theme file of your theme, add the following code.

/**
 * Implements hook_preprocess_HOOK() for block templates.
 */

function MYTHEME_preprocess_block(&$variables) {
  switch ($variables['base_plugin_id']) {
    case 'system_branding_block':
      $variables['site_logo'] = '';
      if ($variables['content']['site_logo']['#access'] && $variables['content']['site_logo']['#uri']) {
        $variables['site_logo'] = str_replace('.svg', '.png', $variables['content']['site_logo']['#uri']);
      }
      break;

  }
}

Put the logo file in the MYTHEME directory. Replace MYTHEME with the machine name of your theme.

4

In Drupal 8, the default logo needs to be a SVG file. You can still use a PNG file with a custom logo, or if the theme has extra custom settings to give support to non-SVG default logos.

This is what reported in The default logo type for themes is SVG, a change record for Drupal 8.0.0-beta5.

As reported in the comment, you could also use the following in the theme settings file.

logo:
  path: 'themes/THEME_NAME/logo.png'
  use_default: false

This would automatically use a custom logo without setting it from the UI.

3

In /your-drupal-folder/themes/THEME.theme file add this:

function THEME_preprocess_page(&$variables) {
  global $base_url, $base_path;
  $variables['logo'] = $base_url . $base_path . drupal_get_path('theme','THEME') . '/logo.svg';

  ##Uncomment this if you want to use png instead of svg image
  #$variables['logo'] = str_replace('.svg', '.png', $variables['logo']);
}
1

In Drupal 8.6 this can be set in your .info.yml file as follows:

logo: 'images/MY_THEME_LOGO.png'

the theme path is automatically added to the src path

0

I don't think you need to change the code. In some cases, Global settings might be stopping you to take the respective theme logo. Hence, make sure LOGO IMAGE of Global Settings and your theme logo should be same in Drupal 8(Some cases).

0

A simple option is to place the logo in a custom block.

/admin/structure/block/block-content

this is flexible and particularely useful if u want that logo to show up sowehat different in other sections of the site

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.