Sitka v1.3 out now! [Changelog] [How to update]


What is a retina logo image?

Please note: This article is specifically for the Hemlock and Florence themes.

What is a retina image?

Some newer devices come with "Retina Display" which , thanks to its high pixel density screen, will make content look sharper and more clear. To ensure your logo has a retina-ready version, you can add one to your theme.

How do I add a retina logo image to my theme?

A retina logo image is the same as the normal logo image, though twice the size. For example, if one's regular logo image is 100x100 pixels in size, the retina logo image would need to be 200x200 pixels in size.

How you name the retina image is very important. It must be named the exact same as the regular logo image, though with @2x added onto the end of the name.

So, if the regular logo image was named "logo.png", the retina logo image would need to be named "[email protected] png"

Additionally, you'll want to ensure your regular logo image and your retina logo image are within the same WordPress Media Library folder. You can achieve this most easily by uploading the two image files at the same time to your Media Library. 

You can upload your retina logo image by navigating to Appearance > Customize > Logo & Header Settings

Retina Logo Screenshot

Don't have this option in your theme's Customizer?

If you are not using the Hemlock or Florence theme and would like to implement a retina logo image, we recommend the plugin called "WP Retina 2x".