Meow Apps

WordPress 4.4 and Retina (High-DPI)


Today, is a great day! WordPress 4.4 was released and it now creates by itself the src-set tag, including all your image sizes. That enabled the browser to load the most appropriate size for your browser device πŸ™‚

Now, WordPress still doesn’t generate the Retina (high-dpi) images and WP Retina 2x will do its duty, as it always did. If you have the latest version of WP Retina 2x, it already adds the retina images directly in the src-set created by WordPress.

I recommend you to have a new look at the settings of WP Retina 2x. Thanks to WordPress 4.4, you optimize the retina process and make the whole solution really neat.

In Basics

WP 4.4 Basics

Of course, keep the Auto Generate, you need your Retina Images. You also need to keep the Responsive part of WP 4.4 but you have this option to disable if you don’t like it (or have issues with it). I recommend to also disable the new “Medium Large” size that was added by 4.4, it’s not neat, it’s just an alternative size just in case. Since you are using WP Retina 2x, all the sizes are perfect, you don’t need this un-perfect size in the middle.

In Advanced

WP 4.4 Advanced

A new “Responsive Images” method has been added. This method simply adds the retina images in the src-set created by WP 4.4. When all the plugins and theme support WP 4.4 well, this method will be the most optimized one. Until then, keep on using the current recommended method, PictureFill. It does what the “Responsive Images” is doing but also rewrite the HTML for the older IMG tags to include the retina images.

If you have any questions, please ask below. Enjoy those new releases, towards a cleaner, faster WordPress πŸ™‚

Your email address will not be published. Required fields are marked *

  1. Etienne BRETTEVILLE
    December 9, 2015

    Nice explanation, thank you!

    1. You are welcome Etienne πŸ™‚

  2. Pink Cake Box
    December 9, 2015

    Jordan – thanks for all the great work that you do with this plugin.

    I do want to make sure I understand this statement “Now, WordPress still doesn’t generate the Retina (high-dpi) images and WP Retina 2x will do its duty, as it always did.”

    As I understand it, with the srcset and sizes attribute, browsers will take into account the screen density when selecting the appropriate support. So if my theme has the “appropriate sizes” setup then retina will be supported.

    So for a simple example, if I always use 900px width photos, I need to ensure my theme has a image size for 900px and 1800px.

    Now the advantage of your plugin is it will always generate an image 2x the resolution no matter what sizes you have setup in your theme. And this is still very helpful especially if you don’t always use standard sizing for your images.

    Let me know if this makes sense and if I still understand the advantage of your plugin.


    Jesse Heap

    1. Hello Jesse! Exactly, that is what was happening with PictureFill already before. Whatever your image sizes are, WP Retina 2x will ensure that the retina images are also created, and will show you if it’s the case or not in the Media Library and Retina Dashboard. The retina sizes are not registered in WP because it doesn’t need to be (and you are not going to use those retina sizes directly anyway), so that keeps your WordPress and admin clean.

  3. Mike Blake
    December 29, 2015

    Thank you for this explanation Jordy! Curious about my theme, as it automatically generates a responsive image depending on container width always using the full size version. With Retina 2x installed, I had to change src to pull the appropriate image size and your plugin would make sure retina version was served to retina screens. Now with 4.4 and responsive images activated, can I change src back to the theme default and the proper sized and retina images will always be served to retina devices?

    1. Mmm, I am not sure, since I don’t know how your website pulls out the images. It’s better to try first πŸ™‚ I don’t understand why there is a theme default for the src however: when you add images into your post you have a choice right?

      1. Mike Blake
        December 29, 2015

        The Cornerstone page builder in Theme X uses an image shortcode for the src. Unless it’s manually added through the text editor.

  4. Liz Gallagher
    February 1, 2016

    I’m interested in purchasing the Pro version of WP Retina 2X but I need to know how the licensing works for a WordPress Network install. We have numerous sites all running on the same domain plus a number of sub-domains. Can one license be used for all of them since they are technically all on the same domain? Or do you have a multi-site license? Please advise. Thank you!

    1. Hello! Sorry for the late reply. Basically it’s one install / website, one network install can have many installs (even if they look like one). The fact I have written “per domain” is misleading, I need to rephrase this.

      1. Liz Gallagher
        February 9, 2016

        Your response is a bit vague and I’m not sure it answers the licensing question. Are you saying that we need to purchase a separate license for each website on the network? Or can we use one license for the entire network?

        1. 1 license = 5 websites. A multi-install or network install can have an unlimited number of websites. If you have only 5 websites on your network, then it’s okay. The serial number has to be inserted in every each of those websites.