Image Previews of Fieldsets

[Nicholas-Westby]

When a content editor adds an Archetype fieldset to a property, this is the selection dialog they see:

They have no idea that a "Link Sidebar Callouts" looks like this:

Would be really useful if there were a "See Example" link next to that "Link Sidebar Callout" that, when clicked, showed the above screenshot.

So, the request is to be able to associate each Archetype fieldset with an image so content editors can have a better idea of what it looks like when they are constructing pages. I'd recommend presenting it as a link rather than displaying it inline, as displaying it inline would look a bit weird (assuming some of the screenshots would be very large).

It might looks something like this:

Clicking that could just open the image in a new window, or could open it in a lightbox.

[kjac]

@Nicholas-Westby I like this idea a lot. It shouldn't be too hard to do, if we can make do with configuring relative paths on the server for each applicable fieldset, so we don't have to muck about with uploading files on the config page.

[Nicholas-Westby]

@kjac Configuring a path works for me. If we go with the simple option of opening the image in a new window, I can probably submit a pull request in the next few weeks (unless you want to tackle it before then).

[kjac]

@Nicholas-Westby I'll come up with something this weekend and run it past you.

[kjac]

@Nicholas-Westby how about something like this?

[Nicholas-Westby]

That looks fantastic! Might be somewhat problematic for widgets that are wide (I'm assuming that's doing max-width: 100%;), but beyond that minor nitpick this looks like a huge improvement for usability when using Archetype for widgets.

One idea for improving the ability to view wide images would be to have a link in the image view that says "(open in new window)".

[kjac]

@Nicholas-Westby I've added a zoom icon when hovering the image, and wrapped the image in a link that opens in a new window.

Looks something like this:

[kjac]

Fixed in v1.14.1