WordPress – How to extract the first video embed from post content and place it in different area?

4 Views

I am trying to build a wordpress theme which extracts the first embedded video out of the content of the post and features it on top of the page.

So for example, I am trying to go from this:

Read More
<div id="main-post-content">

   <div class="embedded-video">
      <iframe src="...">
   </div>
   <p>Post content</p>
   <p>Post content</p>

</div>

To this: 

<div id="big-featured-area">
   <div class="embedded-video">
      <iframe src="...">
   </div>
</div>

<div id="main-post-content">

   <p>Post content</p>
   <p>Post content</p>

</div>

So the important things I am trying to accomplish are:

1) Finding the first embedded video within the post content.

2) Placing that first video in the above featured area.

3) Filtering that first video out of the content (so that it doesn’t appear twice on the page).

So far I am simply using the get_post_custom() function to get the first embed code within the post and copy it into the featured area. I am having problems with number 3 though (filtering out the first video from the post content). I could just hide the first embedded video with CSS, but it doesn’t feel right to me. I feel like I need to filter the video out of the content completely. Am I right or wrong about this?

I have also had ideas about using the oembed filters in wordpress but I can’t seem to get my head round how to implement them.

Let me know what you think is the best way of doing this is.

Post Views: 4

Related posts