Memo Implementation Guide

About Memo

Memo enables publishers to further monetize their content by selling performance data to PR and Communications teams. This document covers the information needed for implementing Memo’s measurement code on your site(s).

Our Memo.js JavaScript collects data in a similar way to any other JavaScript-based measurement code: you’ll place and customize the code on your site(s), and upon page load data is sent back to our system.

Your Memo contact will work with you to help make the implementation process as smooth as possible.

Memo.js Code

__memo_config = {
  pid: '000000000000000000000000',
  ...
  // other parameters will go here
  ...
};
(function(){
  var s = document.createElement('script');
  s.async = true;
  s.type = 'text/javascript';
  s.src = document.location.protocol + '//cdn.memo.co/js/memo.js'
  (document.getElementsByTagName('head')[0] ||
   document.getElementsByTagName('body') [0]).appendChild(s);
})();

Add this code to your site(s) and replace the PID with the value provided by Memo. Make sure to add to all desktop and mobile templates.

Required Parameters

pid

The PID (Publisher ID) is the Memo-assigned ID for your account and should have been provided by Memo via email. It is a 24-character alphanumeric string that looks similar to ‘4fc608fea782f333ea0000fb’. The string of 24 0’s can be used for testing until you are ready to go live.

If you don’t have a PID, reach out to your contact at Memo or info@memo.co and we will provide you with one.If you have multiple distinct sites on one domain, multiple domains, or want to treat different parts of a site like different accounts, your Memo contact may suggest using a different PID for each site/domain.

date

Memo.js will attempt to determine the published date of each page it is on based on various common practices. If any of these elements in any of the below formats is present in the DOM, or if there is a yyyy-mm-dd string in the URL, then Memo.js will interpret that as the published date of the page it is on:

<meta property="article:sr_published_at" content="2022-01-06 00:02:11 UTC" />
<meta name="pubdate" content="2022-01-03T12:28:54Z">
<meta property="pubdate" content="2022-01-03T12:28:54Z">
<meta property="article:published_at" content="2022-01-05">
<meta property="article:published_time" content=“2022/01/04">
<meta property="og:pubdate" content="20220102">
<time datetime="2022-10-04T00:48:56.000Z" itemprop="datePublished">
<meta name="date" content="2022-01-01" />

If none of these are present, or if you wish to override with a different date, you may pass a date to us directly:

__memo_config = {
  pid: '000000000000000000000000',
  ...
  date: '2022-01-01 12:00:00',
  ...
};

If used, this field should contain the published date of the content in UTC or any ISO8601 date. It must be javascript parsable, passed in as a string, a static value, and after the year 1900. We recommend “YYYY-MM-DD” and we recommend avoiding epoch time formats.

Changing the published date of an article will change the display date in the Memo interface, but will not change the availability of data outside that range.

Date is a required parameter, either derived from the DOM or passed into Memo config.

URL

This is the canonical URL of the page. Memo.js will assume one of the following is the canonical URL:

<link rel="canonical" href="http://blog.memo.co/" />
<meta property=“og:url" content=“http://blog.memo.co/" />
<meta property=“twitter:url" content=“http://blog.memo.co/" />

We use this field to identify and aggregate data for unique pieces of content for sale in the Memo marketplace, so it is essential that the URL in the ‘url’ field for a given content item always be exactly the same, regardless of any query parameters appended to the URL or device the user is using: http vs https, trailing slashes, casing, query string parameters, and hashes in the canonical URL should all remain consistent.

If these fields are not present in your DOM or are not consistent with the way you would expect to aggregate metrics, then you can pass a URL to Memo.js directly:

__memo_config = {
  pid: '000000000000000000000000',
  ...
  url: 'http://blog.memo.co/is-your-content-missing-its-readers/',
  ...
};

URL is a required parameter, either derived from the DOM or passed into Memo config.

Optional Parameters

author

