Get Redactor to display a thumbnail of an image linked to the full version, when using the "Insert Image" button1 user found helpful
Here's the thing: I have a table in a Content block. The cells in some columns need to have image thumbnails leading to the full image. I can use the "Insert Image" feature of the Redactor editor, but it inserts the image at its full size. I can then resize it to thumbnail-size with CSS, but the file size stays the same - I can't have the page contain ~50 MB of photos resized to tiny thumbnails load at once.
A rough workaround would be to make a thumbnail of each photo by hand, then insert the thumbnail, then jump into the HTML view of Redactor to manually link each thumbnail to its full sized counterpart. But that's a hassle.
Can I modify Concrete5's Redactor in some way that would automatize it? Perhaps create my own button "Insert image thumb" which would get ImageHelper to generate a thumbnail and link it to the full size automatically?
If so, I recommend one of the gallery blocks or making a custom block.
Using Redactor for what you describe doesn't seem like the best option.
See for yourself, if you'd like:http://www.orionpsudb.com/news/say-hello-to-new-player-the-psu-mark...
I will need to do it in a similar fashion on pages with a lot bigger tables, like here:http://www.orionpsudb.com/ocz,http://www.orionpsudb.com/platforms... - the tables aren't an image gallery, but the photo thumbnail is just another attribute of the product.
I can also insert the photos as plain textlinks, but I'd like to try out the thumbnails first.
- batch process your thumbnails to avoid making them individually
- make sure you add a clear suffix to the original filename when batching them like _thumb, _small, or thumbnail_50px so you can quickly find the thumbnail
- when you upload them, adding them to a new or existing file set can make it easier to keep them organized
- in Redactor, Insert Image and add your thumbnail
- click on the image thumbnail that you added and select Edit
- in the Link input, select the file icon and choose the large version of your image
- in the Open Link select drop down, choose Open link in Lightbox
- in the Link Type select drop down, choose Image