Media Types

ZingGrid has defined iframe and image column types which you can use to customize your grids with various media content.

Images

Use the image column type to display images in grids, like so:

<zg-column index="imageUrl" type="image"></zg-column>

Images in Columns Grid

Here is a complete grid that displays data in the form of cute images of cats:

GIFs

You can also use the image column type to display GIFs in grids.

GIFs in Columns Grid

Here is a complete grid that displays data in the form of cat GIFs:

Video

Use [index="videoUrl"] with the iframe column type to display videos in grids, like so:

<zg-column index="videoUrl" type="iframe" alt="missing iframe"></zg-column>

Videos in Columns Grid

Here is a complete grid that displays data in the form of embedded videos:

Google Maps

Use [index="map"] with the iframe type to display maps in your grids, like so:

<zg-column index="map" type="iframe"></zg-column>

Google Maps in Columns Grid:

Here is a complete grid that displays data in the form of maps embedded from Google Maps:

Related Resources

Here are some extra resources related to this feature to help with creating your grid:

• Data Types Documentation