DK New Media has had this WordPress plugin on the back-burner for some time. The demand for a simple, quality image rotator plugin was high not only for our clients, but also the WordPress community. The plugins I had found that promised to do what we needed were either broken or did not work at all. So we made our own.
The first version was ugly, and consequently never added to the WordPress Plugin Repository. Aesthetics were not the only issue: you could only run one instant of it per page, there were two different places where settings had to be configured, did I mention it was ugly?
The rotator comes with three transitions: Linear, Loop, and Fade. Linear will scroll the images horizontally across it’s container. Once a linear rotator has reached the end of the images, it will bounce back and scroll the opposite way. Loop rotators are circular: when the last image is reached, the first image in the list will appear next, and the loop starts over. Fade will fade each image in and each image out.
These transitions weren’t our biggest issue though. It was the settings. That was the ugly part, but this time we made something elegant.
To the right you see the Image Rotator Widget’s setting pane. We knew that the process of adding images to the rotator needed to be simple. A plain “+” button will invoke WordPress’ Media dialog. From there, users may chose to upload a new image, or to select a previously uploaded image from their Media Library, just like they would if they were inserting an image into a post. After the image has finished uploading or the user has selected an image, they must press the “Send to Image Rotator” button. Once all of the desired images have been uploaded, they’re really easy to manage.
Hovering over an image name will display a tooltip that contains the image. We didn’t want to clutter the widget settings, so we decided that loading all of the images into the settings container was not an option. Our decision to put the images into a tooltip preview paid off two-fold: users don’t have to wait for images to load before than can edit, reorder, etc…; and it kept our interface clean, which makes for easy sorting and deletion.
Sorting is as easy as clicking on empty space within the image list item and dragging it to the desired position. Imagine how choppy this would have been had we loaded the images(all with different proportions) straight into the settings container.
To delete an image from the widget, press the “-” button that is next to the image you want to remove. Keep in mind that you must click “Save” or none of these changes will take place.
For a more visual overview of the widget settings, we’ve made a screencast:
If you give this plugin a run, please feel free to leave any comments, bugs, or feedback in the WordPress support forums(we monitor these) or by contacting us directly.
The Image Rotator Widget can be downloaded from the WordPress plugin repository.
