Tuesday, October 27, 2009

YouTube Mini Audio Player

If you read my personal blog (which a lot of you probably don’t even know
exists) you’ll commonly see music embedded as mini-YouTube embeds.  It turns out, the magic height
is 25 pixels, and the magic width (for play/pause and mute) is 62 pixels.

style="padding-bottom: 0px; margin: 0px auto; padding-left: 0px; width: 62px; padding-right: 0px; display:
block; float: none; padding-top: 0px"
id="scid:5737277B-5D6D-4f48-ABFC-DD9C333F4C5D:483cec9e-036b-43a9-b49a-eb9506b37975"
class="wlWriterEditableSmartContent">
name="movie" value="http://www.youtube-nocookie.com/v/4pXfHLUlZf4&hl=en&fs=1&rel=0"> name="allowFullScreen" value="true"> src="http://www.youtube-nocookie.com/v/4pXfHLUlZf4&hl=en&fs=1&rel=0"
type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="62"
height="25">[audio on youtube]

However, it is kind of a burden to do this every time you want to embed a mini player (you have to
edit at four fields in the HTML!)  So to simplify this process, I, like any programmer before me,
created a generator.  Just type in the URL
to the YouTube video and press make, and you’ll get a preview as well as the cross-browser HTML-esque mess
of a code to embed.

Of course, if you’re truly lazy, just
drag the bookmarklet below to your bookmark bar in your web browser, and click it on any YouTube video and
you’ll be taken to the page with the code already generated.

href="javascript:document.location='http://gtaero.net/ytmusic/?q=' + document.location">Generate
Mini-Player

Source code is available via link at the bottom of the
page.

style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px;
border-left-width: 0px" title="80x15[1]" border="0" alt="80x15[1]"
src="http://tech.gtaero.net/wp-content/uploads/2009/10/80x151.png" width="80" height="15" />


xmlns:dc="http://purl.org/dc/elements/1.1/" href="http://purl.org/dc/dcmitype/Text" property="dc:title"
rel="dc:type">class::Scrobbler by rel="cc:attributionURL" property="cc:attributionName" xmlns:cc="http://creativecommons.org/ns#">Navarr T.
Barnier
is licensed under a rel="license">Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License.

Based on a work at xmlns:dc="http://purl.org/dc/elements/1.1/">gtaero.net.
Permissions beyond the
scope of this license may be available at rel="cc:morePermissions" xmlns:cc="http://creativecommons.org/ns#">mailto:[email protected].