Audio / Video support in Core

Post Formats are a big feature in WordPress 3.6. What you may not know is: there is now native support for Audio and Video in coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.! There has been great support for embeds by way of WP_Embed and oEmbed providers for a while, but, if you wanted to play an MP3 from your Media Library, you had to install a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. Supporting audio and video in core gives bands, podcasters, vloggers, et al the ability to easily and beautifully expresses themselves through sounds and moving pictures without using an external service.

How does this work?

At the core of the experience is the fantastic library, MediaElement.js. MediaElement is the facade layer that gives us maximum file support and cross-browser compatibility. While some libraries require a Flash-only solution to make your media work cross-environment, MediaElement lets you use HTML5 audio / video tags in every browser, and, only when necessary, will use a Flash or Silverlight plugin in the background to make incompatible media work. Translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization., things like this: <audio> tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) works in old IE, Windows Media files work in Chrome.

MediaElement uses the same HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. markup, regardless of playback implementation, and you can use CSSCSS Cascading Style Sheets. to skin the players.

Shortcodes

MediaElement’s great, but we don’t want to be locked in to one external library forever. Instead of using MediaElement-specific markup everywhere, we expose audio and video markup through shortcodes: [audio] and [video].

For the following scenarios:

  • I have an old post that has a video in the Media Library attached to it, and I want to use the new shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site.: [video]
  • I have the URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org for a video, from the Media Library or external, that I want to play:
    [video src="video-source.mp4"]
  • I have a source URL and fallbacks for other HTML5-supported filetypes:
    [video width="600" height="480" mp4="source.mp4" ogv="source.ogv" webm="source.webm"]

Same goes for audio:

  • I have an old post that has an audio file in the Media Library attached to it, and I want to use the new shortcode: [audio]
  • I have the URL for an MP3, from the Media Library or external, that I want to play: [audio src="audio-source.mp3"]
  • I have a source URL and fallbacks for other HTML5-supported filetypes:
    [audio mp3="source.mp3" ogg="source.ogg" wav="source.wav"]

Shortcodes focus on the “what” and abstract the “how.” If you want to use a library that is not MediaElement, you can! Just look at what to filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output.: here

Embeds

There are also new embed handlers for audio and video. Using them is easy as dropping a media link on a line by itself in the editor:

http://my.mp3s.com/cool/songs/coolest.mp3

I like this song because it is really cool!

Works for both audio and video with URLs matching the allowed (and filterable) list of extensions (see: here and here)

Adminadmin (and super admin)

Using the new post formats UIUI User interface, it is even easier to get directly at the audio and video in your Media Library. When selecting, the media modal opens to your library, filtered by media type.

Metadata

In previous versions of WP, you could upload audio and video, but we were not generating metadata like we do for images. In 3.6, using the getID3 library, we are able to extract data from audio and video like cover art, song length, artist, album, song title, genre, codec, etc. It’s pretty great. We will soon be exposing more of this data in the admin as well, along with inline previews on the Edit Media page:

Themers

Themers can get in on the action, too, using structured-post-formats in their theme (Twenty Thirteen is a great place to look). The admin gives users flexibility when associating media with a post. the_post_format_audio() and the_post_format_video() will automagically retrieve and output your media in the front end.

#audio, #media, #mediaelement, #post-formats, #shortcodes, #video

GSoC 2013 Update

We have been accepted as a mentoring organization for GSoC 2013. I’m already being bombarded by overenthusiastic students with questions, so we need to get our act in gear re mentor list and project list more or less now. Definitely by tomorrow.

IF you have worked on an assigned feature team in one of the last few releases, you can be a mentor, yay!
IF you haven’t worked on an assigned feature team but you’ve had multiple patches accepted in one of the last few releases, you can be a mentor, yay!
IF you have themes/plugins in the .org repo and the lead devs say your code is good, you can be a mentor, yay!
IF you don’t meet either of these criteria but think you’re skilled enough and want to contribute, I need to have your code vetted by the lead devs.

If you are in one of the “yay” categories, please add yourself to the mentor list at https://codex.wordpress.org/GSoC2013 and leave a comment here saying you did so. Then, go to http://www.google-melange.com/gsoc/org/google/gsoc2013/wordpress, scroll down, and follow the process to apply to be a mentor in the gsoc system. Note that it’s a little bit busted right now, so you might not get a confirmation back from me until they fix the existing bug there.

If you are in the maybe categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging., you can pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” me in irc, comment here, or email ([my username/irc nick]@wordpress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/) me to get on the list of potential mentors that will have code reviewed by the leads.

Also, project ideas can be added to the wiki page as well IF you fall into the pre-approved to mentor category. Worth running ideas past the leads in irc for a gut-check first. Other ideas can be posted here for review.

Thanks!

#gsoc

We love testers We’d love more people to…

We love testers

We’d love more people to install Twenty Thirteen, with special emphasis on trying out all the new Post Format features.

Also, if you have access to Windows with various versions of Internet Explorer we especially need help testing out some IE8 and IE10 issues (see TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. list link below).

Priorities

  • Address open tickets in Trac, fix bugs and make improvements
  • More browser, device, RTL, and i18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill. testing
  • Post formats testing. For example, looking at the output from post_formats_compat(), making suggestions like Image should use wp_get_attachment_image() there for filters and correct coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. class attribute values in the resulting HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers..
  • Review and possibly refactor the js/functions.js JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/. file, going to all procedural/functional or moving to a new architecture—the key is to be consistent with it within the file. We can also look at namespacing the events.
  • Ask Joen to do another design audit, checking versus his design vision for things like spacing, colors, and post formats.

Office hours

We’ll get back to office hours in #wordpress-dev IRCIRC Internet Relay Chat, a network where users can have conversations online. IRC channels are used widely by open source projects, and by WordPress. The primary WordPress channels are #wordpress and #wordpress-dev, on irc.freenode.net. over the next few weeks, Tue and Thu at 17 UTC.

#3-6, #bundled-theme, #theme, #twentythirteen