HyperLink To Open Local Files

pcworkingOpen A File In A Local Program

So you have a file on your PC and you want to make life easy for yourself and create a link from a personal home page in your browser to that file. But you want a program, like NotePad to open that file. What do you do?

You can search the internet high and low and you’ll find several javascript, php and visual basic solutions. But isn’t that a little over kill? Yes, yes it is. There’s a lot of information about why you can’t do this, or don’t want to do this. And some of that is valid. If this webpage was online and available to the world, the last thing you want to do is click a link that will run an executable file. That’s a huge security risk. Yes indeed it is.

But recently I had a need to simply open a text file  on my pc, in Notepad. Now I could have changed how the browser handles files like this and anytime it finds a .txt file, it can open Notepad instead of displaying the file in the browser. But that’s not what I wanted to do. I only want Notepad to open for this one file, on this one page, for this one link. There’s got to be an easier way than all that overkill coding!

Of course there is. And a huge thanks to my very smart friends on MozillaZine – a Message Board for everything Mozilla. And in particular a big thanks to Gingerbread Man! I love that place. Now let me say this solution does not work with Chrome or IE. All I can suggest there is…use Firefox.

Now way back when I installed the first web server at a large American corporation, it was for a proof of concept project. Way back in the mid-90s, before the word “browser” was in the common lingo, if you wanted to link to a file other than an HTML file, you had to tell the browser what program to use in order to open that file. It’s been a very long time since I’ve coded links in that way so I’ve forgotten how we did it. And if I remembered, it probably wouldn’t work today because of the new variations of HTML that have evolved. Along with the many needed and necessary security protocols.

As a result, I was off to research, how do you do this today. I went over to W3Schools to read up on our good ole friend the <a> tag. There are three new parameters for the <a> tag in the latest version of HTML5.

  • Download – Specifies that the target will be downloaded when a user clicks on the hyperlink.
    So it forces a download no matter what type of file the link is pointing to.
  • Media – Specifies what media/device the linked document is optimized for.
  • Type – Specifies the MIME type of the linked document.

In my zeal to find an answer, I saw little help with these new tags on the original page for the tag. I skimmed, didn’t see what I thought I was looking for and went on to the next search result. Bad move on my part. Being in a hurry in the “it only takes 5 minutes” world, is never a good thing. Because it NEVER takes 5 minutes!

A little more reading and I might have noticed what I did today. A link to expand the description of the new parameters. And in particular the one I would find most interesting, thanks to Gingerbread Man, the Type parameter! And the write up of this little attribute provides a list of the IANA MIME types for a complete list of standard MIME types you can use in this command.

So let’s finally get to the solution, shall we! Here’s the command I needed to use to solve my little requirement.

<a type=”text/local” href=”pathlocation/textfilename.txt”>My Text file</a>

Using this method does mean your browser is going to display a pop-up that asks what you want to do with the file. In this case, I can select NotePad and edit the file I use on a daily basis. I don’t have a problem with that extra click. But you also have the option of telling your browser to do this every time it finds a .txt file. Which, as I mentioned in the beginning, I don’t want it to do.

This Type attribute works the same way in other new HTML5 tags, such as the Link tag, which is also new. For instance if you want to link to a css stylesheet:

<link rel=”stylesheet” type=”text/css” href=”theme.css”>

It’s great to know about these new little tags and parameter attributes. Even for this old dog. New tricks are kewl!

© 1997-2014 Springwolf, D.D., Ph.D., Springwolf's Kosmos. All Rights Reserved.
© 1997-2014 Springwolf, D.D., Ph.D., Springwolf’s Kosmos. All Rights Reserved.


Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.