Holy cow, I’ve gone and made a mime-type wordpress plugin

27 Oct
2010

I’ve been a developer for 8+ years now and have used wordpress (WP) on and off for at least 5 years, but I’ve never really got my hands dirty.

Until now.

I’ve been prepping my journo sister’s website for launch and came up with a thorny issue:

How do I get a nice mime-type icon next to my uploads?

When I link to a PDF I have uploaded in a post, how can I get it to display a nice PDF icon next to it? I looked for some wordpress plugins but found nothing, so I decided to make one for myself.

Introducing: MimeTypeLinkImages

Customisable so you can automatically include the icons of

  • .doc files
  • .docx files
  • .zip files
  • .pdf files
  • .xls files
  • .xlsx files
  • .csv files

Each file type comes with 4 different sizes to choose from:

  • 128×128
  • 64×64
  • 48×48
  • 24×24

I figured it would be handy for other developers out there, so am releasing my baby into the wild.

If you want to know more, or have any questions, please get in touch.


21 Responses to Holy cow, I’ve gone and made a mime-type wordpress plugin

Avatar

MadeGlobal

October 31st, 2011 at 10:09 am

Hi,

There is a bug in the javascript for the latest version (2.0.9). It only shows up on IE7/8 or below I think, but it doesn’t work and stops all subsequent javascript from working too.

I’ve added the following line to fix the issue in mtli_str_replace.js … :

Line 2 add the following
var content;

The problem was that “content” was undefined and therefore broke IE7. All was fine in IE9 and FF etc so you probably didn’t notice it. Anyway. Hope that is of some help.

Avatar

admin

October 31st, 2011 at 10:31 am

Thanks Tim,

version 2.0.9b has just gone up with your correction. Many thanks

TC

Avatar

Alexnts

February 13th, 2012 at 2:11 pm

Hello there!
I have installed the latest and some older versions of your plugin to my wordpress installation and the admin page of the plugin doesn’t work.
See below.
http://dl.dropbox.com/u/13458986/mimefiletypes.jpg
What can go wrong?

P.S. My wordpress language is Greek. I don’t know if that rings a bell.
My best regards!

Avatar

trim

February 24th, 2012 at 9:26 am

Please add the file format “*. djvu”

Avatar

oneafrikan

April 3rd, 2012 at 10:18 pm

Hey Toby,

May be a dumb question… but, how do you use the plugin?
From what I can tell, it displays media that are attached to a page…? Or do you have to use php / shortcode etc somewhere?

Thanks in advance!
Gareth

Avatar

admin

April 4th, 2012 at 10:23 am

Gareth,

The plugin needs no shortcodes or special PHP. The idea of the plugin was that any link to a PDF or whatever, should automatically show an icon next to it.

Activate the plugin, choose which extensions you wish the plugin to scan for and you’re done. Whenever the plugin finds a link ending in your chosen extension, it will add your chosen icon automatically. Hopefully as simple as possible.

If you have any more queries, problems, suggestions, please don’t hesitate to get in touch…

TC

Avatar

admin

April 4th, 2012 at 10:25 am

@Alexnts – there was an issue if your server wasn’t set up to use PHP shortcode – ie

1
<?

rather than

1
<?php

- this was fixed in an earlier version – 2.1.3 I think.

Anyhow, version 2.1.6 will be fine. Please get in contact should you have any more problems and sorry for the inconvenience.

TC

Avatar

admin

April 4th, 2012 at 10:28 am

@trim – added in version 2.1.5 – thanks for using the plugin

TC

Avatar

Lis

April 4th, 2012 at 12:15 pm

Hi Toby,

I installed your plugin and it worked perfectly for pdf-files. Thanks a lot!
But when I uploaded a word-file there was no icon for .doc added, even after I changed “false” into “true” in the following line:

$mtli_default_options['enable_doc'] = true;

as it is in the line for .pdf

Could you help me to enable also other data formats than pdf?

Thanks in advance!
Lis

Avatar

admin

April 4th, 2012 at 12:23 pm

@Lis

Those are the default settings. Once you have approved the app, they will be ignored.

Go the settings page for the plugin – /wp-admin/options-general.php?page=mime_type_link_images.php – to adjust which extensions to search for..

Any problems, please get in touch.

TC

Avatar

MG

April 30th, 2012 at 8:56 pm

