how do i include a script in a tab ?

hayden

Posted: 9 years ago

#8893 Quote

Total Posts: 8

i have a few pages that display a tripadvisor rating/reviews box - it is displayed using a script from tripadvisor that is included on the product details page
- however, when i enable tabs, the review does not display - instead, only a link to tripadvisor is displayed (fyi, it is only the link that is displayed in admin product details page - the review box only appears on the storefront)so i think maybe there is a problem running scripts in the tabs. is there a solution for this ?

Deni

Posted: 9 years ago

#8898 Quote

Status: Moderator
Total Posts: 389

hayden wrote:

i have a few pages that display a tripadvisor rating/reviews box - it is displayed using a script from tripadvisor that is included on the product details page
- however, when i enable tabs, the review does not display - instead, only a link to tripadvisor is displayed (fyi, it is only the link that is displayed in admin product details page - the review box only appears on the storefront)so i think maybe there is a problem running scripts in the tabs. is there a solution for this ?

Hi,

The Quick Tabs can execute JS, if it is wrapper in CDATA. When you create a new tab, in the content editor, from its menu, click Tools > Source Code. Place this code for example and you will see that it works:

<p>JavaScript included in the Quick Tabs should be wrapper in CDATA!</p>
<p>
<script>// <![CDATA[
alert('JavaScript included in the Quick Tabs should be wrapper in CDATA!');
// ]]></script>
</p>

I hope this helped!

Best Regards,
Mladen Staykov
Nop-Templates.com

hayden

Posted: 9 years ago

#8902 Quote

Total Posts: 8

Hi Mladen - i'm afraid that didn't work for me - probably something to do with the fact that the script is linked to inside rather than between the script tags

- you can see an example of the script running here : http://www.peebles-theroyalburgh.info/castle-venlaw-hotel-peebles-tweed-valley
(tripadvisor reviews)
- i'll post the actual script in a separate post in a moment.

hayden

Posted: 9 years ago

#8903 Quote

Total Posts: 8

<div id="TA_selfserveprop593" class="TA_selfserveprop">
<ul id="LCh6CdusYLm" class="TA_links Vx69DKk4W03A">
<li id="nv9RQZu1aZRV" class="HYuMmMaP"><a href="http://www.tripadvisor.co.uk/Hotel_Review-g186508-d253582-Reviews-Castle_Venlaw_Hotel-Peebles_Scottish_Borders_Scotland.html

target="> Castle Venlaw Hotel and Restaurant</a> in Peebles</li>
</ul>
</div>
<script src="http://www.jscache.com/wejs?wtype=selfserveprop&uniq=593&locationId=253582&lang=en_UK&rating=true&nreviews=5&writereviewlink=true&popIdx=true&iswide=true"></script>

Deni

Posted: 9 years ago

#8928 Quote

Status: Moderator
Total Posts: 389

hayden wrote:

<div id="TA_selfserveprop593" class="TA_selfserveprop">
<ul id="LCh6CdusYLm" class="TA_links Vx69DKk4W03A">
<li id="nv9RQZu1aZRV" class="HYuMmMaP"><a href="http://www.tripadvisor.co.uk/Hotel_Review-g186508-d253582-Reviews-Castle_Venlaw_Hotel-Peebles_Scottish_Borders_Scotland.html

target="> Castle Venlaw Hotel and Restaurant</a> in Peebles</li>
</ul>
</div>
<script src="http://www.jscache.com/wejs?wtype=selfserveprop&uniq=593&locationId=253582&lang=en_UK&rating=true&nreviews=5&writereviewlink=true&popIdx=true&iswide=true"></script>

Hi,

In your case, you can create your script this way:

<p>
<script>// <![CDATA[
(function() {
    var script = document.createElement("script");
    script.src = "http://www.jscache.com/wejs?wtype=selfserveprop&amp;uniq=593&amp;locationId=253582&amp;lang=en_UK&amp;rating=true&amp;nreviews=5&amp;writereviewlink=true&amp;popIdx=true&amp;iswide=true";
    document.body.appendChild(script);
})();
// ]]></script>
</p>

Best Regards,
Mladen Staykov
Nop-Templates.com

hayden

Posted: 9 years ago

#9025 Quote

Total Posts: 8

hi, thanks, i'll try that out.

On a separate note, i wrote to you somewhere about responsive video resizing but i cant seem to find the post ??

anyway, i managed to achieve the desired results :

you can see it in operation here :
http://www.peebles-theroyalburgh.info/eric-bogle - i just used some stylr elements <!DOCTYPE html>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<html>
<head>

<style>

.embedded-video-block{margin:15px 0;}
.embedded-video{height:0;position:relative;padding-bottom:56.25%}
.embedded-video iframe{width:100%;height:100%;position:absolute;top:0;left:0}
video{width:100%!important;height:auto!important}

</style>
</head>
<body>

<div class="embedded-video-block embedded-video">

<iframe src="https://www.youtube.com/embed/Gt6AHA8niMQ" frameborder="0" allowfullscreen></iframe>

</div>

</body>
</html>

Deni

Posted: 9 years ago

#9033 Quote