I have an oembed field for a video attached to a custom post type. I would like to, on the front end, display a “load video” button that would then trigger getting and displaying the video field. Anyone done this before?
Thanks!
I expect something like this would do the trick:
<button class="load-video-button" data-video-embed="<?php echo htmlspecialchars(get_field('oembed_video_url')) ?>">Load Video</button>
<div class="video-container"></div>
<script>
$(function() {
$('.load-video-button').click(function() {
$('.video-container').html($(this).data('video-embed'));
});
});
</script>
(I assume you’re using jQuery here.)
oohh interesting approach, I like that!
Thank you much, will give it a try shortly.
Well kinda! lol It does work to load the video, but seems to strip out the Oembed part, so it throws in a tiny iframe in the div… hmm
Edit: nevermind, I need to alter how fitvids is addressing it, thank you for the help!
I’m not sure what you mean—the oEmbed field stores the URL but when you echo it, it returns the appropriate embed code. Do you want to show just the video URL?
Thanks again, you solution was good, I just had to tweak script so fitvids would recognize and fire,
jQuery(function( $ ) {
$('.load-video-button').click(function() {
$('.embed-container').addClass('loaded-video').html($(this).data('video-embed'));
$( '.loaded-video' ).fitVids();
});
});
Great! Glad to be of service!
