The Auto-sized image block is designed to replace the default Concrete5 image block. It supports almost all features of the standard image block, but will also auto-fit the width image to the area that it's placed in.

Which means no more guessing how many pixels the image should be.

The resizing happens intuitively, and will resize the image block if you move it between areas on the page (eg Main and Sidebar), and also works within Concrete5 layouts. If you resize the width of a layout column, the image block will resize.

The block also comes with a number of other handy features...

• The option to have a lightbox popup on the image (using Colorbox)
• The option to add a border to the image
• The option to add round corners to the image (limited suport in IE)
• The option to add dropshadows to the image (limited support in IE)
• The option to add a margin to top / bottom / left / right
• The option to add a caption below the image, and to center the caption.
• The option to link to an internal page or an external URL (just like the standard image block)

All the above can be configured via the settings page in the dashboard - you can globally adjust the width / color / style of the borders, the style of the dropshadows, the radius of the round corners, and the settings for the Colorbox popups.

Or if you prefer, you can simply style these in your CSS file (there are plenty of classes added in the HTML for you to hang styles off). The view is also very simple, so adding a custom template is also straightforward if you need to.

This block is a must for anyone who struggles with image sizes on the standard image block, or if you are looking for a more versatile way to manage image blocks.

Please note that the auto-sized image block is designed for fixed-width themes only. Fluid-width and responsive layouts are currently untested and  unsupported (although we plan to add support for these going forward).