Youtube embed in wordpress - wordpress

I am trying to embed an interval of a youtube video on my wordpress.
I have managed to set the start and final point that i want.
The problem is when the video ends, I want to make an option to restart the video but from the starting point I´ve set, not from the begining of the video.
Any idea how to achieve it?

I think the youtube embed start parameter is what you're looking for. Check out the youtube developers page. Hope that helps!

Or use iframe api and catch ending of video and programmicaly start play video again.

Related

Youtube iframe looped video not working on first load

I'm embedding a video on my website from YouTube and I want it to loop. To do that I have to use the loop and playlist parameters. I do that and it generates a link like this: https://www.youtube.com/embed/MegurLP8PxI?playlist=MegurLP8PxI&autoplay=1&controls=0&rel=0&enablejsapi=1&start=312&loop=1&widgetid=55. So the loop parameter is set to 1 and the playlist is set to the video id MegurLP8PxI.
The issue is that when I initially load the video it shows the This video is unavailable error. Refreshing the page fixes that but that's not ideal. What makes it hard to understand what's wrong is that this only happens sometimes, seemingly at random. Happens with other videos too.
Another fix that I found is removing the playlist parameter from the url. However than the video will not loop, which I really need it to. Any help would be really appreciated.

Is it possible to start an embedded facebook video at a specific point on wordpress

Just at the title says, if I copy a link at a specific time, it gives m the time code t=###.
If I try to embed that video into wordpress, the video starts at the beginning.
Is there a way to start a facebook video at a specific time while embedded in Wordpress?
It seems the t= parameter works for facebook video url's too now: e.g.
https://www.facebook.com/watch/?v=265933184844091&t=49
This format rather than the &t= worked for me:
https://www.facebook.com/100003947034370/videos/1916436035164612/?t=1550
at least it works if you type or paste the url in your browser and I was able to send it via messenger, but if you try to post it on your timeline so that people can watch the video from the relevant point facebook in their infinite lack of wisdom replaces the time stamp with ?__tn__=R-R and the video plays from the beginning.

Embedding soundcloud link on featured image post to launch mp3 player on

So I've been searching the web and I can't find a good answer on how to have a featured image with a play button, once I click the play button it launches a mp3 player built on wordpress site and where i can change Or add. Much like this site -> indieshuffle.com.
Does anyone know how to do that or at least give me some material to start with even a theme would be amazing
Although its a very simple task, if you dont have enough knowledge of programming then it will be hard to achieve. And not many people will help you on stackoverflow without any existing code to show them.
Here's how i would have achieved it. First i would attach the featured image to the post (the default functionality). Then i would create a custom field to save the soundcloud id of the song. Then in your theme you should wrap the featured image with a div and have a play button on hover. Then use javascript/jquery to look for click events (ie. what should it do when someone clicks on the image). Then i would use the Soundcloud API and use the play function to play the desired song. Here is a code i got from the API docs.
<script src="http://connect.soundcloud.com/sdk.js"></script>
<script>
SC.initialize({
client_id: 'YOUR_CLIENT_ID'
});
// stream track id 293
SC.stream("/tracks/293", function(sound){
sound.play();
});
</script>
Just take it slow, start from the beginning and go through the points i mentioned, it would be much easier to help if you start somewhere and ask a specific question.
You might already be familiar with the embed code, but if you just want to show the song in your post you can use the embed code in your post. Something like this https://soundcloud.com/pages/embed. There are also some wordpress plugins for soundcloud that will automatically embed the code if you give it the id of the song.

How to track how much of a youtube video the user has watched?

I need to track how much of an embedded youtube video the user has watched on my site. I need it to fire a tag at 25%, 50%, 75% and 100% of the length of the video. It should work similarly as a scrolling page track.
The only access I have to the site is through Googletag manager, so any solution would have to be through there.
I´ve researched and aparently there are ways to do this using youtube api. I even tried this step-by-step guide: http://www.cardinalpath.com/youtube-video-tracking-with-gtm-and-ua-a-step-by-step-guide/ But it didn´t work.
I guess the problem is that the site uses fancybox the play the video. Here is a pick of the website´s code:
I have no idea where to start.
Please take a look at
Track YouTube Video Playback with jQuery and Google Analytics Events
https://developers.google.com/youtube/js_api_reference
You need to track the current playback time, get the total playing time and then convert it to percentages.
Use the chromeless player and use the youtube js api. See the Playback_status method. I agree with putting a timer. However, there are methods and callbacks available at the js api that I highly recommended for you to use.
You will probably have to use
onStateChange event
getDuration()
getCurrentTime()
and you probably need those inside the onStateChange wrapper or something better.
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("myytplayer");
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
}
function onytplayerStateChange(newState) {
alert(ytplayer.getDuration()+ytplayer.getCurrentTime());
}
At the player state change, you may fire your own methods inside.
It's not a working example, but I hope that you get my answer. The modal / popup boxes is not related in getting the data needed. You just need to use the chromeless player and the YT js api working in harmony with your jQuery plugins. There are some jQuery plugins that is an API wrapper for multiple video sharing technologies.
Bower and Google is your friend!
http://bower.io/search/?q=youtube
Another option worth looking into, if YouTube is not your only options, I'm pretty sure both Vimeo and Wistia have these capabilities built in and are very simple to embed
what you can do is when getting the you tube video request the length of the video. Then divide that number accordingly to 25%, 50%, 75% and 100%.
You can attempt this by setting a timer at the same time the video plays and then calling the tag at the different times which were calculated before hand.
Hope this helps!

Flex and Video Annotation

I have been investigating how to annotate video using Flex or AIR. Similar to how it is being done on YouTube. I am not getting much joy. Wondered if anybody might have any insight?
Thanks
--Matt
This could actually be simpler than you thought.
Here's what I would do:
Play the video
When you see a spot you want to add an annotation for click the annotation button or the video to stop it and add an annotation
When you click that button you grab the timecode from the video
Save the timecode and your annotation details in a database
The next time you play the video, you load the annotations and their timecodes from the database
Before the video start playing you add cuepoints to it using the CuePointManager class in Flex
Add an event listener to the video player that will listen for these cuepoints
When the cuepoint hits you can show your annotation at the correct time code etc
Hope this helps.
Serge-
Matt you can refer the Youtube AS3 API's at
http://code.google.com/apis/youtube/flash_api_reference.html
You can check some demo examples from the link above to get an understanding how you can start off. You can also do this with Javascript API's if you are interested.
We have used Youtube AS3 API for enriching videos for content companies and it was fairly straightforward to built it - check demo at onion.tv

Resources