Btukfyl

anyone know a way to embed a YouTube video in javascript?
or a way to run a shortcode on a page in javascript?
I need a way to pass a javascript variable into a youtube url and embed the video. The code I have so far is using a plugin that runs this code as a shortcode on a page. using a plugin called Shortcoder.

I've done a lot of research and usually don't make new posts, but I can't seem to find the answer to this basic question. How do I embed a youtube video (or run a shortcode) from javascript. one thing I found is this that shows embedding a video with flashplayer, but I would like to avoid flashplayer if possible, and need it to be in javascript so I can pass a variable. Here's the code I found on youtube that I'm using to get the variable.

<script text="text/javascript">

var getUrlParameter = function getUrlParameter(sParam) {

    var sPageURL = decodeURIComponent(window.location.search.substring(1)),

        sURLVariables = sPageURL.split('&'),

        sParameterName,

        i;

    for (i = 0; i < sURLVariables.length; i++) {

        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {

            return sParameterName[1] === undefined ? true : sParameterName[1];

        }

    }

};



var video = getUrlParameter('v');



if(video){

   console.log('v='+video);

   // embed video with url



}else {

   console.log('v=null');

   // embed youtube uploads playlist



}

I need a way to embed a youtube video, or run the shortcode for the youtube wordpress plugin, but need the video url to be effected by my website url.

example: www.example.com/video/?v=Y123 should display the youtube video www.youtube.com/watch?v=Y123, and www.example.com/video/?v=x456 should display the youtube video www.youtube.com/watch?v=x456

I'm basically creating a youtube page for my videos, but plan to add a live chat that subs watching from my website can use from anywhere on the site while watching. I could also, possibly sometime in the future, add auto-pause videos for tutorials.

does anyone know a way to embed a YouTube video in javascript or a way to run a shortcode on a page in javascript?

a shortcode is prefered because it would remove a few extra limits and make future implementation of javascript into wordpress much easier.

Edit: also, I'm a bit new to wordpress, although have some experience in
android studio.

videoId: The id after your video, ie, the video is of this is "1lD9G4D1p-Y" https://www.youtube.com/watch?v=1lD9G4D1p-Y

var tag = document.createElement('script');

tag.src = "https://www.youtube.com/player_api";

var firstScriptTag = document.getElementsByTagName('script')[0];

firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);



window.onYouTubePlayerAPIReady = function() {

        window.player = new YT.Player('elementId');

        window.player.cueVideoById({'videoId': 'yourVideoId',

          'suggestedQuality': 'medium'});

}

The difference between my code and their's is mine adds the script using JavaScript, theirs adds it using HTML and then JavaScript to run it.

Documentation
https://developers.google.com/youtube/iframe_api_reference

ok, I think I figured a way for it to work. Here is what my code looks like, if anyone else needs it:

<iframe name="videoURL" id="videoURL" width="560" height="315" src="https://www.youtube.com/embed/ymHNtBZxFKY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>



<script text="text/javascript">

var getUrlParameter = function getUrlParameter(sParam) {

    var sPageURL = decodeURIComponent(window.location.search.substring(1)),

        sURLVariables = sPageURL.split('&'),

        sParameterName,

        i;

    for (i = 0; i < sURLVariables.length; i++) {

        sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] === sParam) {

            return sParameterName[1] === undefined ? true : sParameterName[1];

        }

    }

};



var video = getUrlParameter('v');

var url;



if(video){

   console.log('v='+video);

   url = 'https://www.youtube.com/embed/'+video;

   // embed video with url



}else {

   console.log('v=null');

   // embed youtube uploads playlist

   url = 'https://www.youtube.com/embed?listType=playlist&list=UU7YyXO5sOuG4zmGlW7KDCNw'

}



  document.getElementById("videoURL").setAttribute("src", url);



</script>