The presence of an author in Memo search results makes content discovery more intuitive.

Like other fields, the author can be passed in via the DOM or overridden by adding to Memo config directly. Some DOM examples:

<meta property="article:sr_author" content="sr author 1">
<meta property="article:author" content="OG author 1">
<meta property="author" content="author" />
<meta name="author" content="author" />

If there is more than one author, we expect multiple tags of the same type. If none of these are available, authors can be passed into Memo config as an array:

__memo_config = {
  pid: '000000000000000000000000',
  ...
  authors: ['Jane Doe','John Smith'],
  ...
};

title

The presence of a title in Memo search results makes content discovery more intuitive.

Like other fields, the title can be passed in via the DOM or overridden by adding to Memo config directly. Some DOM examples:

<meta property="og:title" content="Is Your Content Missing Its Readers?" />
<meta name="twitter:title" content="Is Your Content Missing Its Readers?" />
<title>Is Your Content Missing Its Readers?</title>

If none of these are available, the title can be passed into Memo config as such:

__memo_config = {
  pid: '000000000000000000000000',
  ...
  title: 'Is Your Content Missing Its Readers?',
  ...
};

Testing Your Implementation

In order to test your implementation before you have a Production PID, you can set 24 0s (000000000000000000000000) as the PID. Memo will return an HTTP 200, but will not log anything to your account.

To view network calls to Memo, search for “memoinsights” in your browser’s developer tools on the network tab. You should see the following events on all pages where Memo.js is implemented:

Event Type	URL
Page View Event	n?	Fires once per page view. This event will show all of your pages metadata as we have interpreted it.
Engaged Time	t?	Fires once every 5 seconds your page when active in the browser

Consistency of URLs

If URL variants change the canonical URL reported back to Memo this will dilute your data across variants (and on social media). Spot check the following to make sure your canonical URL does not change:

Adding a querystring or anchor (hashtag) to the end of the URL
Adding or removing a trailing slash
Changing between http and https

Page Types

Make sure Memo.js is only added on pages that should be tracked. You should not include Memo.js on any of the following:

Preview pages from your CMS
eCommerce pages or other non-content pages
Your home page, section pages, author pages, or other category pages
Search results pages
Error pages

Implementation Best Practices

These guidelines will help ensure the implementation is successful, minimize back and forth, and get your data into the Memo marketplace faster.

Multiple Implementations

If you have multiple implementations—for example, a mobile app implementation and a standard implementation on your website, a mobile site, Google AMP, and/or Facebook Instant Articles—then the canonical URLs for these must all be identical or they will be treated as distinct content items and dilute your data. Additionally if Memo is not implemented on any of these, that traffic will be under-reported.

If the metadata sent to us from different implementations is inconsistent, there may be inconsistent behavior reported on your content in the Memo marketplace as it changes title, author, or publication date. This can be confusing to users.

Code Placement

As with most analytics tags, in order to capture all the relevant information about a request, it is important to load the __memo_config JavaScript as early as possible.

We strongly recommend putting the Memo code inside the <HEAD> HTML tags or in close proximity to your other analytics providers (like Google Analytics or Omniture), and be sure to set iframe to true. The earlier you can load the Memo script, the better, as this will ensure the data is as accurate as possible for buyers.

Do not implement Memo code on your home pages, channel pages, search results pages, on error pages, or any other pages you do not want tracked and available for sale, as this will make this data available in the Memo marketplace. It is best to include our code only on pages containing content you intend to sell via Memo, such as article or gallery pages.

Implementing on Gallery Pages

In order to track galleries, slideshows, and other deep-linked content as a single unit, all pages should share a canonical URL. You may need to pass a custom URL back into memo when loading these pages.

Infinite Scroll / AJAX Implementations

If you are serving up a piece of content through AJAX instead of a new page load, and if memo.js has already been implemented on the current page, you need to create a new __memo_config object with new values for the URL and pass this to the MEMO.collect() method, which will need to be called manually for any subsequent page load.

