Infinite Scroll Page

Integrating Yieldmo Ads

Some mobile site layouts use designs that fetch new content on demand without causing a page to refresh. Since W3C standards do not allow repeating id attributes please follow the steps below for integration instructions.

In order to better support these infinite scroll environments, Yieldmo provides an additional data-id attribute to the placement <div> container. Publishers are responsible for populating this attribute with a unique string, which will bind newly added placements to the same pageview. It is the publisher's responsibility to abide by Yieldmo's guidelines as to what constitutes a pageview in an infinite scroll website. Here are some tips and requirements for generating the data-id value for Yieldmo's infinite scroll feature:

• The data-id attributes for all placements on the same "page", meaning a chunk of DOM that's lazy loaded on an infinite scroll web page, need to be the same
• The data-id attributes for the placements across different "pages" need to be unique
• Avoid using only timestamps (aka epoch values from the Date object) as the value
• It is suggested that you use an article ID along with a timestamp. This ensures that placements in the same article contain the same data-id attribute, but will also guarantee that the ID will be different if the article is cleared and re-rendered in the same hard page load.
• Publishers typically instantiate a data-id value, generate a code snippet with that data-id value, and add this aggregated snippet into a new, dynamically generated container
• Reusing a data-id value may result in no ads loading, think of it as a client-side generated pageview ID... you obviously don't want to create a duplicate pageviews that have already occurred
  • A data-id value is considered "re-used", if placements on 2 different "pages" have the same data-id attributes
• A "pageview" as it pertains to Yieldmo on infinite scroll layout is typically considered an article in a stream of loaded news content

Sample Placement Code

<div id="ym_123456789" class="ym ym_scroll" data-id="some_random_string1234"></div>
<script type="text/javascript">
  (function(e,t){if(t._ym===void 0){t._ym="";var m=e.createElement("script");m.type="text/javascript",m.async=!0,m.src="//static.yieldmo.com/ym.min.js",(e.getElementsByTagName("head")[0]||e.getElementsByTagName("body")[0]).appendChild(m)}else t._ym instanceof String||void 0===t._ym.chkPls||t._ym.chkPls()})(document,window);
</script>

• Example page

Notes

• The same data-id attribute may be used across different placements (containing different placement IDs of course) to unify them as the same pageview. The data-id attribute for the Yieldmo placement assists Yieldmo with tallying pageviews, and should be unique for each pageview that your site is generating. For instance, if you are inserting three placements per new content container loaded, all three placements must have the same data-id attribute in order to unify them as one view
• Unlike the plain vanilla implementation, this tag contains the class ym and ym_scroll. This is necessary for the infinite scroll feature to work properly
• The ID of the placement <div> container should still contain ym_ + your placement ID, and the data-id must be set to represent a pageview
• You may re-use placement IDs across different "pageviews" - the data-id attribute ensures that these DOM nodes end up having unique id attributes in compliance with W3C standards

Next Steps

After implementation, please sync up with your operations contact at Yieldmo so they may finalize the QA and launch process.