For the past week, I’ve been on a mission to come up with a proof of concept to demonstrate that I could convert an organization’s site from Joomla! to WordPress and simplify the site’s back-end. I plugged away and got everything pretty comparable on the front-end. One of the sticking points that I came across, however, was Joomla’s Docman plugin, a very thoroughly integrated document manager. From what I could find, WordPress had a few plugins that added a File Manager extension but most were out of date. Instead of using a plugin, I used a stand-alone file tree script and then embedded it in a WordPress page with an iframe.
Most of the file manager WP plugins that I saw didn’t meet all of my criteria. For example, many of them only had a file tree visible on the WordPress Admin side of things. I needed a public interface. One plugin, Al3x File Manager, had been published just a few weeks before my search began and it included a public interface. Unfortunately, its public interface was not interactive and showed the file tree completely expanded; the interface on the admin side was interactive. To find a solution, I would have to venture outside of WordPress plugins even though this would mean uploading files to the server would be more complicated.
jQuery File Tree
One of the first acceptable solutions I found was a jQuery script called jQuery File Tree that just presents a directory of files nicely. I was able to get it working nicely in a little demo HTML file but had problems integrating it with WordPress due to the relative nature of the structure. I switched to using an iframe and it seemed to work nicely, though it does have its limitations with a lot of nested folders and minimal file information.
By default, jQuery File Tree is a weird plugin because its original behavior when a file is double-clicked is to pop up an alert with the file path. To me, it would make more sense to have the file open action start downloading the file. To have the file open in a new tab/window, I swapped the open action from alert(file) to this:
window.open(file,’Download’);
Box.net Embedded Widget
I deviated from the iframe embedded file managers to look at something that specializes in file managers and found out that Box.net had a nice embeddable widget. Upload all your files to them and embed the directory you need and it can show it in a nice display as folder icons or a list.
I was a fan of this approach because there are a number of different ways to get the files to Box.net, it looked pretty good, and it wouldn’t cost us any bandwidth from our hosting. Unfortunately, it didn’t work well for others because the embedded file is powered by Flash. The usability and accessibility by others made this one a no-go.
TotalIndex
I returned to the land of PHP scripts and found TotalIndex. It is basically a gussied up view of the directory you might see if indexing was turned on. Once it was properly sized and embedded, it looked good. It was more descriptive and worked on a smartphone, so it had a lot going for it. The part I didn’t like was that it didn’t show a tree view so that path was unknown. I did like it better than the DOCman public interface though because it had a folder up link instead of having to return to the root each time.
fileNice
With a bit more looking, I weighed a few options and decided on fileNice. Although it has also been without updates for a while it had good functionality. It has a file tree view and a search. You can also view more information about a document by clicking on the + next to its name. The search was a solid winner as well. fileNice is a compilation of PHP scripts and Javascript working together nicely. I was able to edit the scripts and CSS to get exactly what I needed and remove what I thought was more than what was needed. This also suited my needs of being able to have other WordPress pages focused on lower-level directories. fileNice has been opened up to the community but it’s in need of some love to fully flesh out its capabilities.
Since this method just reads the files in a directory structure, I’ll have to train a few people on properly using FTP to upload the file. Naming the file will also make a difference since they previously relied on DOCman to present a “pretty name”. For FTP uploading, I’ll be referring to a previous article on Idiot-Proof FTP.