3

I am trying to implement Retina.js plugin for displaying alternate images on retina display. This will certainly work if I have a fixed image path hardcoded into the page or theme but how do I make this work through the Image block? Or is there a better alternative to this?

user1448031
  • 2,172
  • 11
  • 44
  • 89

1 Answers1

2

That library sounds a little heavy handed in just pinging your server for every single image. However, if you include it in the page it should work just fine.

One thing to keep in mind is that by default concrete5 uses the <picture> tag to output from the image block. Any library you use should have compatibility with that tag.

If you end up using a library that requires you output the image differently, I'd recommend creating a custom \Concrete\Core\Html\Image subclass and binding it to the container in you /application/bootstrap/app.php file:

<?php

$app->bind('html/image', \My\Custom\Image::class);
Korvin Szanto
  • 4,531
  • 4
  • 19
  • 49
  • Is it still true that concrete5 uses the `` tag? I'm not seeing that in the latest version, `5.7.5.8` — just the classic `` tag. And does Concrete5 present any solution to displaying retina versions of uploaded images (provided they are uploaded at 2x or more)? It could use the `srcset` property in the `img` tag as described [here](https://cloudfour.com/thinks/dont-use-picture-most-of-the-time/). – jonkratz Jul 16 '16 at 20:03
  • Check out [the `html/image` service](https://github.com/concrete5/concrete5/blob/develop/concrete/src/Html/Image.php#L42-L63), it will conditionally render as a picture tag if the theme tells it to. – Korvin Szanto Aug 04 '16 at 16:11