Manual: How to Embed Product Stories into Your Website?

Avatar for Eugene Ignatenko
By
Manual
Likethumbsup(6)Dislikesthumbsdown(0)

This Product Story manual provides a quick guide on easily embedding product information into your website via Icecat Live (JavaScript). The Product Story is a new type of enhanced content that combines various multimedia assets and follows a brand’s look and feel. The main advantage is that it helps partners to optimize product page conversion according to their commercial insights. Thus, it increases product sales as it adopts a trusted brand’s rich content messaging. Especially, when a consumer gets the messaging directly from reknown brands like LEGO, Huawei, and DELL, which already adopt Product Stories.

In short, All Open Icecat and Full Icecat users can use this new type of asset to enrich their product pages. See below the example of a LEGO Product Story.

LEGO enhanced content
Icecat Live integration example using Product Story, Marketing text, Reasons to buy, Video and Specification containers

To sum up, you want to consider integrating Product Story if you want to:

  • Above all, boost sales – Enhanced content is a proven tool to raise conversion rates.
  • Increase consumer engagement – Product Stories contain interactive elements like hotspots, carousels, videos, galleries, 360s.
  • Deliver brand-consistent content – your product pages will have a look & feel that follows the brand’s visual guidelines.
  • Use brand-approved message – convincing main selling points and advantages that define the unique market position of the product.
  • It is also easy to integrate – Product Story is integrated by adding just a few JavaScript code lines into the HTML template. In addition, it is 100% compatible with our classic XML/JSON integration and has a responsive design that adapts to visitor screen resolutions.
  • Most important, it is FREE and can be used immediately after registration.

Embedding Product Stories via Icecat Live into your website

In conclusion, you can integrate Product Story as one of the Icecat Live containers using the Icecat Live Granular Call method. This method delivers content to your web-page in real-time. Furthermore, it will only require a couple of lines of Javascript code in your HTML template.

You can request Product Story using three types of product identifiers:

  • Firstly, via Brand + Part code (SKU, MPN)
  • Secondly, via GTIN (EAN, UPC)
  • Thirdly, via the Icecat ID (the unique identifier of a product in Icecat DB)

See examples of all three Product Story request codes below:

1. Call for Product Story via Brand  + Part code:

<html>
    <head>
    </head>
<body>

<div id="container1"></div>

<script>
    window.addEventListener('liveload', function() {
        IcecatLive.getDatasheet(
            {
                'productstory':'#container1'
            }, 
            {
             Brand: 'DELL',
             PartCode: 'GHHXD',
            UserName: 'openicecat-live'
        }, 'en')               
    });
</script>
<script src="https://live.icecat.biz/js/live-current-2.js"></script>

</body>
</html>

2. GTIN:

<html>
    <head>
    </head>
<body>

<div id="container1"></div>

<script>
    window.addEventListener('liveload', function() {
        IcecatLive.getDatasheet(
            {
                'productstory':'#container1'
            }, 
            {
            GTIN: '5397184333648',
            UserName: 'openicecat-live'
        }, 'en')               
    });
</script>
<script src="https://live.icecat.biz/js/live-current-2.js"></script>

</body>
</html>

3. Icecat ID:

<html>
    <head>
    </head>
<body>

<div id="container1"></div>

<script>
    window.addEventListener('liveload', function() {
        IcecatLive.getDatasheet(
            {
                'productstory':'#container1'
            }, 
            {
            IcecatProductId: '76472360',
            UserName: 'openicecat-live'
        }, 'en')               
    });
</script>
<script src="https://live.icecat.biz/js/live-current-2.js"></script>

</body>
</html>

Description of the parameters:

ValueExplanation
UserNameIcecat User Name
BrandThe brand name of the product
PartCodeThe brand’s product code or manufacturer part number, uniquely identifying the product in combination with the brand name.
GTINThe GTIN: EAN (European Article Number ), UPC (Universal Product Code) or JAN (Japan Article Number)
IcecatProductIdIcecat’s Internal numerical product identifier. Only to be used by advanced users that (already) make use of the Icecat index files.

Please, contact us in case of questions or comments via your Icecat account manager or contact us via the website.

Leave a Reply

Your email address will not be published. Required fields are marked *

 November 3, 2019
 October 4, 2018

Manual for Icecat Live: Real-Time Product Data in Your App

Icecat Live is a (free) service that enables you to insert real-time produc...
 June 1, 2018
Manual for Icecat CSV Interface

Manual for Icecat CSV Interface

This document describes the manual for Icecat CSV interface (Comma-Separate...
 September 28, 2016

Manual for Open Icecat JSON Product Requests

JSON (JavaScript Object Notation) is an increasingly popular means of trans...
 September 17, 2018
icecat addons

Icecat Add-ons including Magento, PrestaShop, Oracle, SAP Hybris, Google Shopping. NEW: Shopify

Icecat has a huge list of integration partners, that make it easy for clien...
 August 1, 2020

Manual for Personalized Interface File and Catalog from Icecat

With Icecat, you can generate personalized or customized CSV or Excel files...
 December 4, 2020
WordPress editor guidelines Iceclog

Iceclog’s WordPress Editor Guidelines: Writing Compelling Posts

These Iceclog Editor Guidelines for WordPress are a quick guide fo...
 August 17, 2016