Menu
Products
Products
Video Hosting
Upload and manage your videos in a centralized video library.
Image Hosting
Upload and manage all your images in a centralized library.
Galleries
Choose from 100+templates to showcase your media in style.
Video Messaging
Record, and send personalized video messages.
CincoTube
Create your own community video hub your team, students or fans.
Pages
Create dedicated webpages to share your videos and images.
Live
Create dedicated webpages to share your videos and images.
For Developers
Video API
Build a unique video experience.
DeepUploader
Collect and store user content from anywhere with our file uploader.
Solutions
Solutions
Enterprise
Supercharge your business with secure, internal communication.
Townhall
Webinars
Team Collaboration
Learning & Development
Creative Professionals
Get creative with a built in-suite of editing and marketing tools.
eCommerce
Boost sales with interactive video and easy-embedding.
Townhall
Webinars
Team Collaboration
Learning & Development
eLearning & Training
Host and share course materials in a centralized portal.
Sales & Marketing
Attract, engage and convert with interactive tools and analytics.
"Cincopa helped my Enterprise organization collaborate better through video."
Book a Demo
Resources
Resources
Blog
Learn about the latest industry trends, tips & tricks.
Help Centre
Get access to help articles FAQs, and all things Cincopa.
Partners
Check out our valued list of partners.
Product Updates
Stay up-to-date with our latest greatest features.
Ebooks, Guides & More
Customer Stories
Hear how we've helped businesses succeed.
Boost Campaign Performance Through Video
Discover how to boost your next campaign by using video.
Download Now
Pricing
Watch a Demo
Demo
Login
Start Free Trial
Adding video uploads as fields within Sanity documents enhances content by enabling seamless media integration. By leveraging Sanity Studio’s schema definitions, the built-in asset pipeline, and frontend rendering, you can create flexible and dynamic content models that incorporate videos effortlessly. This approach streamlines video management, simplifies the content creation process for editors, and allows for customizable, extensible schemas that grow with your project’s needs. Prerequisites Set Up the Sanity Studio Using this Guide — Sanity Installation Basic understanding of Sanity schema definitions and how to modify them. Node.js and npm are installed for running and building Sanity Studio. Optional : a connected frontend application (such as Next.js or Remix) for displaying videos uploaded to Sanity. Define a Custom Video Block Schema for File Uploads Sanity supports a native file type to upload any file type, including video files. To create a video upload block: Step 1 : Open the schemaTypes folder in your Sanity Studio project. Step 2 : Create a new file named video.ts (or .js if using JavaScript). Step 3 : Define a schema using Sanity's file type and restrict it to video formats. Example : export default { name: 'video', title: 'Video', type: 'object', fields: [ { name: 'videoFile', title: 'Video File', type: 'file', options: { accept: 'video/*', // Accept only video formats for upload }, validation: Rule => Rule.required() // Make video upload required if desired }, { name: 'title', title: 'Title', type: 'string', validation: Rule => Rule.required() }, { name: 'description', title: 'Description', type: 'text', rows: 3 } ] } This schema enables uploading video files directly from the device, with additional metadata fields for title and description. Add the Video Block to Your Document Schema's Content Array Open the main document schema where you want to include video content blocks, such as post.ts or a similar file in schemaTypes . You will typically have a field like: { name: 'content', title: 'Content', type: 'array', of: [ { type: 'block' } // text blocks ] } Modify it to include your custom video block type: import video from './video' export default { // ...other schema properties... fields: [ { name: 'content', title: 'Content', type: 'array', of: [ { type: 'block' }, video // Add video block here ] } ], } Also, make sure to import your video schema into your main schema entry point, where all schema types are combined. Restart Sanity Studio and Test Upload Step 1 : Save the changes to your schema files. Step 2 : Stop and restart your Sanity Studio server ( sanity start command). Step 3 : Open the Studio in your browser and navigate to the document type where this block is added. Step 4 : In the rich text editor, add a new video block by selecting your custom 'Video' block from the insert options. Step 5 : Upload a video file directly from your device using the file selector. Step 6 : Provide optional title and description metadata. Render Uploaded Videos in Your Frontend Application Sanity stores uploaded video files as assets that include URLs for fetching. Your frontend app needs to recognize the video block type and render the uploaded video accordingly. Example in React with a Portable Text serializer: const serializers = { types: { video: ({ node }) => { const videoUrl = node.videoFile.asset.url; return (
{node.title &&
{node.title}
}
{node.description &&
{node.description}
}
); } } }; Pass this serializers object to your Portable Text component rendering Sanity content.