Having issue with the CoursePress Video player

I'm using Youtube videos inside CoursePress, but sometimes the video doesn't play or it plays once and then it stops.
I also noticed some error in the console regarding some missing files from the theme so I contacted theme support, but I still don't have their valuable feedback.
So I'm thinking if you guys can help me figure out what's going on. More details are in the ticket.

  • Predrag Dubajic

    Hi Lisa,

    Hope you're doing well.

    I was checking the mentioned video and the thing is that video does actually play when you click on the play button.
    When the page is loaded video player will pull "cover" image that goes over the video and that image should be removed when you click on the play button.
    However, due to the console errors on your site that doesn't happen, and even though the video is playing properly, you can't see it because that image is still shown above the video.
    This is the element that I'm referring to:

    And if I play the video and then remove that element from dev tools in Chrome I can see the video playing properly.

    Most likely the problem here is that there's a conflict with your theme and one of the plugins you have installed which breaks some of the scripts on your site, and when one script fails it usually stops others from working as well.
    That's why CoursePress can't use its script that's used to hide that image when the video is played.

    I would suggest trying to disable all the plugins on your site, except for CoursePress, and see if the video plays after that, or wait for devs to give you more information about what's causing the console errors on your site.

    There's a workaround we could apply here as a temporary fix, which will we hiding the cover image and current play button so that video itself is shown when page is loaded.
    You can do that by using this CSS code:

    .module-type-video .video_player .vjs-poster,
    .module-type-video .video_player .vjs-big-play-button {
        display: none;
    }

    WordPress offers Custom CSS field inside Appearance > Customizer but if your theme disables this and it doesn't have its own CSS field you may wish to use a child theme or a plugin like this one for this additional CSS. That way you're protected when you come to upgrade.

    Please note that this should be just a temporary workaround and I strongly suggest discussing this further with theme developers so they can check those console errors.

    Best regards,
    Predrag

    • Lisa

      Good morning. I am so thankful you have looked into this. I had already chatted with two separate wpmudev representatives and we already checked for a plugin conflict twice and that was not an issue.

      I have been in contact with the support from my theme and the following is the response I received.

      "The one that's trying to pull those files is the video player and not the theme. And it expects that those files are included in the theme, which isn't. Our theme doesn't have those files, and our theme only uses MediaElementJS as a video player which is part of Wordpress' core so it doesn't need extra files. Does your course plugin has it's own video player?"

      AND
      "I have logged in and I tested a youtube link and an embed link in a post video format. Everything is working fine. You can check out the private post here: http://itfitspt.ca/a-video-post-test/1

      It leads me to think that the 3rd party plugin CoursePress is causing this issue. I would highly suggest that you contact the creators of this plugin and ask for further help. They should be able to investigate more about the issue."

      I have entered the css and AWESOME, it works and I was able to do it! Yay me and thank you so much. I do use a child theme and there was a place with the options to enter the information.

      I am so happy it works!
      Thank you so much!
      Lisa

  • Predrag Dubajic

    Hi Lisa,

    I actually think that you should still do a conflict test because I believe that something is conflicting with your theme which causes the scripts to fail.
    I actually checked your theme on my end with CorusePress active and there the video works fine, so I'm thinking that something specific to your installation is causing this.

    The thing is that if one script on the page fails it will break the others as well.
    For example, let's say that page loads three scripts.
    Script1 - Loaded by plugin X
    Script2 - Loaded by plugin Y
    Script3 - Loaded by CoursePress and is used to hide the overlay image on video.

    Now, if Plugin X has some conflict with your theme then Script1 will fail to run on course page and it will also break Script2 and Script3.
    Since on my test installation I don't have Plugin X installed it works fine for me, and with conflict test we should be able to determine which plugin is the one that's causing the issue and we can debug it further from there.

    Best regards,
    Predrag

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.