Okay, great, now, I’m wondering, would it be possible to add a silly, simple, stupid, but useful feature. “Mousover” with pop-up text telling what the icon means? Basically a ‘title’?

So, when you mouse over a .pdf it gives you the document type, in case i’s not blatantly obvious. So, it would say something like “Adobe PDF” “Microsoft Word 97-2003 .doc” “Microsoft Word 2007+ .docx” “JPEG image” “Shockwave Flash,” etc.

It seems to me there could be a little field to the right of the icon and the checkbox in the setup page, with generic default text, but editable, if you want to customize it (changing “Adobe PDF” to just “PDF” or “Microsoft Word 97-2003 .doc” to “MS Word .doc,” etc.).

Seems like this would be a relatively simple thing. And it would potentially make it more friendly? Especially for those with screen readers, etc. Just guessing?

Best,
~MG

Avatar

MG

April 30th, 2012 at 8:57 pm

Err, that is when you mouse over the image inserted by the plug-in, not necessarily the link, which would have its own title…

Great plug-in BTW. Love it. Simple. Seems to work beautifully so far. No fuss, no muss.

Best,
~MG

Avatar

admin

May 1st, 2012 at 7:49 am

MG,

Thanks for using the plugin. Glad you like it and that it is (almost) everything you would like it to be.

I like your suggestion, but the problem is that I don’t really want to interfere with people’s text/code.

What the plugin does currently is simply add a style to the hyperlink.

So

1
<a href="mypdfhere.pdf">link to my pdf</a>

becomes

1
<a href="mypdfhere.pdf" class="mtli_attachment mtli_pdf">link to my pdf</a>

so there is no image to give a title, what I would be doing is giving a title to the hyperlink itself, which I think people might be upset about.

Your link would look like this

1
<a href="mypdfhere.pdf" class="mtli_attachment mtli_pdf" title="Adobe PDF file">link to my pdf</a>

There are 3 things to consider here:

1. What if someone had their own title attribute on that hyperlink already.

2. Google likes to look at titles of hyperlinks and adds them to its famous algorithm. If the link to your super PDF file has the title “Adobe PDF file” this is going to detract, not enhance your SEO ranking for that file.

3. What if people wanted to change their title tags to be more customised? (This one I can probably handle)

For now, I think the best solution is for users to add their own titles to their own hyperlinks on a manual basis. I will post this on the site and if it gets a lot of traction, I can think about including it in the next release.

Once again, thanks for using the plugin. Don’t forget to rate if you haven’t already!

Thanks

TC

Avatar

James

June 7th, 2012 at 4:26 pm

Hi there,

Love your plugin. Works great with PDFs. I thought (but I guess I am wrong?) that I could also use the plugin for .vcf files and have an icon for vcards. Is that an option? If so, how can I add it? I went to wp-admin/options-general.php?page=mime_type_link_images.php but it isn’t one of the options.

Any help is appreciated,

James

Avatar

admin

June 11th, 2012 at 7:33 am

James – each mime type extension is hardcoded into the plugin.

I can add .vcf to the next version, which will be coming in a couple of weeks

TC

Avatar

Eric

December 1st, 2012 at 6:55 am

Hi! Great plugin by the way, just have an issue. How do I disable it if I don’t want a certain link to display an icon? especially for embedded images(jpg)

Thanks!

Avatar

admin

December 1st, 2012 at 11:43 am

@eric – there is a classname you can set in plugin set up.

Enable/Disable classname?
Tick this box to have a classname that will disable the mime type links (ie: around an image or caption).
You can change the classname by editing the field below.

by default set at

1
no_mtli

Avatar

Eric

December 5th, 2012 at 9:52 pm

Hi thanks for the answer! However the images I was talking about are thumbnails set in featured image. How can I use the class name that I’ve set to disable icons?

Thanks man..

Avatar

admin

December 10th, 2012 at 7:24 am

@eric – not sure I understand your question. Setting class=”no_mtli” on any given link will mean that the plugin will ignore that link and not parse it, hence disabling the icons.

If you want your own classname instead of no_mtli to use instead, just use the plugin admin to set this. The option is at the bottom of the page.

Avatar

Olivier Keshavjee

March 7th, 2013 at 10:36 pm

Great extension, thanks.

Can you add ePub in the next version? Thanks !

Avatar

admin

April 15th, 2013 at 1:29 pm

included in 2.2.3

Comment Form

top