Embedding an Instagram Post in Your Chapter

By embedding posts directly, you can share relevant updates, images, or videos from Instagram seamlessly within your text, without having to link out.

Resources

To learn more about H5P in Pressbooks, review the following guide:

Issue

Instagram posts cannot be directly embedded into a Pressbooks chapter using standard methods. If you copy the embed code provided by Instagram and paste it into a Pressbooks chapter, the code will be stripped out, and the post will not display.

Solution

Instagram posts can be embedded directly into a Pressbooks chapter using the H5P iframe embedder option. Follow these steps to integrate an Instagram post seamlessly:

  1. In your Pressbooks dashboard, go to the H5P Content tab and click Add New.
  2. Select Iframe Embedder as the content type. If you have not used it before, you may need to search for it in the H5P content type library and click Get to install it.
  3. Copy the URL of the Instagram post you want to embed. Edit the URL by removing the user name and adding “/embed” to the end. For example:
    Original: https://www.instagram.com/ubclibrary/p/Cw3loO7uYL7/
    Modified: https://www.instagram.com/p/Cw3loO7uYL7/embed/
  4. Paste the modified Instagram URL into the Source URL field.
  5. Make sure Resize supported is selected
  6. Click Create to save your H5P
  7. To add your H5P to the chapter, place your cursor where you want the H5P to appear and click the Add H5P button (next to the Add Media button) and save your work.
  8. Preview the chapter to ensure the H5P is displaying correctly.

 

 

 

License

Icon for the Creative Commons Attribution 4.0 International License

Digging Deeper into Pressbooks Visual Design Copyright © 2023 by Erin Fields and Leila Malkin is licensed under a Creative Commons Attribution 4.0 International License, except where otherwise noted.

Share This Book