Digital Asset Management for all your ProcessWire media

Adding Media to Media Manager Fields


@note: This topic is Work in Progress. It will (soon) be updated with both text and graphical illustrations

In the previous lesson, we looked at how to create and set up Media Manager fields for adding media to your ProcessWire pages. You may want to go over that topic first before jumping into this one.

Now that you've created a Media Manager field and added it to your desired template(s), it's time to add some media from your Media Library to pages you attached the Media Manager field to. Picking up from the previous lesson, in this topic we use the example of a Media Manager field called media.

Adding media to a page

In your ProcessWire admin, open a page with the field media for editing. Looking at the field media on the page, you will see a link to Add Media to the page. This is the default label for this link. Clicking on that link will open up a modal to display your Media Library but don't do that just yet. We'll come to that shortly. As pointed out in the previous lesson, the label is customisable. You may have changed yours to something else to suit your needs. Since you've only recently created the field media, there will obviously be media in it yet. Instead, you will see the text nothing added yet, signifying that the field is empty of media. Next to the Add Media link you will see names of allowed media types for this Media Manager field. These reflect the settings you have in the Details Tab of the field media. If you set a limit specifying the maximum number of media allowed for the field, you will also see some text telling you how many media you've already added against the set total. OK, let's add some media to this page!

Click on the Add Media link to open your Media Library. You should be already familiar with your Media Library since we covered that in an earlier lesson. Note that you can browse and even upload new media to your Media Library from within this modal.

Select a couple of media to add to the current page. If you need to, search your Media Library to locate the media you are interested in. Click on the button labelled Insert Media. That's all there is to it! The selected media will be inserted and saved into the field media in the current page. Media Manager will display a message to tell you whether the action was successful or not.

Understanding Media Manager insert media notices

Each time you add media to a page using the Insert Media button, Media Manager will display a message right above the modal window to let you know if the insert action was successful or if an error was encountered. A message with a green background signifies success. One with a red background means something went wrong. In either case, the message displayed will aptly describe what has just transpired. Success messages will tell you how many media were added to the current page. Error messages will tell you the reason for the failure. Triggers for error messages include attempting to insert an unpublished media to a page or trying to insert disallowed media types.

Please note that in some situations, both success and errors might occur. For instance, you may have selected a couple of media some of which are not published. In such a case, you will be shown a success message but with an error message within square ([some error message]) brackets.

Adding image media variations to the page

If you have image media variations you can also add them to the page being edited. First, select and image media to load it into the preview/edit pane on the right. If the image has variations, these will be loaded at the bottom of the preview/edit pane. Select the variations you are interested in and click on the button Insert Media.

Exiting the Media Library

Since you may wish to add several media spanning several pages in your Media Library, the modal will not automatically close once you've added media to the page being edited. Instead, you'll need to do this manually. To exit the modal, click on the X at the top right corner of the modal. The window underneath (the one with the page you've been adding media to) will automatically reload. You will not need to save or reload the page once you close the modal. Once the page has reloaded you will see the thumbs/icons of the media that you added to the page.

To add more media to your field, just repeat the process outlined above. Please note that if the media field has a limit set on the maximum number of media allowed for the field and that limit has been reached, you will not see the Add Media link that opens your Media Library. Instead, you will see some text letting you know the limit had been reached.

Changing media views on the edit page

Remember that media inserted in a page can be viewed within that page in either a grid (less details) or list (with extra media details) format. Click on the respective icons to select the view you want. You do not need to save the page for the setting to stick. You last choice is remembered across login sessions.

Previewing inserted image media

to do

Sorting media on the edit page

to do

Removing media from the media field

to do