Embed Video in Iframe dynamically via PHP?

[tradingbo]

Hi Support,

Love the plugin, and you guys have been fantastic! Have an interesting question that i’m hoping you can help me with and maybe be of use to other users.

We’ve had requests to embed video on our event posts and have managed to do this fine by adding youtube embed link to the event description.

However what we want to do is dynamically add video at full width ‘outside of the event description’ by using the Tribe Additional Fields functions.

I’ve been attempting something along the lines of adding an Iframe to the single-event.php loop and inserting PHP to call the content of an ‘additional video field URL’.

Such as:

<iframe width="560" height="315" src="

<?php $additional_fields = tribe_get_custom_fields(); ?>
 <?php echo $additional_fields['Video'];?>"

frameborder="0" allowfullscreen></iframe>

and on the back-end

Video: https://www.youtube.com/watch?v=NLCX9Q-ranM

The iframe is displaying however failing to load the URL from the additional field, instead showing an iframe of a 404.
I might be barking up completely the wrong tree here but as I understand it Iframes do accept PHP.

Is this at all possible? Understand would need to verify the iframe as it would be insecure but was hoping to make it as easy as possible for users to add video to the events via a simple additional field url with the embedded video looking full and impressive at full width beneath all the event info.

Look forward to hearing your thoughts,

Many Thanks,
Oli

[Jennifer]

Hi Oli,

Thanks for the kind words, and I’m glad to hear you’re liking the plugin so far!

This does sound like a neat idea…Try adding the following code and see if this works for you:

$url = tribe_get_event_meta();
$url = $url["_ecp_custom_4"][0];
<iframe width="560" height="315" src="<?php echo $url;?>" frameborder="0" allowfullscreen></iframe>

You can replace _ecp_custom_4 with your custom field ID, which you can find in the inspector on the Events > Settings > Additional Fields page (see screenshot).

Let me know how that works for you!

Thanks,

Jennifer

[tradingbo]

Hi Jennifer,

Thanks for the response! With the above the iframe still doesn’t seem to recognise the URL
as it’s src=”” or is displaying it improperly. The <iframe> is rendering in the markup but this time without any content( before It was a frame of the websites homepage).

I’ve attached a screenshot of how the markup looks with the above code on the backend and front end, seems like the iframe still isn’t recognising the additional field as a URL.

Have tried making multiple additional fields for this so pretty sure it’s not the ‘Video’ additional field we created.

[Jennifer]

Hi Michael,

Thanks for sending the screenshots! I think there are 2 issues:

1. You need to use the custom field ID, which should begin with “_ecp_custom” and then have a number at the end. This should be used instead of “Video”. You can find this by going under Events > Settings > Additional Fields, clicking the field, and then clicking inspect element (see screenshot).
2. Make sure you include the index: [0] like this: $url = $url[“_ecp_custom_4”][0];

Does that make sense? Let me know if it works for you with these changes!

Thanks,

Jennifer

[tradingbo]

Hi Jennifer,

Thanks that is definitely a step in the right direction! <Iframe> now recognises the src=”” as what is inputted in the “Video” field via <?php $url = $url["_ecp_custom_10"][0];?> However still not displaying properly?

Doesn’t seem to be a CSS or markup issue within the theme so bit baffled by why it’s not displaying.

Here’s how the markup on the front end looks with the edits you suggested:

[Jennifer]

Hi Michael!

I did some testing on my end, and I believe the problem is that the YouTube URL actually needs to be formatted this way to work in an iframe: <iframe src=”https://youtube.com/embed/NLCX9Q-ranM”></iframe&gt; (see this article from w3schools.com for more info).

You can get this URL from the video on YouTube (see screenshot).

So if you add the “embed” format vs the “watch” format in your custom field, hopefully that should get this working for you! Let me know how it goes.

Jennifer

[tradingbo]

* Faceslap* Jennifer thank you, works perfectly now!

Totally missed the obvious there, thanks again for the support, page is looking great now!

[Jennifer]

Glad to hear it Michael! Don’t worry, I’ve made that mistake myself with iframes.

I’ll close out this thread, but please feel free to open up a new one if you have any other questions!

Thanks,

Jennifer

[Author]

Posts