Responsive image support in Extended Details

Permalink Browser Info Environment
Hi! In 'Extended Details' it's possible to load images into Redactor. However, these images are not using concrete5's responsive image feature (i.e. <picture> tags with source sets), even though our site is set up to use it. When an image is loaded into "Extended Details", it outputs only an <img> tag:

<img id="image-marker" src="http://localhost/c5site/index.php/download_file/view_inline/36">


This leads to huge images being loaded where they are not really needed. Is there a way to enable responsive images or some way to get the small thumbnail for inserted images directly?

Otherwise, the Add-On is really great and exactly what our customer wanted for this project. Cheers :)

Type: Discussion
Status: In Progress
View Replies:
mesuva replied on at Permalink Reply
mesuva
Howdy and cheers for the positive comment.

I unfortunately don't know of a way to output a picture element into the extended details, this may just have to be a case of pre-sizing the images before uploading them. If we were managing this ourselves we'd potentially be resizing a bunch of images in bulk and uploading them to a fileset, where they could be quickly picked.

If you're not so worried about the filesize and are just looking for a css solution to restrict the width, you could add something like:
.msv-location-map-map .gm-style-iw img {
    max-width: 200px !important;
    height: auto !important;
}

To the site's global styles. Or you can also resize the image in Redactor to apply a manual height and width.

I think a true solution to this would be something programatic, where an image is associated with the listing and automatically thumb-nailed and placed into the extended details. It's really a custom bit of functionality so not something I'm likely to add to the add-on directly. You're welcome to make direct contact through [email protected] if this is a critical part of your setup and you do need this customised.
publicb replied on at Permalink Reply
Hey! Thanks for taking the time to reply.

The funny thing is that extended details is using Redactor and in c5's documentation on responsive images it says that this would take care of creating the picture elems/srcsets for inserted images.

We can live with the CSS solution and users potentially having to resize images for now. Thanks a lot for your feedback!

concrete5 Environment Information

# concrete5 Version
Core Version - 5.7.5.13

# concrete5 Packages
Location Map (1.0.3)

Browser User-Agent String

Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

You may not request a refund that is not currently owned by you.