Link copied to clipboard!
Mobile navigation button - closed state

Support iframes in annotation screenshots

Some iframes work out-of-the-box, others need a bit of attention


When you create an annotation, Cord takes a screenshot of the document and stores it alongside the annotation.

If the document contains iframes, things can get interesting:

  • if the iframe src is from the same origin as the document, then Cord will correctly capture the contents of that iframe in the screenshot, with no special tweaks needed from the developer
  • if the iframe src is from a different origin than the document, and the developer can change the HTML inside the iframe, then a script tag must be added to the HTML of the iframe document
<!-- this script allows the Cord SDK to communicate with this iframe when taking screenshots -->
<script src="https://app.cord.com/sdk/v1/iframe.js"></script>
  • if the iframe src is from a different origin than the document, and the iframe content is outside the control of the developer, then the area of the iframe will be replaced with a “Content not available” placeholder in the screenshot

Learn more