For default design, the logo must have a maximum height of 54 px and the sticky logo must have a maximum height 65px. If you add logos with greater height, they will be automatically resized to this max height. Changing max logo height is done through custom CSS. See more below. 

From Theme Options -> General -> Logos & Favicon you add

  • Standard Logo
  • Sticky Logo
  • Mobile Logo
  • Transparent Logo
  • Favicon
  • General logo margin
  • Max Logo Height

To upload your logos navigate to Theme Options -> Genaral -> Logos & Favicon section

Sticky Logo placed in the sticky menu

Transparent Header Logo is placed over the transparent header

Mobile/Tablets Logo is placed on mobile header

Favicon is placed in the browser tab

fav

Increase Logo Size

Go to Logos & Favicon -> Maximum Height of the logo and type the number as in the below screenshot.

Make 70 your desired logo height.

Clear theme cache if it’s enabled to see results -> http://help.wpresidence.net/article/enable-or-disable-wp-residence-cache/

Change Logo height with Custom CSS

To change logo height, use this css in custom css (Theme Options – Design – Custom Colors – Custom css) or in child theme style.css – http://help.wpresidence.net/article/how-to-add-custom-css/

.logo img {
max-height: 54px;
}

Change 54 to your value.

This change will affect the sticky menu logo size. If you wish to have different sizes, edit this css in Custom CSS

.customnav .logo img {
    max-height: 65px!important;
}

Increase header and sticky height to match taller logos

To change header height – if you wish a taller menu – go to these options.

 

HOW TO ADD RETINA LOGOS VERSIONS:

For speed reasons, It’s very important to upload also Retina Logos:

Video for how to upload add logos and their retina version

WpResidence theme is ready for screens and retina devices and the retina script will automatically detect and load retina images. Logos have just to exist.

For the RETINA logos version first must create all retina versions for all regular logo options from theme.

To create retina versions of it must duplicate the image and rename it by adding _2x  at the end of the original name of the file. And because the retina devices have evolved you must create logo versions also with _3x even _4x.

How you name the retina image is very important. It must be named the exact same as the regular logo image, though with _2x, _3x, _4x added at the end of the name.

Help – http://help.wpresidence.net/article/how-to-add-retina-logos/

These are example steps to add the retina logo version for your custom logo.

Add the logo in theme options (name example logo.png)

 

Add retina version in Media. Make sure the retina logo has _2x, _3x, _4x at the end. (if original name is logo, then retina should be logo_2x)

 

It is important the 2 images exist in the same month folder.