5.11 Fields for Images ↑

5.11.4 Image Class

This field label can be used to identify the name of a CSS class that is to be assigned to the HTML img tag generated by the Image Name field.

Notice that Image Class should be used as a field label in order to invoke this functionality, but should not be used as a field type. Instead, the Combo field type can be used.

Here is an example of what this would look like within the the Collection Template File.

Image Class: <combo>

Two CSS classes are supplied as part of the default CSS code, but the user may add more via custom CSS.

The two defaults are as follows.

img.no-border { max-width: 100%; border: 0; }
img.max-75 { max-width: 75%; }

When used, these will modify the standard default img styling specified by Notenik.

img { max-width: 100%; height: auto; border: 4px solid gray; }