skip to Main Content

When I prerender video.js player then it add a lot of <span>s in html like:

<span class="vjs-control-text">Video Player is loading.</span>
    </div><button class="vjs-big-play-button" type="button" title="Play Video" aria-disabled="false" style="display: block;">
    <span aria-hidden="true" class="vjs-icon-placeholder"></span>
    <span class="vjs-control-text" aria-live="polite">Play Video</span>

Some of that spans have content like “Video player is loading.” or “Play Video”.

My page is in other language than english and because of SEO (I don’t want google to see english content at the top of html document) I need to remove all that spans. I also don’t even display play/stop buttons so I don’t need it in html.

How to remove this spans?

2

Answers


  1. If you want to remove the spans you have to remove every span with the class

    vjs-control-text

    function removeElementsByClass(className){
        var elements = document.getElementsByClassName(className);
        while(elements.length > 0){
            elements[0].parentNode.removeChild(elements[0]);
        }
    }
    removeElementsByClass('vjs-control-text');
    
    Login or Signup to reply.
  2. Video.js comes with it’s own set of language files which you can find here. Documentation on using languages can be found here.

    If you want to remove them, even if you can use your local language with it, you can find more options for configuring the player here.

    I haven’t read over all of the options but there are a lot of them and the ability to remove the video controls is in there too.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search