get Simple Image 1.0
for Typesetter CMS ver. 5 and newer
Unpack the ZIP into your /addons directory and install it via
Admin Toolbox → Plugins → Manage → Available → Install
Simple Image is a quite basic content type (section) meant for use cases where neither the built-in Image section type nor Responsive Image aren’t ideal: Its main purpose is to provide an easy user interface dedicated to situations, where images need distinct, replicable properties–much like the Simple Button plugin does with buttons. There is barely anything you couldn’t also achieve using inline images in CK Editor. It’s just more convenient in some situations, e.g. when you use responsive grid layouts with uniform elements or need vertical alignment.
Version 1.0 – finally. It will be available on typeserttercms.com short-term
Version 1.0b1 – now also correctly remembers the state 'scale to fit'
At first glance, the editor component looks pretty much like the one from Responsive Image, but it has no fancy focuspoint feature and there is no caption. In fact the image preview area has (at least up to now) no functionality–I might add a non-destructive cropping feature in a future version.
The [Select Image] button will bring up Typesetter’s file manager (AKA Finder) where you can, guess what… :o)
The second element is the Alternative Text (the image’s alt attribute). When empty, it’s value will be auto-generated from the image’s file name by replacing undersores with blanks and stripping the file extension. Clicking the [A] button will perform the same action, replacing any already set value.
The field below is for linking. Type or paste an URL here. An autocomplete dropdown will suggest internal page URLs. The button with the file icon will pop up Finder to select a file to be linked.
The dropdown select for sizing has 4 options:
Alignment will–for obvious reasons–only apply in cases where the image’s size is smaller than the section size. This is always the case when …
Vertical alignment will only apply (or, to be precise, be visible) when the section has a defined height. A defined section height may derive from a height or min-height style attribute set in Section Attributes (via the Options icon in Section Management) or CSS classes + rules defined in your theme stylesheet or in Layout Editor. (Hint: display:table + display:table-cell or display:flex may be your friend in cases when equal column heights with vertically centerd images are needed).
This will load the link target into Colorbox. Internal pages will only load the page content (without nav, sidebars, footer, etc.) but this will only work when you’re logged off for technical reasons. You might already know this option from the Responsive Image plugin .
Also already known from Responsive Image: Uses the browser’s fullscreen mode.