# Open Graph tags Open Graph tags (OG tags) can be used to additional information about items. When a page visit event is sent, the data from the OG tags is included in the data of that event. You can use this information, for example, to add an item or category context when creating recommendation filters. The name of the property is defined in the `property` attribute, and the value in the `content` attribute. Example:

<!-- "product" is the mandatory og:type for use with dynamic products catalog -->
<meta property="og:type" content="product">

<!-- the mandatory unique product ID, the Stock Keeping Unit (SKU), must be the same as the one sent to the cart/basket -->
<meta property="product:retailer_part_no" content="112233">

<!-- a product's photo -->
<meta property="og:image" content="https://example.com/photo/product_image.jpg">

<meta property="og:title" content="product_name">
<meta property="og:site_name" content="Example Site">
<meta property="og:url" content="https://example.com/product_site.html">

<!-- multiple categories are allowed -->
<meta property="product:category" content="category1_name">
<meta property="product:category" content="category2_name">

<meta property="product:price:amount" content="1,000.00">
<meta property="product:sale_price:amount" content="800.00" />
<meta property="product:original_price:amount" content="1,000.00">

og:tags are included in the URL of the SDK request. If there are too many, the browser may not process the request. The following table presents the URL length limits for different browsers: | Browser | Maximum URL length | | --- | --- | | Google Chrome | 32779 | | Google Android | 8192 | | Firefox | >64k | | Apple Safari | >64k | | Microsoft Internet Explorer 11| 2047 | | Microsoft Edge 16 | 2047 |

You can add custom information that you want to keep in the catalog:

<meta property="product:customName1" content="customValue1">
<meta property="product:customName2" content="customValue1">
<meta property="product:customName3" content="customValue1">

Using the [inserts](/developers/inserts) mechanism, you can refer to a catalog and retrieve all information contained in it. You can find out more about og:tags on the [Open Graph](http://ogp.me/) website. ## Adding OG tags to a website The OG tags (and other metadata) can be added to the website: - with the [Synerise tracking code](/developers/web/installation-and-configuration#customizing-metadata). - as a static part of the site when you build it. - with your own scripts that modify the page source. The script must run before loading the Synerise SDK. ## OG tags in regular websites A `page.visit` event is sent automatically every time a page is opened/refreshed.

og:tags must be implemented in the structure of the HTML document in the head section of a product card. Tags must be placed at the very beginning of the page, so that they load before the Synerise SDK tracker loads.

## OG tags in single-page applications If your page is a single-page application, the SDK is initialized only once. This means that `page.visit` events must be sent on-demand by your implementation. The way the event must be sent depends on how you implement OG tags in the page: - [OG tags are injected into the source of the page and available for retrieval with JS.](#single-page-with-og-tags) - [OG tags are not available and must be explicitly included in the `page.visit` event.](#single-page-without-og-tags) ### Single-page with OG tags If you inject the OG tags into the source of the page, they will be read and sent to Synerise when you call the following method:

SR.event.pageVisit()

No additional parameters are needed. ### Single-page without OG tags If the OG tags are not included in the source of the page, you must send them as an additional `ogTags`attribute of the `page.visit` event. The attribute is a stringified JSON object. The following example sends five OG tags with the `page.visit` event.

SR.event.pageVisit({
    "ogTags": JSON.stringify({
        "og:type": "product",
        "product:retailer_part_no": "87247894536",
        "og:site_name": "shoeStore",
        "og:title": "Red Sneakers LUE42",
        "product:color": "Red"
    })
})

## OG tag catalog Tags from page.visit events are automatically saved to a catalog named `Snrs-produktu-ogTag`. You can use this catalog to: - Verify that data from a page.visit event was sent correctly to Synerise (if it wasn't, it's not in the catalog) - Use data from this catalog in inserts. In this case, remember that the data is only updated when the item page is opened - so if an item wasn't viewed for a long time, the data in the catalog may be out-of-date.