New Theme Feature: Mime Icons

WordPress 2.0 lets you upload files as post attachments. Every attachment has its own database record and its own web page much like its parent post. When linking to these attachments, you can use the URL of the file (a direct link) or the attachment’s page URL (sometimes called a subpost). These subposts display the title and description and a link to the file in a template that, by default, looks just like the post it’s attached to.

Very recently we added some new features that allow theme authors to customize the way attachments are displayed based on the type of file. An jpeg file will have the mime type “image/jpeg” while an mp3 will have the type “audio/mpeg”. When someone visits the attachment permalink, WordPress will look for theme files with names matching the mime type of the attached file. If the theme includes a file “audio.php” it will be used for all audio attachments. Likewise for a theme file named “image.php”. If the mime-related file isn’t found, WP will look for “attachment.php” and if that fails, it will fall into compatibility mode.

Compatibility mode ensures older themes will display attachments in WordPress 2.0. WordPress uses the theme’s usual template to display the subpost and adds a link to the attached file above the file’s description. This link is generated according to a set of rules: if it’s an image, use the thumbnail or the original; else if it’s another type of file and the theme includes an image named for the mime type use that; else make a text link using the attachment’s title.

That’s right, theme authors can now include graphic icons for attached files, e.g. audio.jpg, text.gif, application_msword.png! I think podcasting blogs will be the first to jump on this feature. Adventurous plugin authors are encouraged to find and use the many new and not-yet-documented hooks in these functions. It’s even possible to attach a thumbnail to any uploaded file, not just images, and have WP use that when generating the icon for that attachment.

ScreenshotsThe default theme has been updated to take advantage of most of the new attachment features listed above, as well as some more advanced programming to display the subposts differently depending on the size of the link generated. I put together a little demo showing this and I’ll explain it after the jump.

I hope you enjoy these features, or at the very least I hope they don’t get in your way if you aren’t using them!

5 Responses to “New Theme Feature: Mime Icons”

  1. Global Advanced Media WeBlog Says:

    WordPress 2.0 Release Candidate 3

    After clicking over to the example Andy used I see the photo handling and ease of podcasting is really quite brilliant, get ready for an even more powerful wordpress soon!

  2. Global Advanced Media WeBlog » WordPress 2.0 Release Candidate 3 Says:

    [...] Then, we click over to Andy’s blog, and find that a new feature in wordpress 2.0 will basically allow you set an application to run with specific files when you upload files such as mp3s and images, that’s right wordpress will be set to take images and audio files (I am assuming video too), auto add to the database and create a post for it, so that you can call the image or audio file into a post, and there is a thumbnail option which will allow you set up an image to go along with your audio file - so this is going to be a big plus for podcasters, or blog broadcasters indeed! [...]

  3. Pandemonium » Adjuntos en WordPress 2.0 Says:

    [...] Más “novedades” de WordPress, lleva dos meses fucionando y yo sin saberlo. Ahora se puede crear una página especial y un icono para cada tipo de adjunto, como cuenta Andy en esta entrada. Es la única razón buena que se me ocurre para usar su sistema de subida de archivos. [...]

  4. børge forteller om livet » Oppdatert til WordPress 2.0 Says:

    [...] Egne sider for bilder/lyder: Hvis du legger til et bilde eller en lydfil til et innlegg du skriver kan du nå gi denne filen en egen side med tekst og mulighet for andre å kommentere filen. Du kan lese mer om dette og se et eksempel hos Andy. Eksempelet ser du ved å klikke på det lille bildet nederst. [...]

  5. U3Fz4mow5K Says:

    tGHWQlod5bq A6YPRQsTbdpi WH5Hil6Bro

Leave a Reply