Tag Archives: wordpress plugin

wordpress-dropbox-logos

Using Dropbox in WordPress

Dropbox is one of the many cloud-based file storage services out there, and it’s also one of the most seamless. You can sign up for a free account for up to 2GB of storage. If you need more storage space, the larger plans are fairly reasonable. There’s a desktop application that adds a folder on your computer which is synchronized with your Dropbox account in real time. They also have Android and iPhone apps that do the same thing, so you can download and update your documents on the go.

The ability to collaborate is probably one of the more interesting features – you can share a folder with other Dropbox users and they can update the files in that folder as well. I have a client that wanted the ability to display links to a set of documents which would be updated by a small group of people on a regular basis on her WordPress site, but didn’t want them to have to log into the site and update the file every time the file was updated. There are only a few Dropbox Plugins for WordPress out there, and really only one that serves this purpose well.

Enter PressBox – this adds a tab to your Media Upload screen and allows you to display images or link to any files in your Dropbox account anywhere on your WordPress site in a very convenient and intuitive way. The plugin also uses OAuth so your Dropbox account details are not stored for the plugin to gain access.

After selecting your document and inserting it into the post, you end up with something like this:

[[pressbox path=/test.docxtype=link]]

Notice how the path and the “type” attribute run together. Another bug is that when you click the download link, your browser recognizes the correct file type and you do download the correct file, but it ends up being named “pressbox.php”. These are a couple bugs which I have contacted the plugin developer about as well as correcting in the download below.

Under the current release, it defaults to making the link text the filename like so: There’s not a place for it in the Media Upload window, but you can add a “name” attribute to the shortcode to override the link text like so:
[pressbox path=/test.docx type=link name="Test Document"]
which gives you this:

[pressbox path=/test.docx type=link name="Test Document" ]

I found it rather interesting that in the Media Upload screen, it detected the file type and displayed a file type icon, but there’s no option to display the filetype icon with the link, so I updated the plugin to do this as well. Now, the Media Upload screen will also include the URL to the appropriate file type icon in the shortcode, and it will be displayed like so:

[pressbox path=/test.docx name="Test Document" type=link iconimg='http://www.bryanheadrick.com/wp-content/plugins/pressbox/images/page_white_word.gif']

Download: PressBox by Les Harris (73)

wpplugin

FancyTube – My First WordPress Plugin

I started building this plugin just to make things a bit easier for embedding YouTube Videos using FancyBox.

You can embed YouTube videos by pasting the URL in the page or post starting with WordPress 2.9, but suppose you want to embed a video, you don’t want it to take up much space on your page, but you don’t want the video to be tiny either. Using an overlay is a great way to do this. Generally, Fancybox works with images rather than FlashPlayers, but there’s a pretty easy way to leverage this. Since you don’t want the actual player on the page/post anyway, you just need to insert a thumbnail image of the video. It’s really quite easy to do this using the YouTube API. The structure of a link to a youtube  video is http://www.youtube.com/watch?v= <video id>&…

 

We just need to pull the video id from that and add it to the end of http://img.youtube.com/vi/
and add /0.jpg, /1.jpg, /2.jpg, or /3.jpg.

Of course, the last three are 120×90, which isn’t much to work with. The first one is 480×360, and then we can scale it down to suit our needs.

Next, we add an play button to overlay the thumb image so it’s clear that this is a video and apply the jQuery for the FancyBox effect.

To summarize, we just need a relatively unique class name for the jquery script to attach to, and include the script in the header pointing to that class. This plugin automates all that, so all you need to enter is the video id like so:

[fancytube videoid="mj-7tZZ8fKA"  width="200" height="150" ] gives us this:

Other options are:

Height & Width: sets the dimensions of the thumbnail image.

Image – lets you set a different image than the one defined by YoutTube.

Autoplay (0 for disabled, 1 for enabled)

There’s currently not an admin options panel, but I’m open to suggestions for options to put in there.

Download: FancyTube (75)