Tagged: ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • January 5, 2021 at 3:27 pm #1270419
    JaimBateman

    Hello,

    I want to install, on some website, Able Player as a video/sound player (for accessibility reasons). I was able to create a fairly straightforward plugin to use Able player with a shortcode, but for some reason, it doen’t work with Youtube vidéos. If I change the theme – without changing anything else -, then YouTube videos work through Able Player without any problem. I cannot seem to find anything in the console that goes wrong, either.

    Would you have any idea what could cause this ? I’ve tried to activate/deactivate the Vimeo/Youtube option in the theme settings, but that didn’t change anything. I’ll include in private a link to the page where stuff is tested, and an account to access the back office (this is not a production site, so you can experiment at will).

    Thanks for your help,

    JM

    January 7, 2021 at 4:34 am #1270755
    Ismael

    Hey JaimBateman,

    Thank you for the inquiry.

    Does it work properly when you use the src attribute in the video tag instead of the data-youtube-id attribute? Same as you, we do not see any related errors in the browser console, aside from an error in the onMessageReceived function, but it is probably not the problem.

    Have you tried removing the other videos from the page?

    Related thread: https://kriesi.at/support/topic/enfold-or-slider-revolution-conflict-showing-vimeo-video-in-slider/#post-1191427

    Best regards,
    Ismael

    January 7, 2021 at 12:19 pm #1270843
    JaimBateman

    Hey Ismael,

    Thanks for your answer. I tried all of this, to no avail. The thing is, if you go and change the active theme to Twenty Twenty One, it works. It seems there is something the Enfold theme does when a YouTube iframe is to be displayed that TTO doesn’t do…

    I actually just spent some time (after typing the previous sentence) exploring things, and I found where the conflict comes from – but I don’t really understand why.
    I was looking at what js was loaded, and decided to try and deactivate the ones linked to videos (by renaming the folder/files) ; it turns out that the conflict comes from slideshow-video.js.
    After experimenting further, I found that if I comment out one line – line 611 -, able player works with YouTube videos (see on page). Line 611 is this one :
    window.onYouTubeIframeAPIReady = function(){ jQuery('body').trigger('av-youtube-iframe-api-loaded'); };

    The thing is, commenting that line out at every update would be very inconvenient. Would there be a way to make this change permanent (I use a child theme) ? And also, what exactly does that line “do”, and what else am I potentially messing with by commenting it out ? The idea is that I might want to use, maybe, elsewhere on the site, YouTUbe videos as a slideshow (layerslider) background, or a color section background… Would commenting that line out have an influence on that ?

    Cheers, and thanks for your help !

    January 8, 2021 at 4:58 pm #1271112
    Ismael

    Hi,

    Thank you for info.

    Glad to know that you have found the issue. The code above initializes the theme’s implementation of the YT.Player API, which is probably conflicting with the AblePlayer’s youtube player implementation. By commenting it out, any element using the Youtube player such as the video and slider elements will not work properly.

    Best regards,
    Ismael

    January 20, 2021 at 3:03 pm #1274069
    JaimBateman

    Hi Ismael,

    Thanks for your answer. I just have one final question : I have tried to make the change in slideshow-video.js update-proof by using my child theme to store the modified file, and added the proper function in function.php. But the changes made to slideshow-video.js do nto seem to be taken into account, and the loaded js file is still the original one, according to the console.

    Could you check and see if I did domething wrong ? Or is it impossible to replace a js file this way ? The admin access I gave you previoulsy still works.

    Thanks in advance !

    January 21, 2021 at 4:34 am #1274272
    Ismael

    Hi,

    To override that script file, you have to override the actual element (slideshow.php) first and edit the script path or URL in the extra_assets function so that the path in the wp_enqueue_script points to the modified file instead of the default one.

    function extra_assets()
		{
			//load css
			wp_enqueue_style( 'avia-module-slideshow', AviaBuilder::$path['pluginUrlRoot'] . 'avia-shortcodes/slideshow/slideshow.css', array( 'avia-layout' ), false );

				//load js
			wp_enqueue_script( 'avia-module-slideshow', AviaBuilder::$path['pluginUrlRoot'] . 'avia-shortcodes/slideshow/slideshow.js', array( 'avia-shortcodes' ), false, true );
			wp_enqueue_script( 'avia-module-slideshow-video', AviaBuilder::$path['pluginUrlRoot'] . 'avia-shortcodes/slideshow/slideshow-video.js', array( 'avia-shortcodes' ), false, true );
		}

    For more info on how to modify an existing element in the child or on how to create your own, please check the following documentation.

    // https://kriesi.at/documentation/enfold/intro-to-layout-builder/#add-elements-to-alb

    Best regards,
    Ismael

    January 21, 2021 at 10:39 am #1274314
    JaimBateman

    Excellent, thank you !
    I think we can close this thread now.
    Cheers !

    January 22, 2021 at 4:29 am #1274582
    Rikard

    Hi,

    Great, I’m glad that Ismael could help you out. I’ll go ahead and close this thread for now then, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Problem with YouTube and able Player’ is closed to new replies.