To add images, files, or embedded video or audio to your page, select the media icon in the toolbar of the content area where it should appear, usually the Body area.
There are four tabs which you can use to view, select or upload images and documents (Word, PowerPoint, Excel and PDF), or add links to display videos from YouTube and Vimeo, individual tweets from Twitter and files from SoundCloud.
My Files: These are files that you have already uploaded yourself through the Upload tab.
All Files: These are all of the files that have been uploaded.
Web: This new web option makes it much easier to embed a video from YouTube or Vimeo, an individual tweet from Twitter, or a file from SoundCloud. Just grab the link to the individual file that you want to use and paste it in.
Note: The previous method of disabling rich text for the code view and pasting in the embed code will continue to work if preferred.
Upload: Instead of the inline-image and inline-file interfaces, users upload images, PDFs, or other documents here.
File name, type, collections, sort by and order are all ways to sort through existing files.
You can search for a specific file by name if you know exactly what you are looking for. Otherwise, use one of the dropdowns to sort through the files.
Type allows you to filter through all the files and return only a specific file type. You can filter by images, MS Office files or PDFs, SoundCloud files, posts from Twitter or video files. Note that although SoundCloud, Twitter, and video files are embedded media, this tool catalogs and tracks them like actual files with a thumbnail and file name.
Collections will not be fully populated right away as this could not be done prior to releasing the new tool. Collections will offer a quick way to find photos or videos of the campus and student life commissioned or produced by the College, as well as approved photos for the College's faculty and administration.
The Sort by dropdown allows you to filter by the date a file was uploaded or use count, which tells you how many times a particular file has been used on the site. You can sort those files in either ascending or descending order by using the Order dropdown.
Files, their types, and which pages they are on can be seen via My Workbench and selecting the File List tab.
In either the My files or All Files tabs, filter for images by sorting by Type and selecting Image. Select an image by clicking on the preview images or icons, then click Submit. Hovering the cursor over a thumbnail will bring up the full file name.
Select which size you would like from the dropdown menu labeled Current format is (this works the same way as the former inline image sizes). Then click Submit again.
Images entered into image-only fields, e.g. lede image, can be saved over directly from the node being edited. To save over a file, select Edit media and choose a new file to upload and save over the current image. The interface will continue to show the old image until the node is saved.
Once you have uploaded an image, you will see a Remove button. If you'd like to cancel the upload, select Remove, then Cancel.
Note: When selecting a lede image or inserting an image into a content field, the WYSIWYG editor shows a square crop of the image. After either saving the page as a draft or publishing the page, the photo is displayed properly according to size selected.
To place the image to the right or left on a page with text wrapping around it, click on the image to select it, use the Styles dropdown and select image-right or image-left. The Styles dropdown has some padding built into it that the Image Properties tool does not.
Filter for videos by sorting by Type and selecting Video. Select a video to insert by clicking on the preview image, then click Submit.
Note: When inserting a video, the WYSIWYG preview similarly displays properly once saved without requiring you to make any adjustments.
Videos will always take 100% of the width of the content area.
Filter for documents by sorting by Type and selecting MS Office, PDF, etc. Select a document to insert by clicking on the preview icons, then click Submit.
Go to the Upload tab to upload a new file.
[ To cancel an upload, once a file has been uploaded there is an option to Remove the file. Select Remove, then Cancel. ]
Selecting submit inserts the title of the document with a link to the document which is not editable. To use other text as a link to the uploaded file, after uploading the file:
- right-click and copy the link displayed in the upload window
- click Cancel
- select the desired text within the content area
- select the link tool, and use ctrl-v (cmd-v for macs) to paste the link into URL area.
In this case, you will have to add an icon yourself from the styles dropdown menu. Be sure that your cursor is within the linked text.
The media module allows you to embed media from YouTube, Vimeo, Flickr, SoundCloud and Twitter through the Web tab.
YouTube: go to the page of the video you want to embed, click share, copy the link and paste it into the web tab.
Vimeo: go to the page of the video you want to embed and copy the link.
Flickr: go to an individual picture that you want to embed, click share, copy the link and paste it into the web tab. Click save, then submit. You'll need to set the image size by right-clicking (command-click for mac) on the image and selecting Image Properties. Click the padlock icon to unlock the width and height, and set the width you want the image to be. The height will automatically adjust. Then click OK.
Twitter: Click on the individual tweet that you want to embed, then click the “Details” link. Copy the link from that page and paste it into the web tab.
Once you have the link to your chosen media file, click the media module icon, select the Web tab, and paste the URL in. Then click submit.
Occasionally this error may be encountered: Unable to handle the provided embed string or URL.
Simply edit the url to read 'http:' rather than 'https:'.
Media on other platforms
To embed media hosted by other services like Issuu or Google:
- Copy the embed code (method depends on service)
- In the code view for the field where the item should appear – click "Disable rich-text" below the box – find the desired location and paste the code.
- Publish and save
The list of files uploaded to the site can be found under "Find Content". Please be careful to not delete someone else's file. Using a good naming convention will help prevent any confusion.