Integration

Note: Whenever you see "civsci-id-123456789", it must be replaced with your div identifier. Also, wherever we use a "000" value for a data-civicscience-widget attribute, that must be replaced with your poll unit target identifier, either a number or a UUID.

Basic

The basic poll unit integration code can be found in the InsightStore on the Target > Settings > Integration page for the target associated with your website. You must be a Civic Science Media Partner to access the poll unit integration code. The integration code is an HTML snippet that looks something like this:

<div id="civsci-id-123456789" data-civicscience-widget="000"></div>
<script type="text/javascript" async src="https://get.civicscience.com/jspoll/5/csw-polyfills.js"></script>

The code is placed in the HTML of your page wherever you'd like the poll unit to appear.

This basic integration method is used for most publisher sites. If the poll unit is being deployed in an iframe, the data-civicscience-article-url value must be used.

<div id="civsci-id-123456789" data-civicscience-widget="000" data-civicscience-article-url="https://url-to-article"></div>
<script type="text/javascript" async src="https://get.civicscience.com/jspoll/5/csw-polyfills.js"></script>

Replace url-to-article with the specific URL for the page in which the poll unit is deployed.

Note: data-civicscience-article-url should only be used when the poll unit integration code is being loaded from inside an <iframe>. If the poll unit is loaded inside an <iframe>, data-civicscience-article-url is required to identify the exact URL of the web page that is the parent of the containing <iframe>. If the poll unit is placed inside an <iframe> without having a unique data-civicscience-article-url set, certain features like sharing, pinning questions, and using recommended questions will not work.

If the article URL must be dynamically generated, place this script in the head of the page.

<script>
civicscience.widget({
  target: "000",
  container: "#civsci-id-123456789",
  articleUrl: window.location.href,
});
</script>

Remember, your target's identifier must replace the "000" above. The container value must be replaced with your div identifier.

Basic

Related Articles