estruyf / vscode-front-matter

Front Matter is a CMS running straight in Visual Studio Code. Can be used with static site generators like Hugo, Jekyll, Hexo, NextJs, Gatsby, and many more...

Home Page:https://frontmatter.codes

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Enhancement: Media collections + Media collection constraints (size/ratio rules)

tohagan opened this issue · comments

Is your feature request related to a problem? Please describe.

Having a CMS tool that I can hand over to a non-web developer to create graphics content would be gold! To do this I need the ability to (a) only permit selection of graphics from a specific collection for a given field (b) constrain graphics in a collection to a specific dimension so a content creator can upload and edit compliant images for that media collection.

e.g. For conferences, I need a way to enforce image aspect ratio and minimum dimensions for speakers, sponsors, electives, accommodation, products, social graphics etc. I need an image editing feature that enforces image aspect ratio (for HTML layout) and a minimum dimension (for image quality).

Describe the solution you'd like

L1: Allow an image field type to specific a subfolder like src/assets/speakers or src/assets/sponsors to select one/multiple images from that subfolder.

L2: Go next level and set the image aspect ratio and minimum width or height for each media collection. When an image is uploaded to a media collection, edit the image using zoom/pan/crop feature to ensure it complies with the media collection rules.

Describe alternatives you've considered

I tried creating subfolder under src/assets to create image collections. The Media Dashboard displays the subfolder icon but I can't preview or select images in a subfolder and in the field I can't see or select a subfolder image. When I set a subfolder image the image was not displayed in the field on the side panel (BUG?).

Additional context

React code for Image pan/crop editing.

L1 and L2 are both great suggestions!

About the issue, when the settings are configured correctly, you should be able to use an image from any folder.

Just tried out your configuration:

image

Can you show me a recording of your experience?