Kunena 6.3.7 Released

The Kunena team has announce the arrival of Kunena 6.3.7 [K 6.3.7] in stable which is now available for download as a native Joomla extension for J! 4.4.x/5.0.x/5.1.x/5.2.x. This version addresses most of the issues that were discovered in K 6.2 / K 6.3 and issues discovered during the last development stages of K 6.3
Note: Please go to the Kunena Dashboard after an upgrade so that the Kunena database tables are also updated.

Please note: The Kunena project team takes NO responsibility for maintaining nor supporting anything in this category.

Question Optimize Embedding YouTube

  • Trony
  • Trony's Avatar Topic Author
  • Offline
  • Junior Member
  • Music and Electronic Devices Designer.
More
8 years 3 weeks ago - 8 years 3 weeks ago #1 by Trony
I read this article and so I decided to integrate in Kunena 5.0.3

A Better Method for Embedding YouTube Videos on your Website

First, I putted in Template Css that Style and then I Modded bbcode.php

Code:
if ($uri->isSSL()) { $thumbImage = 'HERE URL KUNENA's DEFAULT LOGO FOR EXAMPLE'; ?> <script> /* Light YouTube Embeds by @labnol */ /* Web: http://labnol.org/?p=27941 */ document.addEventListener("DOMContentLoaded", function() { var div, n, v = document.getElementsByClassName("youtube-player"); for (n = 0; n < v.length; n++) { div = document.createElement("div"); div.setAttribute("data-id", v[n].dataset.id); div.innerHTML = labnolThumb(v[n].dataset.id); div.onclick = labnolIframe; v[n].appendChild(div); } }); function labnolThumb(id) { var thumb = '<img src="<?php echo $thumbImage ?>">', play = '<div class="play"></div>'; return thumb.replace("ID", id) + play; } function labnolIframe() { var iframe = document.createElement("iframe"); var embed = "https://www.youtube.com/embed/ID?version=3&enablejsapi=1&autohide=2&fs=1&rel=0&hd=1&autoplay=1"; iframe.setAttribute("src", embed.replace("ID", this.dataset.id)); iframe.setAttribute("frameborder", "0"); iframe.setAttribute("allowfullscreen", "1"); this.parentNode.replaceChild(iframe, this); } </script> <? return '<div class="youtube-player" data-id="'. urlencode($video) .'"></div>'; } else { $thumbImage = 'HERE URL KUNENA's DEFAULT LOGO FOR EXAMPLE'; ?> <script> /* Light YouTube Embeds by @labnol */ /* Web: http://labnol.org/?p=27941 */ document.addEventListener("DOMContentLoaded", function() { var div, n, v = document.getElementsByClassName("youtube-player"); for (n = 0; n < v.length; n++) { div = document.createElement("div"); div.setAttribute("data-id", v[n].dataset.id); div.innerHTML = labnolThumb(v[n].dataset.id); div.onclick = labnolIframe; v[n].appendChild(div); } }); function labnolThumb(id) { var thumb = '<img src="<?php echo $thumbImage ?>">', play = '<div class="play"></div>'; return thumb.replace("ID", id) + play; } function labnolIframe() { var iframe = document.createElement("iframe"); var embed = "https://www.youtube.com/embed/ID?version=3&enablejsapi=1&autohide=2&fs=1&rel=0&hd=1&autoplay=1"; iframe.setAttribute("src", embed.replace("ID", this.dataset.id)); iframe.setAttribute("frameborder", "0"); iframe.setAttribute("allowfullscreen", "1"); this.parentNode.replaceChild(iframe, this); } </script> <? return '<div class="youtube-player" data-id="'. urlencode($video) .'"></div>'; } } }


I've a Music Community and a My User Posted a Topic with 37 Youtube Videos and I must say that it's work Very Well. (6 seconds for to load the Page.)

Post of my User on my Website

What do you think ?!?

Music and Electronic Devices Designer. Drum and Bass Addict. Creative Mind as Lifestyle. Cat in past Life. Soccer, Ice Hockey and Snowboard Lover.

Last edit: 8 years 3 weeks ago by Trony.

Please Log in or Create an account to join the conversation.

Time to create page: 0.377 seconds