Integration in a nested iframe

The factory integration method is an alternative integration technique. It is handy for situations in which the poll unit must be presented in a nested iframe. It can also be used for standard placements.

First, include the script on the page to instantiate the poll.

<script type="text/javascript">
  window.onload = function () {
    window.civicscience.widget({
      target: "0",
      container: "#civsci-id-1233904299",
      articleUrl: "https://heraldbugle.com/",
      userId: "myUserId",
      referrerUrl: "https://url-to-referrer",
      forceDarkMode: false
    });
  }
</script>

The script must include the target attribute. Its container attribute must match the poll unit's div id (see below).

Then create a div with a unique id attribute. Place it on the page wherever you want the poll unit to appear.

<div id="outerwrapper">
  <div id="cspoll">
    <div id="cspoll-content">
      <div id="civsci-id-1233904299"></div>
      <script type="text/javascript" async src="https://get.civicscience.com/jspoll/5/csw-polyfills.js"></script>
    </div>
  </div>
</div>

Optional script parameters:

• userId: a unique identifier for your user within your platform, such as a unique media partner user ID.
• articleUrl: the current page URL. This is useful for scenarios such as a nested iframe, so that you can pass the current URL to CivicScience:

  articleUrl: window.location.href
  

• referrerUrl: useful for scenarios such as a nested iframe, so that you can pass a known referrer URL to CivicScience:

  referrerUrl: document.referrer

• forceDarkMode: forces the poll unit to use dark mode. The default value is false.