Media Library

All media assets (image, audio, video, pdf, etc.) that get used on a Ziggurat page need to live in the Media Library. Remember, Ziggurat is a Content Management System, and part of what we’re managing is media assets. Uploading assets to the Media Library means they become locally hosted assets, putting them into a centrally located place. This way, links to assets can be easily found, links are less prone to breaking, and updating assets with new versions is simple.

Whether you access the Media Library through the Manage Bar or via a Block will depend on what you are trying to accomplish and your particular workflow. Accessing the Media Library through the Manage Bar allows you to view and manage all uploaded assets, as well as allowing you to upload new assets. Accessing the Media Library through a Block allows you to upload media to the Media Library, and select assets to place in a Block.

Via the Manage Bar: View & Add Media

To access the Media Library, hover over Content to reveal the drop down menu. Then click Media.

You’ll also notice that hovering over Media opens a submenu Add Media. If you’re just looking to quickly upload a media asset, you can go directly to uploading here, by selecting the type of media you are uploading. Whereas clicking on Media takes you to the bank of media assets that have already been uploaded to the Media Library.

View & Sort Assets: Media Library Page

The Media Library gives you two methods for displaying our assets: Table and Grid. These options are located near the top of the page, below the large Media title. Table is the default view. Clicking Grid will toggle you into Grid view.

Below that you have an Add Media button. This is equivalent to the Add Media menu item above. You’ll be adding lots of media when working in Ziggurat, so we wanted this feature to be accessible in as many places as possible.

Below that you have search and filter features. Media assets add up quickly, so being able to search and filter is key! The Media Name field allows you to search by typing in part or all of a media asset’s name. Type allows you to search by media type. You can also filter by published status or language. You can also use multiple filters in your search.

Below you have four actions in a drop down menu: Delete Media, Publish Media, Save Media, and Unpublish Media. You can apply these actions to selected thumbnails by checking the small box next to the asset(s) and clicking the button Apply to Selected Items.

And, finally, we you your Media Assets. By default they appear in the order of most recently uploaded or updated.

In Table view, assets display in rows, with information about the asset in columns. You have a check box to apply batch actions from the action menu above. Then a thumbnail, the media name, the type (image, audio, file, or video), the author (that’s who uploaded it), the status (published or unpublished), when it was updated last, and operations (edit or delete).

By default you see the media assets sorted by most recently uploaded or updated. You can reverse the order by clicking the little blue arrow by Updated. Alternatively, you can sort your assets by any category that is a blue hyperlink: Media name, Type, or Status.

Add: Uploading an Asset

To upload an asset, click Add Media button. Choose the type of media you are uploading. Alternatively, you could get to this page from anywhere on the site through the Manage Bar, by mousing over Content > Media > Add Media, and selecting Audio, File, Image, or Video.

This page has a couple of fields that you will need to fill in, in addition to uploading the file of your image asset. The exact fields will depend on what kind of asset you are uploading.

For an image, you will first need to Name your image. This is required. (All required fields have a red asterisk by their title.) Consider using a file naming convention to make your asset easily searchable.

The next field is Media Category. This is not required, but can be useful for categorizing types of images for searching later.

Next you’ll want to upload your image by clicking choose file to open up your system Finder (Mac) or File Explorer (Windows). Select your file and click Open. Alternatively, you can drag and drop your file directly onto the Choose File button.

Note that the allowed file types are .jpegs, .pngs, and .gifs. Files larger than 256MB cannot be uploaded.

When you do this you’ll see an Alternative Text field appears. This is a required field, which you must fill in for accessibility purposes. When a screen reader is reading out the contents of a web page, it needs this alternative text (commonly called “alt text”) to describe images. You want this to be a short, “at a glance” description of your image.

Below the Alt Text field, we have a hyperlink with the image’s original file name. Clicking on the hyperlink will open the image in a new window. If you ever need to know the image’s URL (this is uncommon, but can be useful in some cases), it is located here. After the hyperlinked filename it indicates how big the file is.

