Last active
August 6, 2020 05:51
-
-
Save pryley/8b0b2b667010cbf49dff5283058d43a0 to your computer and use it in GitHub Desktop.
Statamic 3 field for displaying multiple images
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="size-{{ grid_size }} gap-4 grid | md:grid-cols-12 | xl:gap-6"> | |
{{ assets:images }} | |
<figure class="| md:{{ grid_columns }}"> | |
{{ responsive:url glide:width="1200" :ratio="image_ratio" }} | |
{{ if alt }} | |
<figcaption>{{ alt }}</figcaption> | |
{{ /if }} | |
</figure> | |
{{ /assets:images }} | |
</div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
title: Figures | |
fields: | |
- | |
handle: images | |
field: | |
mode: grid | |
container: assets | |
restrict: false | |
allow_uploads: true | |
max_files: 12 | |
type: assets | |
localizable: false | |
listable: hidden | |
display: Images | |
- | |
handle: image_ratio | |
field: | |
placeholder: 'Select the image ratio' | |
options: | |
2/1: 'Landscape (2:1)' | |
3/2: 'Landscape (3:2)' | |
4/3: 'Landscape (4:3)' | |
16/9: 'Landscape (16:9)' | |
1/2: 'Portrait (1:2)' | |
2/3: 'Portrait (2:3)' | |
3/4: 'Portrait (3:4)' | |
9/16: 'Portrait (9:16)' | |
1/1: 'Square (1:1)' | |
clearable: true | |
multiple: false | |
searchable: false | |
taggable: false | |
push_tags: false | |
cast_booleans: false | |
type: select | |
localizable: false | |
listable: hidden | |
display: 'Image Ratio' | |
validate: required | |
- | |
handle: grid_columns | |
field: | |
placeholder: 'Images per row' | |
options: | |
col-span-12: '1 Column' | |
col-span-6: '2 Columns' | |
col-span-4: '3 Columns' | |
col-span-3: '4 Columns' | |
col-span-2: '6 Columns' | |
clearable: true | |
multiple: false | |
searchable: false | |
taggable: false | |
push_tags: false | |
cast_booleans: false | |
type: select | |
localizable: false | |
width: 50 | |
listable: hidden | |
display: 'Grid Columns' | |
validate: required | |
- | |
handle: grid_size | |
field: | |
placeholder: 'Row size' | |
options: | |
sm: Tiny | |
md: Small | |
lg: Medium | |
xl: Large | |
full: Full | |
clearable: true | |
multiple: false | |
searchable: false | |
taggable: false | |
push_tags: false | |
cast_booleans: false | |
type: select | |
localizable: false | |
width: 50 | |
listable: hidden | |
display: 'Grid Size' | |
validate: required |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment