Icecat LIVE is a (free) service that enables you to insert real-time product content from some 300 major brands or manufacturers into your website, with just a few lines of JavaScript in your HTML template. Icecat provides customers with the ability to insert product data into their websites. In this post, you will find a manual for granular calls of Open Icecat content. Other available interfaces are:
In order to access Open Icecat, you will need a username and password, provided by Icecat. If you don’t have these, please register online for Open Icecat. The Open Icecat catalog is free and contains millions of product data sheets.
Tip: During the registration you need to choose for the URL or Data (XML) version. If you want to make use of XML, make sure you choose the “Open Icecat Data” subscription. You can always change this afterwards, or create a second subscription for the URL (links to hosted data-sheets) download format.
If you need more product data coverage, you will need to upgrade to Full Icecat. You can make your request via our contact page.
Access to the product information of Full Icecat is protected. If you want to access Full Icecat product information, we will need to unblock your IP address. Fill in the IP-address(es) of your server(s) and office in the “Allowed IP addresses” field. If you don’t know your office IP addresses, visit What is my IP to find your (office) IP. For you server IP address, please ask your system operator or provider.
You can fill in several IP addresses, separated by a space.
Please, note that some brands have a restrictive syndication policy, in which they allow access to certain digital assets or other product data only to authorized resellers. In general, it is therefore good to request authorization from brands with which you have established formal relations via the Icecat website.
If you are searching for a way to connect your web shop and integrate Icecat product information, check the most popular Icecat Add-ons.
Icecat LIVE is a (free) service that enables you to insert real-time product content from some 300 major brands or manufacturers into your web site. With just a few lines of JavaScript in your HTML template.
In this manual, we provide a quick guide on how to easily embed product information into your website.
If you plan to integrate Icecat LIVE, we advise you first to integrate free Open Icecat Live and evaluate it for your purposes. And then, plan the next step by upgrading your interface to Full Icecat.
What is Icecat LIVE? Icecat LIVE is basically a JavaScript (JS) service, providing real-time inserts of product data into your websites. Icecat LIVE enables seamless insertion of a product data-sheet in individual content assets, without the need to use frames or iframes. The LIVE/HTML version is the easy integration where -in case of Full Icecat- all authorization and security is handled at the Icecat server side.
Type of content that will be available for granular call:
Type | Definition for call |
---|---|
Brand and Product name | title |
| essentialinfo |
Marketing text | marketingtext |
Manuals (PDF’s, leaflets, etc) | manuals |
Reasons to buy | reasonstobuy |
Reviews | reviews |
Specifications | featuregroups |
Image gallery | gallery |
Feature logos | featurelogos |
3d tours | tours3d |
Videos | videos |
Product Story | productstory |
Technically, the Icecat LIVE JS (JavaScript) interface calls product data in JSON (JavaScript Object Notation) format and transforms that into HTML. The JS makes it very easy for channel partners to embed the product information into their websites with just a few lines of code in an HTML template or app. The JS itself can also be adapted to fit the specific purposes of the Partner’s app.
Please, note that some Open Icecat brands, such as Philips, make certain rich media assets (e.g., video) only available for their Authorized Resellers. Please, contact us in case you see on the Icecat website more assets than that you can access through Icecat LIVE.
Below you may find the data flow diagram of Icecat LIVE JS integration:
Icecat LIVE refers to a program code written in JavaScript (JS) that is embedded in a web page and executed by the browser of your site visitor when a page is downloaded by the respective visitor, or in response to an event triggered by you as a Partner.
JS allows creating a bridge between a webshop and the Icecat catalog, which makes it possible to incorporate product information (descriptions, leaflets, multimedia objects) into merchant webshops. Moreover, Icecat LIVE uses Document Object Model (DOM), which allows updating content dynamically.
<html> <head> </head> <body> <div id="Container"></div> <script> window.addEventListener('liveload', function() { IcecatLive.getDatasheet('#Container', { Brand: 'Philips', PartCode: 'DS8900/10', UserName: 'openicecat-live' }, 'en') }); </script> <script src="https://live.icecat.biz/js/live-current-2.js"></script> </body> </html> |
Regular call of datasheet – GTIN<html> <head> </head> <body> <div id="Container"></div> <script> window.addEventListener('liveload', function() { IcecatLive.getDatasheet('#Container', { 'GTIN': '4002515758205', UserName: 'openicecat-live' }, 'en') }); </script> <script src="https://live.icecat.biz/js/live-current-2.js"></script> </body> </html> |
Regular call of datasheet – IcecatProductId<html> <head> </head> <body> <div id="Container"></div> <script> window.addEventListener('liveload', function() { IcecatLive.getDatasheet('#Container', { 'IcecatProductId': '18253015', UserName: 'openicecat-live' }, 'en') }); </script> <script src="https://live.icecat.biz/js/live-current-2.js"></script> </body> </html> |
Granular call of Title and Essential Info<html> <head> </head> <body> <div id="Container1"></div> <div id="Container2"></div> <script> window.addEventListener('liveload', function() { IcecatLive.getDatasheet( { 'title':'#Container1', 'essentialinfo': '#Container2' }, { Brand: 'Philips', PartCode: 'DS8900/10', UserName: 'openicecat-live' }, 'en') }); </script> <script src="https://live.icecat.biz/js/live-current-2.js"></script> </body> </html> |
Granular call of all info from datasheet in separate containers<html> <head> </head> <body> <div id="Container1"></div> <div id="Container2"></div> <div id="Container3"></div> <div id="Container4"></div> <div id="Container5"></div> <div id="Container6"></div> <div id="Container7"></div> <div id="Container8"></div> <div id="Container9"></div> <div id="Container10"></div> <div id="Container11"></div> <div id="Container12"></div> <script> window.addEventListener('liveload', function() { IcecatLive.getDatasheet( { 'title':'#Container1', 'essentialinfo':'#Container2', 'marketingtext':'#Container3', 'manuals':'#Container4', 'reasonstobuy':'#Container5', 'reviews':'#Container6', 'featuregroups':'#Container7', 'gallery':'#Container8', 'featurelogos':'#Container9', 'tours3d':'#Container10', 'videos':'#Container11', 'productstory':'#Container12' }, { Brand: 'Philips', PartCode: 'DS8900/10', UserName: 'openicecat-live' }, 'en') }); </script> <script src="https://live.icecat.biz/js/live-current-2.js"></script> </body> </html> |
Icecat also allows users to combine two types of requests in one call: MPN + Brand and GTIN. In this case, the system first checks MPN+Brand and if they do not match then we check content based on GTIN.
<div id="Container1"></div>
<script>
window.addEventListener('liveload', function() {
IcecatLive.getDatasheet(
{
'videos': '#Container1'
},
{
Brand: ‘brand',
PartCode: ‘MPN',
'GTIN': ‘EAN',
UserName: ‘username'
}, 'en')
});
</script>
<script src="https://live.icecat.biz/js/live-current-2.js"></script>
Value | Explanation |
UserName | Icecat User Name |
Brand | The brand name of the product |
PartCode | The brand’s part code or manufacturer part number, uniquely identifying the product in combination with brand name. Also called manufacturer part code. |
GTIN | The GTIN: EAN (European Article Number ), UPC (Universal Product Code) or JAN (Japan Article Number) |
IcecatProductId | Icecat’s Internal numerical product identifier. Only to be used by advanced users that (already) make use of the Icecat index files. |
The Icecat Live API supports multilingual calls to retrieve digital assets related to multiple locales.
In case a user wants to retrieve a specific container or the whole Icecat Live block for a product in one preferred language, but it’s not available, a user can apply a backup language. To implement this logic a user just needs to pass the list of language codes as an array. For example, [‘en’, ‘fr’] where UK English (en) is the preferred language and France French (fr) is the backup language. In this case, fr content will be retrieved if the en content is not available.
It is possible to add up to 5 languages to the array. Please, find more info and an example script in this article.
Icecat Live allows users to integrate videos into their product pages by creating a custom video play button that opens videos in a modal window. More information and examples of implementation can be found in this article.
Open Icecat Live is responsive by design and adapts to your own CSS. You can apply your own CSS for example in: www.user.com/home/mystyle.css
<html> <head> </head> <body> <div id= "Container" ></div> <script> window.addEventListener( 'liveload' , function() { IcecatLive.applyCustomCSS( 'www.user.com/home/mystyle.css' ; ) }) </script> </body> </html> |
<html> <head> </head> <body> <div id= "Container" ></div> <script> window.addEventListener( 'liveload' , function() { IcecatLive.applyDefaultCSS() }) </script> </body> </html> |
<html> <head> </head> <body> <div id= "Container1" ></div> <div id= "Container2" ></div> <div id= "Container3" ></div> <div id= "Container4" ></div> <div id= "Container5" ></div> <div id= "Container6" ></div> <div id= "Container7" ></div> <div id= "Container8" ></div> <div id= "Container9" ></div> <div id= "Container10" ></div> <div id= "Container11" ></div> <div id= "Container12" ></div> <script> window.addEventListener( 'liveload' , function() { IcecatLive.getDatasheet( { 'Title' : '#Container1' ; 'EssentialInfo' : '#Container2' ; 'MarketingText' : '#Container3' ; 'Manuals' : '#Container4' ; 'RTB' : '#Container5' ; 'Reviews' : '#Container6' ; 'Specifications' : '#Container7' ; 'ImageGallery' : '#Container8' ; 'FeatureLogos' : '#Container9' ; '3dTours' : '#Container10' ; 'Videos' : '#Container11'; }, { Brand: 'Philips' , PartCode: 'DS8900/10' , UserName: 'openicecat-live' }, 'en' ); IcecatLive.applyCustomCSS( 'www.user.com/home/mystyle.css' ; ) }); </script> </body> </html> |
Please, contact us in case of questions or comments via your Icecat account manager or via the website: https://www.icecat.biz/en/menu/contacts/index.html
Icecat is happy to announce its participation in the upcoming Distoy London 2024 edition. The…
Rood met Witte Stippen, a social media channel that plays, tests, reviews games, and creates…
The revenues of Icecat N.V. (ISIN: NL0012751226) have increased by 11% over the first three…
Specialty coffee company Wakuli has raised EUR 5.2 million in a Series A round. The…
During the March and April sprints, our primary emphasis was on advancing our ongoing project:…
In Icecat Release Notes 195, we're thrilled to introduce a range of enhancements designed to…
View Comments
Would it be possible to get the source code?
is it available on github, npm? Would like to contribute and try and reduce the dependencies.
1.1MB js isn't acceptable...
it also conflict with my own webpack dynamic import...
Thx Jimmy. I asked a colleague to look into it: to publish the Live JS on github as open source.
Anyway, if you want full code freedom, just use the Data interfaces (XML, JSON).
Hi, have you publish it yet?