Next to that is a button that gives you the option to remove the image file. Use this if you uploaded the wrong file the first time, or if you want to replace the asset with an updated version of the file. This is part of what’s handy about the Media Library. If this image is in use on one or even a few pages, but then you have to make an adjustment to the file, you simply update the file in the Media Library, and then Ziggurat will update the image links wherever that image is used. (Note that if you remove an image file, it will also delete the associated Alt Text.) Also note that this is not for removing the asset from the Media Library. To do that, you will need to return to the Media Library main page.

Last is the Modal Caption. This is an optional field. It supplies the CMS with caption text for Carousels and Modals. (Carousels are a type of Block that allows you to cycle through images or videos, and Modals are a style applied to Image Blocks that make a pop-up box when you click on an image.) If you’re not sure whether you will be using this image in a Carousel, or applying a Modal style, you can always leave this blank for now and come back and fill it in later. It’s just a WYSIWYG editor that you see in a basic block, with the same options to style text. 

Below that you have the ability to publish or unpublish assets. By default this is set to published. This is the most common setting.

Below you have fields for revision and author information. 99% of the time you will not be dealing with these fields, but know that they are there.

Finally, click the blue Save button to save your image.

Now your image has joined the other assets in the Media Library. If at any point you need to modify that image asset, you can either click on its name, or click Edit on the Operations dropdown. This will return us to the settings for our asset.

To upload an audio asset, click Add Media and then choose Audio. This will look similar to the Image upload. You have a required Name field, and optional category field, and, of course, you need to upload a file. That can be a mp3, wav, or aac. Once again, there is a 256MB limit.

We also have two new optional fields: Title and Subtitle. These appear below the audio player; the title appears in bold and the subtitle appears after it in a normal weight.

To upload a file, click Add Media and then choose File. This is a less commonly used asset type, but can be quite useful. This is for files like pdfs, text documents, or spreadsheets. Here you simply upload the file and click save. Note that the name for a File asset is its filename, so make sure that you have a good, searchable filename before you upload.

To upload a video, click Add Media and then choose Video. Note that we recommend hosting most video files through a third party server, like Vimeo or Youtube, as they are better set up to accommodate server-intensive files like videos. But, if you have a short video, or if you want to use a video as a hero, then you will upload it into the Media Library. Once again, you will give your video asset a Name. You then have optional fields for Media Category, and a Title and Subtitle. Then you must upload a video file. The only accepted file format is mp4, and there is a 256MB limit. Below that you have the option to upload a poster image. This acts as a cover image for an unplayed video. You can upload a png, gif, or jpg up to 256MB. Finally, we have a WYSIWYG modal caption field. This is in case you want to use the video in a carousel, and you wish to supply it with a caption.

For all asset types, click Save to save your asset into the Media Library.

If you want to remove an asset from the Media Library, you have two options. The first option would be to delete an individual asset by using the Operations menu, and clicking Delete. The second option would be to delete an individual asset or several assets ticking the box to the left of the thumbnail(s) you want to delete, and then selecting Delete Media from the action dropdown menu, and then clicking Apply to Selected Items. 

As always, delete with care. If you delete an asset from the Media Library and that asset is used in a publication, it will create a broken link. Make sure that you only delete assets that are not in use.

Via a Block: Add Media ONLY

This is a quick way to upload media assets when you’re working on your page in Layout View.

To access the Media Library in a Block, click the yellow Add Media button in the Block’s configure window. (Click the pencil icon in the upper right corner of the block and click Configure to open the configure window.) This will open a new pop-up window.

Remember, this is for when you haven’t already uploaded your asset to the Media Library. If it’s already in there, search for the asset in the bank of assets you see displayed at the bottom of the pop-up window.

To upload directly into the Media Library from this Block, click Choose File under Add File at the top of the pop-up window. This will open your files on your computer. Or you can drag and drop the file directly onto the button.

You will have the same information fields to fill out as you would if uploading to the Media Library main page.

Note that in this case, the Name field will pre-populate with the file name. You can either keep that, or rename the asset.

Unlike in the direct Media Library method described above first, you can’t add a Modal Caption to an image here. If you upload an image directly in a Block and you find that you want to use a Modal, or need a caption for a Carousel, you will need to go to the Media Library, open that asset’s settings, and add a Modal Caption.