Recommender Tool
Uses new widget (GWCRT), with its own js file (ibrandiq-gwcrt.js) and css file (ibrandiq-gwcrt.css) contained within the widget url
Functionality is to display the widget on a click event with header in a modal popup.

Call structure: /it/Widgets/GWCRT/{UMN}/{VARIANTS}
Variants are passed if required by using a pipe delimiter |. Variants are optional.

To use
Include js file from widget in header - https://panasonic-italy.ibrandiq.com/js/ibrandiq-gwcrt.js
Include css file from widget in header - https://panasonic-italy.ibrandiq.com/css/ibrandiq-gwcrt.css
Call by - onclick="iBrandIQRT('{UMN}', '{LANGUAGE-COUNTRY}', '{VARIANTS}');

eg. With variants
onclick="iBrandIQRT('RP-HF100ME-K', 'it-it', 'RP-HF100ME-K|RP-HF100ME-W|RP-HF100ME-A|RP-HF100ME-P');"

eg. Without variants
onclick="iBrandIQRT('RP-HF100ME-K', 'it-it', '');"

Include overlay div in page for modal background.
eg.
div class="overlay w-100 h-100" style="background-color: black; position: fixed; left: 0px; opacity: 0.5; z-index: 9999; display: none;">
div id="loading-img" style="text-align: center; margin-top: 24%;">
img src="https://mein.panasonic.eu/img/loaders/loader5.gif">
div>
div>

iFrame resizer
The iFrame used to display the widget will need to resize automatically when using mobile devices. The widget is internally resized. To make sure the iFrame gets resized is to include the following:
1. iframeresizer.js file - Include this in the footer of your page where the iFrame will sit.
2. Add the following script below this line, where the id of your iframe matches the id in the script line:
iFrameResize({ log: true }, '#iframeId')

Examples:
1. No variants: Buy Now
2. With variants: Buy Now