Media Embedding

Intro

By default, when links for videos and images or PDFs and audio are added to petition text or the petition updates section, we'll automatically attempt embed that content into the page. 

Images and Video

To embed content like videos and images, just drop the link to the content into the petition text, updates section, etc.

In general, we recommend using links that go directly to the piece of content,  e.g. the direct link to the image, not a link to the blog post that contains the image. For images, you usually can find the direct link by right clicking on the image and clicking to Copy Image URL or Open Image in New Tab.

Content also embeds successfully more often when the file format is included at the end of the URL. Often, these images will be hosted on websites like your organization's website, a WordPress site for a special campaign, etc. Usually, we'll be able to embed these images directly. 

If you decide to host the image or video  on a third-party site instead, we have some tips to make sure your image or video embeds correctly:

• Flickr: From the image page, click the Download this Photo link and choose View all sizes.
  From here, choose the size that you'd like to use – usually this will be at least a medium size image, but may be a different size if needed. Once the page has loaded with that size, right click the image and choose Copy image address. You then have two options:
  1. you can paste the newly-copied URL directly into your petition page. This will allow the image to embed, but the default size (240px wide) may be smaller than you intended.
  2. you can paste the newly-copied URL directly into your petition page, but update the file format at the end of the URL to png or gif. For example, https://live.staticflickr.com/802/40460779914_0f8e371f30_b.jpg would become https://live.staticflickr.com/802/40460779914_0f8e371f30_b.png. This updated URL will adhere to your chosen dimensions (within the limit of our petition page and your screensize).
  For most instances, option two is probably ideal. 
  
  
• Twitter: To embed an image from a tweet, go to the tweet and right click the image. Then click to Copy image address. You can then paste that URL (which often begins pbs.twimg.com) into the page. At this time, we don't support embedding a full tweet.
  
  
• Facebook: To embed an image shared on Facebook, go to the post and right click the image. Then click to Copy image address. You can then paste that URL (which often begins scontnet.[...].fbcdn.net) into the page. At this time, we don't support embedding a full Facebook post.
  
  
• Imgur: To embed an image on Imgur, go to the image, right click and choose the Copy image address option. You can then paste that URL (which often begins i.imgur.com) into the page. After pasting, append ?showEmbed=true to the end of the image URL. Please note: videos from Imgur will not embed.
  
  
• Giphy: To embed a gif, go to the gif on Giphy and copy the URL for the main Giphy page. You can also click to Share > Copy GIF Link. (These URLs will begin with giphy.com or media.giphy.com.) You can then paste that URL into the page.
• Youtube: To embed a video from Youtube, go to the video and copy the URL. You shouldn't use the embed URL, just the normal URL that appears in your address bar. Once you've copied the URL, paste into the page. 
  
  
• Vimeo: To embed a video from Vimeo, go to the video and copy the URL. Once you've copied the URL, paste into the page. 

PDFs and Audio

Other types of media, like PDFs and audio, will not embed automatically. However, if you want this media to be embedded into the petition page, you can force this behavior by appending ?showEmbed=true to the end of the URL. For example, https://www.scribd.com/document/355296510?showEmbed=true or https://open.spotify.com/playlist/37i9dQZF1DX8G0t7hKiZC2?showEmbed=true.

Some third-party providers for PDF and audio embeds include: Scribd (PDFs), docdroid (PDFs and slide decks), Spotify (audio), and Soundcloud (audio). For each of these providers, you'll just need to copy the URL of the item and then add the showEmbed parameter to the end of the URL.

Alternatively, if you don't want an image or video to embed, you can append ?showEmbed=false. This will display the link alone, not the associated media. You can see some examples of embedded media on our demo site.