Getting Started
Media Library
The media library is a powerful feature that allows you to upload and manage files in your application. It comes with a versatile set of tools and fields that allows you to upload files, replace files, add Alt Text, and categorize assets into folders and nested folders.
Note that if deleting or moving a piece of Media does not update the references to that Media in your content, you will need to manually update the references.
Uploading
To upload a new Media Asset, click the "Upload" button in the top right-hand of the Filament CMS.
This will display an upload area that you can drag and drop files into or click on to open a modal popup and browse your filesystem for files to upload.
Once an Asset is uploaded, you will still need to confirm them by clicking "store image" within the upload area.
Folders
You can organize Media Assets within user-created Folders as you wish. Add a new Folder by clicking the "+" icon in the top left.
Alt Text
Within a Media Asset that does not have Alt Text, a red warning icon will be displayed over the image preview in the CMS. Uploading a new Media Asset will not automatically add Alt Text. You will have to add them yourself.
Informative images are any images that add to the context of a page. If the content of a page would suffer if an image was removed, then that image is informative and therefore needs an alt text. The alt text needs to describe the image as concisely as possible.
As a rule of thumb: avoid writing text alternatives longer than 100 characters. Having long alt text will result in a poor user experience for those using screen readers. If the image requires a lengthier description, it is better to describe the image in the content and provide a shorter alt text.
Adding Alt Text
To add Alt Text to uploaded Media Assets these within the Media Library, click on the Asset. In the information panel to the right/bottom, or anywhere you can add Media within the Media popup Modal > click on the Asset > information panel to the right/bottom.
When adding Alt Text to existing Media, clicking "Save" may not refresh the page or remove the "flag" icon automatically.