Image Fields

THIS PAGE
In the graph
In the CMS
In the API

Image type fields are, like the name suggests, useful for storing images. Additional validations can be added to make it conform to particular type of images.

In the graph

Screenshot

Create an image field by simply creating a new field and marking the input type as Image.

Additional Properties

Property Description
Multiple Whether multiple images can be uploaded [Like a gallery]
Required Whether the value is a required field. Can be set in the Validations section

Validations

The Image field supports validations around image size, type and ratio.

Operate On Possible Conditions Possible Values
Image Size > , >= ,= ,<= ,< Any Size in KB
Image Aspect Ratio = Aspect ratio specified 16:9, 4:3 etc.
Image Type Comma separated list of extensions .jpg,.png

Multiple validations can be chained together with AND operations

See Field Validations for more information on how to add validations.

In the CMS

Screenshot

When you publish an image field, it's available in the Content Management System as a image upload input. The user can upload images by either clicking on them or by dragging an image into the input field.

In the API

In the API the output response for this field is an image URL pointing to the link for the image. We store and serve images through a high performance CDN.

Sample GraphQL Request

{
  movies {
    title
    poster # Marked as an image field
  }
}

Sample GraphQL Response

{
  "data": {
    "movies": [
      {
        "title": "Superman vs. Spiderman",
        "poster": "https://cdn.canonic.io/user-uploads/12emdjno2ui3/svs-poster.png"
        // link to the image file
      }
    ]
  }
}
Did you find what you were looking for?
πŸ‘
πŸ‘Ž
What went wrong?
Need more help?We have a thriving Discordcommunity that can help you with all things Canonic. β†’