Overriding Accepted Media Types

Based on the supported types table shown on the previous page, you can modify the accepted media types.

If you would like to specify your own allowed file types, add the following property to the media property in your defineConfig function.

//tina/config.{ts, js}

export default defineConfig({
  //...
  media: {
    tina: {
      //...
    },
    accept: ['image/jpeg', 'video/mp4'],
  },
})

accept: List<String>

This property determines the filetypes that can be uploaded

Restricting a single field

media.accept applies to every upload. To restrict one field instead, give an image field its own accept. It takes extensions and category shorthand rather than MIME types, and overrides the global list for that field.

{
  type: 'image',
  name: 'brochure',
  label: 'Brochure',
  accept: 'pdf',
}

next/image

If you are using Next images, you will need to add the following to your next.config.js file to allow access to external images hosted on the TinaCMS media hostname

//next.config.js

module.exports = {
  images: {
    domains: ['assets.tina.io'],
  },
}