[theme-reviewers] Shortcodes

Otto otto at ottodestruct.com
Fri Feb 17 20:04:49 UTC 2012


On Fri, Feb 17, 2012 at 1:26 PM, Bruce Wampler <weavertheme at gmail.com> wrote:
> And as for YouTube, my theme is completely responsive, as well as including
> extensive mobile device specific support (things beyond being responsive,
> such as selective excerpt/full display of posts, or using different menus
> depending on the device). There simply are no existing ways to properly
> display YouTube videos without the intimate knowledge my theme has about the
> device it is being displayed on. And it is really critical that the videos
> be displayed properly on a specific device. Not allowing a theme integrated
> shortcode for that would completely break proper display of those videos.

I was curious about this, so I decided to test a theory.

If you adjust the $content_width global dynamically based on the
device width detection method you're using (say you detect an iPhone
and so set it to something less than 480),then the built in oEmbed
technique will change to adapt to it.

For example: make a test site using twentyeleven. Embed a youtube vid
on there using the [embed] code or using the URL-on-its-own-line
method. Load the site and you'll see the youtube video at 584 pixels
wide.

Now, edit the twentyeleven functions.php file and change the
$content_width to, say 300. Load the site again. Note that you haven't
edited the post or changed the site in any other way. You'll find the
video is now smaller.

Note that it will take a second longer to display the page the first
time with the new width, because oembed has to get triggered into
making a new call to the Youtube oembed endpoint, but the result of
this will be cached in the post_meta, so it only makes that one hit to
get the new iframe code from Youtube.

The reason this works has to do with the caching mechanism of oembed.
In processing the normal [embed] shortcode, the handler checks
post_meta for the cached response from the oembed http request.
However, the cache key is an MD5 of the serialized array of
attributes. Those attributes include the URL being requested, of
course, but also the width it's asking for. The $content_width is the
default width used, and if the $content_width changes, then the cache
keys won't match and it'll make a new request with the new attributes.

So here, you're mistaken. You don't necessarily need to have a special
shortcode for handling youtube videos, or any other videos that are
supported by oEmbed. All you have to do is adjust your $content_width
to one that is appropriate for the device. Then the built in embed
mechanisms will handle it just fine.

-Otto


More information about the theme-reviewers mailing list