Youtube embed display at one time start at beginning - wordpress

I am trying to embed a youtube video in my wordpress site and I would like to start it at the beginning but display it at another point for visuals, is this possible? I have looked online and in the youtube api with no luck..hoping Im missing it.
Thanks for any help.

You can always embed the visual and then allow the video to play with the click through from the beginning. You can get the visual to be a pretty high dpi as well so the quality remains in tact.

Youtube only generates a few snapshots (around 1-3 snap images), there is no specific way to get an image at X point of time. It will be either a few seconds from the start, the middle and 1 other spot.
If you need to get the other format of the thumbnails, perhaps this can help
Google Json String Query for Video

Related

YouTube iframe looping video unavailable on first load

I embed a video on a Blazor-powered static page. I want the video to loop. According to docs (https://developers.google.com/youtube/player_parameters#loop), I need to have both loop and playlist params. Easy enough.
So I generate URL like this: https://www.youtube-nocookie.com/embed/tFbVZCbLhOk?autoplay=1&loop=1&modestbranding=1&disablekb=1&playsinline=1&rel=0&fs=0&playlist=tFbVZCbLhOk&controls=1&origin=http://localhost:5134 - as you can see, loop is set to 1, and playlist is set to the same video itself tFbVZCbLhOk.
The problem I am having is that when the video is embedded (or the link is accessed directly - the issue occurs there as well), it errors with This video is unavailable. Refreshing the page fixes that, however it of course is less than perfect. I am not sure what causes this, as some videos appear to randomly work on first attempt - but it's inconsistent, cause the same video might fail other time.
Removing the playlist param fixes the issue, but then the video doesn't loop properly, which is even worse for my use case.
I am not sure if it's a regression on YouTube's side, as a month or two ago, I did not have that issue - I think so at least.
It also seems like it's not bound to the tab or anything like that - when I open video once, next time I open it on a separate tab, it works - almost like if YT took its sweet time to create playlist for the video, but that's just my guess
I tried your video sample (i.e. tFbVZCbLhOk) and with the following code (which I modified from this answer), and the looping of the video works fine:
https://www.youtube.com/embed/tFbVZCbLhOk?enablejsapi=1&loop=1&playlist=tFbVZCbLhOk&autoplay=1&rel=0&showinfo=0&color=white
Probably what you're describing is another YouTube undocumented change.
<iframe onload="this.src+='';this.onload='';"
This reload once the iframe and after that it stops. I hope it will help you.

WordPress website loading image which is not present in my website

My WordPress website takes a lot of time to load pages, a problem that many of us face. I used GT metrix to check my WordPress page and then checked my website waterfall.
One thing I saw taking more than half time of my page is an image which is not uploaded in my website.
check this image of gt metrix waterfall:
I checked it, and I found this is an image which I have not used in my entire webpage. Also I could not find where is this image used.
Same thing happens in different pages that has different images to it.
I deleted one image from my media but now when I check the GT metrix waterfall I get a 404 error code which means its still trying to load that image and I cannot find it.
This is a theme which I had purchased and its not a popular theme like divi or ocean and hence could not contact the support.
How to check where a particular image is used in my webpage using
the media library (can I do that?)
How to find out and remove this image? Or at least is there a way where I can delete the image from the library and hence my webpage should not look for this image wasting its time instead of getting a 404 code
Your problem is quite common indeed, for your specific case i can suggest by starting to search the image name in both code + DB, it MUST be somewhere.
If you cannot find it inside your stuff there's only one answer left: there's some JS third party script that is loading that for you, but in this case i seriously dubt it would be in the same domain as your site.
Using the media library there's not much you can understand, if you are VERY lucky it will have a message like "attached to" but that thing cover like 10% of the cases, most of the time the image ARE used but are not attached to anything like a post, so the media library won't tell you anything
I've had this happen before a few times, too. Isn't it frustrating!? If you could provide a URL, I (and others, I'm sure) would be happy to take a look and try to figure out what's going on. :)

Suggestion on CSS Image Sprite

I work on an application similar to Google event calendar.
Name of the application is My Team Event Calendar .
Developed this using jQuery Full calendar plugin.
In a calendar ,for each day ,i would display which teammember of mine is outofoffice(is an employee workfromhome/sick/vacation).
For each of this outofoffice status,i have an icon,displaying the purpose of it.
I have 72 around outofoffice statuses ,which would get icons source from database\
I have all 72 stauts with their associate image icon source in db as "images/pill.png"
Every time ,i get the information from server about a team .for each day i would get team member name,out of office status and image associated with the status.
Consider if my calendar is full for whole 31 days ,and for each day i would have about 10 employees. For each of this out of office status ,i would get a image (this means many http requests for image icons for out of office status).
Can you please suggest is it good to maintain css image sprite.But i have a disadvantage at any point of time a new leave type can be added with new image icon ,which imposes an immediate change in the image sprite.(maintaining/modifying an image sprite is not that easy)
If not image sprite can you please suggest what would be a better solution here
If I'm understanding your scenario correctly this would be an excellent place to use a sprite. A large set of small images is an ideal use case and using a single sprit will reduce HTTP traffic significantly. Sprites may seem like a little overhead initially but it's not bad once you get used to it and the performance is well worth the few extra minutes to compose the sprite.
Keep a PSD (or some other original source) for the sprite handy. When you need to make edits, add a new icon, etc. then update the PSD and export your new sprite PNG.
Another option to consider is icon fonts. You might look at something like Font Awesome, Bootstrap's Glyphicons or a tool like IcoMoon. Icon fonts have a lot of advantages, chiefly scalability and colorization. If you don't need that, though, sprites work just fine.

Youtube like timeline with sparks scrubbar

I would like to transform my current scrubbar into a youtube like timeline.
Like when you hover the scrubbar on a certain point in time a thumbnail is shown.
Also that point should have a different colour on the scrubbar.
Is this possible or do I need to use another component and how?
Any help will be greatly appreciated!
Google does some extra work when they add a video. They generate those thumbnails. And theirds them ahead of time. That is why you can see thumbnails of sections ov video that have not loaded yet. If you want to make one yourself, you need to generate thumnails of each video you would use. An ide would be to include the timecode into the file name. So for a flv called MyVideo, you would have thumbs for MyVideo001.jpg for one second, etc.

Apply a Filter to a Camera video stream publishing to Media Server

I am Trying to Apply some information Like text and An Image as an overlay to create a overlay effect as lice a security camera with time and date on the video along with a png based Logo.
I can record VIDEO Using Flex and FMS or any other Media Server. But I want to save a modified version of the stream being uploaded.
Use camTwist (mac) or webcammax (pc) as your video input...you can use that program to use the webcam and then add whatever over it (text, date). Use Flash Media Live Encoder and select camTwist as your video source. Stream and save your recordings using that FMLE.
Sorenson Squeeze is pretty awesome for this and is cross platform. Camtwist is cool but it's not really a 'pro' app, that makes me sound way snobbish. It's actually pretty fun and a good suggestion for a simple result but I haven't found anything better than Sorenson Squeeze for the features and control it gives you.

Resources