Learn how to set up items.
An item is a unique thing which users are viewing, such as an article, a blog entry or a product. When you place an Attach embed on your website, you must associate it with this thing. You typically use a permanent URL for associating an item.
To set up an item, add the desired Attach embeds like
reactions to your web page and assign them an item. When your web page is displayed to a visitor, we will show them who else is viewing the item and let visitors interact.
There is no limit on how many visitors can view an item at any given time, but once there are a few hundred users speaking the same language, we will begin segmenting visitors by languge.
The recommended way for specifying an item is to set the
data-property- in the
div element of the document's
body, together with the embed. This method is worry-free as it works for all kinds of pages and embeds.
<div class="attach-reactions" data-property-item="https://example.com"></div>
Only if you have a very simple page or your production framework imposes limitations, you may set the item as
meta tag in your document's
head or use a fragment identifier behind the script call. Only works for a single embed per page.
Notice how the
attach: prefix can be dropped whenever the html element is already scoped to the Attach embeds.
<meta property="attach:item:url" content="https://example.com">
<script src="https://embeds.attach.live/v1#item=https://www.attach.live/" defer></script>
If you omit the item, we'll use the URL in the address bar of your browser with some optimization to determine if two URLs point to the same item. For example, we disregard the protocol and the trailing slash, view domains with and without
www as same, follow redirects, make the domain part lowercase, alpha-sort query parameters, and cut-off fragment identifiers. Plus we have further optimizations for some well-known domains. But due to the many variations which the same URL may take, we recommend you always explicitly specify the item URL. For example, the Pen at https://codepen.io/attach/pen/WYNzKE may also be viewed at https://codepen.io/attach/full/WYNzKE, or there may be query params present or not.