Implementation of JavaScript on Product Pages

[Valentin Reppel]

Dear all

 

I am running a wine shop and would like to add a 'Vivino Rating' for each wine (on the respective product page). I have followed the instructions (https://www.vivino.com/wine-news/how-to-display-vivino-ratings-on-your-website) and done the following:

 

1. I have created a file named vivino-widgets.js via Editor with the following content:

<script src="https://www.vivino.com/external/vivino-widgets.js" type="text/javascript" async></script>

 

I have then placed the js file into the current theme folder into the js subfolder.

 

2. I have copied the following HTML code in the detailed product description of the respective wine using the source code editor (link: http://shop.capewine.eu/rotwein/9-napier-winery-red-medallion-2011.html )

 

<div class="vivino-widget vivino-wine-card-widget" data-vivino-widget-type="wine" data-vivino-vintage-id="3436082" data-vivino-user-id="XXXXXXXX" data-vivino-widget-language="de" data-vivino-widget-layout="small"><a href="https://www.vivino.com/wineries/za-napier/wines/red-medallion-2011" target="_blank">Napier Red Medallion 2011 on Vivino</a></div>

 

If I go onto the product page now I just see an ordinary html link to the Vivino website.

 

Can anyone help? I guess the js file is in the wrong place?

 

Thanks and kind regards

 

Marcus

[Valentin Reppel]

Dear Enrique

 

thanks for the quick reply; any idea where I have to place the .js file that it works properly?

 

Kind regards

 

Marcus

[Valentin Reppel]

Dear Enrique

 

thanks; I have tried all options; still no success... I do still get the html link :-(((

[El Patron]

back office-->advanced parms-->performance

 

if smarty set to not check, then changes will not be seen

 

you can also 'clear cache' after changes to ensure code is actioned

[Valentin Reppel]

Dear all

 

thanks for the hints; I have tried all your suggestions (removed async attribute, cleared cache). Still not working. I have attached the source code of the respective product page. Perhaps I have done something wrong with the coding.

 

Or should the js code should go somewhere on the product page?

 

<p>Der Napier Red Medallion hat ein fruchtiges Bouquet mit tiefem dunklen Cassis- und Blaubeerduft. Ein reichhaltiger Wein mit einem langen Nachklang, der an dunkle Beeren und Zedernholz erinnert.</p>

<p>Cabernet Sauvignon (50%), Cabernet Franc (20%), Merlot (10%), Petit Verdot (10%) & Malbec (10%)</p>

<p>Das Weingut Napier liegt in einem malerischen Tal in der Nähe von Wellington in der Region Western Cape. Seinen Namen verdankt es Sir George Napier, Gouverneur am der Kap der Guten Hoffnung von 1837 bis 1843. Der jetzige Besitzer, Michael Loubser, kaufte den Hof im Jahr 1989 und modernisierte umfassend Kellerei und Einrichtungen. Unter den erfahrenen Händen von Winzer und Gutsverwalter Leon Bester, bemüht sich dieses kleine Weingut mit grosser Sorgfalt Premium-Weine von Weltrang zu produzieren.</p>

 

<div class="vivino-widget vivino-wine-card-widget"><a href="https://www.vivino.com/wineries/za-napier/wines/red-medallion-2011" target="_blank">Napier Red Medallion 2011 on Vivino</a></div>

[Valentin Reppel]

Dear Enrique

 

thanks for your reply. There is only the following entry in the header.tpl regarding 'google-site-verification': <meta name=''google-site-verification'' Content=''A LONG CODE'' />

 

I don't find any entried regarding the Google Tag Manager in the whole code...

 

UPDATE: this was activated in a Module - I have deactivated the Tag Manager now and hope that error is resolved now?

 

Kind regards

 

Marcus

Edited July 22, 2016 by Marcus Reppel (see edit history)

[Valentin Reppel]

Dear Enrique

 

thank you so much for all your help and Feedback; I really appreciate it! There is a Custom HTML Block Module available; do you think that can do the Job? Which module have you used in the screenshot?

 

Kind regards

 

Marcus

[Valentin Reppel]

Enrique

 

I will be the first one who buys it! I guess Vivino.com would be interested as well as so far they couldn't help me at all with the Setup either...

 

Please Keep me posted!

 

Kind regards and have a great Weekend!

 

Marcus

Edited July 22, 2016 by Marcus Reppel (see edit history)

[Valentin Reppel]

Hi Enrique

 

the process and widget coding can be found here: https://www.vivino.com/wine-news/how-to-display-vivino-ratings-on-your-website

 

I would prefer the small or medium widget size. The vintage-id's are unique as far as I know...

 

Kind regards

 

Marcus

[Vininorden]

I am very much interested to the topic and to a hypothetical future module to solve this. Meanwhile Enrique, do you think you could explain how you did it in the screenshot you sent?

 

EDIT:

I actually found out it works if you disable the HTML purifier in preferences > general and paste the fresh html code from vivino

Edited August 18, 2016 by Vininorden (see edit history)

[yquem]

Hi

Was there a solution to this issue?

[IaniMD]

Hi.

Has anyone a solution for this issues with displaying widgets for vivino for prestashop 1.7.6.8?

Thanks!

[Cape Wine Reppel]

no, unfortunately we don't get the Vivino Widgets running on our website either (PS Ver. 1.7.6.8.)

[IaniMD]

The solution proposed by Vininorden actually works. You need to disable the HTML purifier.