var __memo_config_new = {
  pid: '000000000000000000000000',
  ajax: true
};
MEMO.collect(__memo_config_new);

You will additionally pass in a new field, ajax: true.

The same logic applies to the new memo config; the url, title, etc. can be scraped from the DOM or provided to the config directly, but any DOM changes will need to be made before the collect method is called. If changes to the URL and page metadata are not guaranteed to be completed before calling collect, then pass all of these fields in manually, for example:

var __memo_config_new = {
  pid: '000000000000000000000000',
  url: 'http://blog.memo.co/new-url/', 
  title: 'New Title',
  authors: ['New Author'],
  date: '2020-01-01 12:00:00',
  ajax: true
};
MEMO.collect(__memo_config_new);

In the event that the user navigates away from the tracked content (or even scrolls back up the page) to other content that should not be tracked without a new page load, you have to manually stop collecting on the last page that loaded or engaged time will continue to collect:

MEMO.stop();

Additional Implementation Types

Memo supports Google AMP, Facebook Instant Article, and Mobile app implementations. Below are guides for setting up Memo in each. It is extremely important when there are multiple implementations that identical variables (URL, published date, etc.) are passed to Memo as they are on your desktop website.

Google AMP Implementation

Pages using Google’s Accelerated Mobile Pages Project (AMP) can implement Memo’s code through an <amp-analytics> tag, as described below:

<amp-analytics type="memo">
  <script type="application/json">
  {
    "vars": {
    "url":"http://blog.memo.co/is-your-content-missing-its-readers/",
    "pid": "000000000000000000000000",
      "published_at": "2022-01-01 00:00:00"
    }
  }
  </script>
</amp-analytics>

Mobile App Implementation

To send performance data to Memo from a mobile app that is not loading content in a browser/web environment, you make an external HTTP request each time a content item is loaded:

http://elsa.memoinsights.com/t
  ?pid=000000000000000000000000
  &url=http%3A%2F%2Fwww.example.com%2Fmemo- examples
  &title=Test%20Title
  &date=2022-01-11
  &domain=domain.com
  &ref_url=${referrer}
  &page_url=http%3A%2F%2Fwww.example.com%2Fmemo-examples
  &authors=John%20Doe
  &v=mobile

In a mobile environment, we can not auto-derive any of these from values the DOM.

In order to measure the Engaged Time metric, the below request should be sent every 5 seconds the user is on the content. It should contain all of the same parameters as the page view request, except it should be made to:

http://elsa.memoinsights.com/t
  ?pid=000000000000000000000000
  &url=http%3A%2F%2Fwww.example.com%2Fmemo- examples
  &title=Test%20Title
  &date=2022-01-11
  &domain=domain.com
  &ref_url=${referrer}
  &page_url=http%3A%2F%2Fwww.example.com%2Fmemo-examples
  &authors=John%20Doe
  &v=mobile
  &t=5000
  &e=5000

Facebook Instant Implementation

Include the Memo code in an iframe tag within a figure class=”op-tracker” tag as in the example below. There is no need to include the url field, as Facebook populates this for you, however the ref_url field should be set to Facebook’s URL as in the example below so that we can properly attribute referral traffic from Facebook:

<figure class="op-tracker">
  <iframe>
    <script>
      __memo_config = {
        pid: '000000000000000000000000',
        ref_url: 'https://www.facebook.com/',
      };
      (function(){
        var s = document.createElement('script');
        s.async = true;
        s.type = 'text/javascript';
        s.src = document.location.protocol + '//cdn.memo.co/js/memo.js';
        (document.getElementsByTagName('head')[0] ||
         document.getElementsByTagName('body')[0]).appendChild(s);
      })();
    </script>
  </iframe>
</figure>

If you have any questions about the above instructions, please reach out to your contact at Memo or email info@memo.co – we’re happy to help!