Community Articles Managing Rich Media and Video with Cosmic JS

Managing Rich Media and Video with Cosmic JS

Cosmic JS has powerful content modeling and delivery tools to help your team build apps faster, together. The Cosmic Content Editor lets you upload and manage all your content, data and files, and is unopionated on the format of content you're uploading. 

You can create Media Folders, Media Metadata and even select a thumbnail image for your Bucket. The Cosmic Editor allows you to upload any rich media such as video, images and embedded content linked to third-party platforms. Let's look at a couple examples. 


Upload and Organize Images, GIFs and Video

You can use the left hand nav bar in your Cosmic JS Bucket Dashboard to start adding media. Organize media into folders to directly insert into Objects via the Content Editor at a later publishing date. 

Hovering over the Content Editor toolbar, locate "Insert Image". Cosmic gives you the ability to upload images, link images and browse images already in your Media folder. 



Insert Video by URL

Navigate to the Cosmic JS Content Editor and hover over the toolbar to locate "Insert Video". Cosmic lets you insert the video by URL, embedded code or by simply uploading the video file into the editor. 





Embed Content 

You can embed links to third-party platforms like YouTube, Facebook or Twitter by navigating to the toolbar and locating "Embed URL". 



Creating a Metafield

It’s easy to retrieve your media data using the Cosmic JS API. Data from the API include: HTML for embedded code in HTML textareas, links to media to the Cosmic JS CDN and Imgix image processing URL.


Conclusion

I've just presented three examples of rich media being uploaded and managed within the Cosmic JS Content Editor. Cosmic customers manage everything from simple text Objects to animation and textures for virtual reality. The types of content your team needs to manage will vary, but Cosmic JS has you covered. 


If you have any comments or questions about uploading and managing rich media with Cosmic JS, reach out to us on Twitter and join the conversation on Slack.

Was this article helpful?

Thank you! Your input helps us improve our articles and resources. If you have any other questions or comments, please contact support.

You may also like


Cosmic JS makes it easy to deploy your websites and applications to the web. You can deploy an app from any git repository to the Cosmic App Server from any Bucket. Cosmic JS uses Dokku (Docker + Heroku-like deployment) to deploy your app from any GitHub, BitBucket or any other public repo.
Video: Build a Cosmic JS-powered blog using Gatsby
Blazing fast blog built using React Static that utilizes the power of Cosmic JS.
For simple shopping websites, going with full-fledged solutions like Shopify or Woocommerce can be a total overkill. In this tutorial, we're going to build an e-commerce website using Nuxt and Cosmic JS.
Website built using the Next.js Website Boilerplate. Fully responsive down to mobile, SEO ready, includes a contact form and full site search.
Cosmic JS lets you build one-to-one as well as one-to-many Object Relationships within your Bucket Dashboard. To help you and your team manage content more seamlessly, you can now see your Connected Objects located on the Object’s Edit page in the Dashboard.

Ready to Get Started?

No payment info required.
Start Now   Contact Sales