An Iframe embeds items from other sources. Sites Pro only allows embeds from the following approved sources:

Approved sourceTips for finding the correct source URL

Accessibility Requirements*

Datawrapper

How to embed charts

 
Duke Maps
  1. Select the Share icon for a Duke map
  2. Under Link to this Location, click Copy Link
 

Google Maps

  1. Select the Share icon for a Google map
  2. Select Embed a map
  3. Copy the URL only (all characters between the quotation marks after src=)
 
IM Leagues

 

 
Knightlab Timeline  
Looker Studio (formerly Google Data Studio)

Embed a report

 
Microsoft Bookings

On the Booking Page tab, copy the Your Booking Page link 

You must add text that provides an alternative way for users to book an appointment. For instance, you can add a Content Box above the form, with the text, “To book an appointment, email us at youremail.duke.edu, call us at 1-111-1111, or use the form below.”
MyEmma

MyEmma Support site

You must add text that provides an alternative way for users to sign up. For instance, you can add a Content Box above the form, with the text, “To sign up email xyz@abc.edu or fill out the form below.”
Panopto
  1. Click the Share icon for your video
  2. Under "Who Can Access This Video," select the Copy Link button
 
Qualtrics
  1. Navigate to the Distributions tab for your Qualtrics form
  2. Copy the Anonymous Link
 
SmugMug

Share my photos

 
Tableau  

* These actions are required for these embeds to comply with Duke's accessibility guidelines.

Add an Iframe

(* = required field)

1. When editing a Page or Story, click Add Content Block and choose Iframe.

2. Enter Administrative Title [1] and Display Title [2].

Image
Screenshot of the fields for Administrative Title and Display Title.

3. Enter a URL* [3] and Link text* [4] for the iFrame. Be sure to use the URL link, not the <iframe> source code (see examples below).

  • Link text [5] is required for accessibility purposes. Write the Link text in a way that someone who cannot see would be able to understand what the iFrame is depicting.

4. Enter Width [13] and Height [14]. Note: The Width and Height have default values that can be overwritten if needed, though it may take longer than the usual 10-minute delay for these dimensions to update.

Image
Screenshot of the fields for width and height.