Thursday, March 26, 2020

Drupal 8 Media Library with SVG upload

Uploading the media content and maintaining together with reusability was one of the challenges in earlier versions of drupal. Media Library has been included in the Drupal core. It has a better user experience including multiple media types that can be customized based on development requirements.

Media Library is a media management tool that enables you to find media that exists in your site and to add new media items. It allows you to search, sort, and create media items with a customizable interface. It can be used to add media items to an entity reference field or embed media into your content via a text editor.



To use the media library luxury, Throughout the site we should use the media field. It will help us to collect the media elements as a single point and will be provisioned for us to reuse using the media library.





Media type management will be maintaining the list of media types being supported by the media field. We can add the new media type through the user interface.

If you have appropriate permissions, this area allows you to add media items to the media library (it does not appear if you don't have permission).
By default media type has Audio, Document, Images, Remote video, and Video. In each type,
you can choose the source of files that can be accepted.
Adding SVG upload to Core Media Library
In the contribution community, there is a module called SVG Image field, that will help us to
enable the SVG to upload throughout the drupal content type.

Contribution module - https://www.drupal.org/project/svg_image_field
To enable the SVG format upload in the media library, we need to add a media type in structure.

To use the SVG upload in the content type, please follow the below steps

Add content type with media fields (To get the privilege of media library we should use
"Media" as field type)
Select a reference type as appropriate on next field configuration screen (I have opted for "image" and "SVG Image upload")


No comments:

Post a Comment