YouTube Embed With Start Time in ExpressionEngine

One of the ExpressionEngine projects I was working on needed an easy way to embed YouTube videos, and wanted a way to start the video at a specific time. The customer wanted it to be simple and didn’t want to fiddle about with code.

I built the template so the customer only needed to give me two pieces of information: Video URL (not embed code) and Video Start Time (in seconds, if not 0:00).

The link URL and the Embed URL aren’t quite the same, but they’re pretty close. Look at the difference:

Link URL: http://www.youtube.com/watch?v=HaQvBbzslJE Embed URL: http://www.youtube.com/v/HaQvBbzslJE&hl=en_US&fs=1&

Using the plugin Low Replace, we can parse through the Link URL to change watch?v= to v/. If there is a start time, then you can append it on the URL with start=####. Remember, the start time must be in seconds when embedding a video.

Below is the ExpressionEngine template code:

1
2
3
{if blog_video}
<object width="630" height="379" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="{exp:low_replace find=" /><param name="v" value="" /><param name="blog_video" value="" /><param name="exp:low_replace" value="" /><param name="038" value="" /><param name="hl" value="en_US&amp;fs=1&amp;{if" /><param name="blog_video_starttime" value="" /><param name="start" value="{blog_video_starttime}{/if}&quot;" /><param name="allowfullscreen" value="true" /><embed width="630" height="379" type="application/x-shockwave-flash" src="{exp:low_replace find=" allowFullScreen="true" allowscriptaccess="always" v="" blog_video="" exp:low_replace="" 038="" hl="en_US&amp;fs=1&amp;{if" blog_video_starttime="" start="{blog_video_starttime}{/if}&quot;" allowfullscreen="true" /></object>
{/if}

Yay for happy customers.