Marketing Sale Grid

The grid is created using the CSS Grid Template Module and can have up to 48 items. The number of items per row is adjustable for each device type. The grid items use flexbox to align the links at the bottom using less code than other methods.
Image
The images should be cropped to the maximum width that they will be displayed at before importing into EverWeb. An image width of 400px is large enough for most purposes.
There are controls for border width and color to add to product images if required.
Container Styles
The wrapper has controls for adjusting the background color and its opacity and the vertical spacing from the items above and below it.
The container has a maximum width setting and there are controls for adjusting the left/right padding and the grid gap.
Grid Items
The grid items have adjustable padding and can have a border using the controls for border width, color and radius.
The heading can be aligned left, center or right and there are options to show a price with a contrasting color if required.
There is a control for adjusting the vertical spacing of the heading, price, text and link.
Link
The links are positioned at the bottom no matter what size the content is so that they all line up horizontally. The font size, color, hover color, background color and border radius can all be adjusted.
The link can be configured to open internal or external pages and in a new window if required. Click the link below to find out how to use relative and absolute file paths for links created in the EverWeb widget API Assets List.
Sale Tag
The optional sale tag can be turned on per item. It can can have its font size and color and the background color and its opacity adjusted.