Documentation

Create your account and start posting your micro-content

We are currently testing the service, you will soon find more documentation there. In the meantime we will happily answer your questions by mail.

ES6 usage example

A simple API, no SDK required

This basic example presents a Facebook share link to the user, when clicked a request is sent to popo.st and a good old Facebook share popup is opened.

<a onClick='share(event)'>Share your score on Facebook</a>
<script type="text/javascript">
function share(e){
  // API keys and Data you want to share
  var data = {
    // REQUIRED fields
    "projectId": "PROJECT_ID",
    "accessKey": "PROJECT_KEY",
    "url": "http://web.com/foo",           // URL people will be redirected to
    "title": "Title to share",
    // RECOMMENDED fields
    "description": "Description to share",
    "siteName": "Name of your website",
    "image": "https://web.com/img.jpg",    // Micro content image URL
    "imageWidth": 600,                     // Original width of the image
    "imageHeight": 600,                    // Original height of the image
    "locale": "en",                        // Content language code
    // OPTIONAL fields
    "pageId": "XXXXXX",                    // Your facebook page ID
    "appId": "YYYYYY"                      // Your facebook app ID
  };
  // Prepare popup, talk to popo.st, set popup location using result's url
  var popup = window.open("", "_blank");
  fetch("https://re.popo.st/item", {
    method: "POST",
    headers: { "content-type": "application/json" },
    body: JSON.stringify(data)
  }).then(res => res.json()).then(res => {
    popup.location.assign(res.facebook);
  }).catch(err => {
    console.log(err);
    popup.close();
  });
}
</script>

Use a custom share domain

Hiding popo.st to your users

If you don't specify a custom share domain, popo.st will use re.popo.st which will appear within Facebook. Obviously you'd prefer to display your own brand there!

Follow this steps to setup your own share domain:

1. Chose a sub domain dedicated to sharing

For instance, if your project's domain name is youbrand.com you may dedicate share.yourbrand.com to sharing.

2. Redirect this domain to re.popo.st

Go to your DNS provider website (Gandi, Go-daddy, etc.)

In your DNS records, add a CNAME entry which, in its text form, will read like this:

share 3600 IN CNAME re.popo.st.
  • share is the subdomain name you chose
  • 3600 is the time to live of this entry in DNS caches over the world
  • CNAME means that share.yourbrand.com is served at the following direction
  • re.popo.st is the target domain name.

3. Tell popo.st to share using this domain

Edit your project on popo.st and set your Share Domain to your fully qualified domain name, in this example: share.yourbrand.com.

FAQ

When a content is shared for the first time the image is not displayed, how do I fix that?

This is a limitation of the Facebook scraper. It has to load your image to discover its dimensions which happens in the background and too late. To fix this, simply specify the width and the height of your image when calling Popo.st.

The browser is blocking the share popup, how do I fix that?

You must open the popup during the onClick/onPress/on* event. Otherwise the browser will refuse to create your popup. When you have your popup, then call popo.st api and finally set the popup's location with the result of the API call.