Dog-Park-USA.com, A Drupal/Google Maps site on a dime

Dog Park USA is a testament to the leverage Drupal as a Content Management Framework (CMF) gives web site developers. With the large array of core and contributed modules, and a bit of experience, the short time it takes to get a functioning site up and ready for content contribution can be astonishing.

Since my wife and I are developing this site in our spare time, our limiting factor is time. Re-inventing the wheel is not something we want to do, and with the speed, breadth and depth of Drupal, its contributed modules and its great community, we didn't need to.

Our goal was to create a site that tabulated dog parks across the United States, display Google Maps for each park as well as regional maps with many parks, link photo galleries and reviews to each dog park, create a blog for the editors, a simple forum to ask and answer questions and have a frontpage that pulls much of the new content together. Not all that tall of an order, but we all know that website always take longer than you think they will.

The rest of this article will be contain some brief descriptions of how we created the desired functionality through Drupal's module, links to all the pertinent module, themes and support documents, followed by some points of customization that really made the site our own (it is true that some custom code was written, the http://api.drupal.org documentation still speeds up the process considerably).

Functionality solutions formed from contributed modules

To create the the dog park photo galleries we made a new node type with an Imagefield field for the picture and a node reference pointing at the dog park node (which was prepopulated with a well formed link) fields, formatted with imagecache and Thickbox to get a thumbnail gallery with popup full sized pictures. We then made a View with an argument referencing the node ID of the dog park in question.

GMap, GeoRSS, Location, and the Location and Gmap views integration modules to get all the regional and park specific maps to display correctly.

To make the site the most SEO friendly, we use XMLSitemap, Pathauto, Meta Tags, Global Redirect. This suite of modules makes sure that our site is indexed quickly, has human readable URLS, has appropriately tagged meta data and removes the threat of dupliacate content (two URLs pointing to the same page).

Since we wanted a few specific items for the blog, we didn't use the blog module, but made a new CCK type and an associated view to display it. We also added a free tagging taxonomy to the node and activated the Tagadelic module to make a tag cloud of blog terms.

The forum was the easiest. Just turned on and configured the core forum module and then themed the forum node to our liking.

Lastly, there was the setup of the Feedback, IMCE, WYMeditor, Related Links, JRating and some other modules to add a few more bells and whistles to the site. But really, having to only download, turn on and configure modules that give rating abilitys, related links to nodes, image upload/insertion for node and a rich text editor is awesome.

What else we did to make it work and look right

Or course, we added a bit to that dime as well to make the site our own (a web applications developer can never leave well enough alone).

We contributed a new module to drupal.org, Link to Us, a module that provides a banner linking page for nodes, which is fully themable as needed. You are able to upload link banners and pick which node types to place links on. The banner links are fully SEOed, with the node title and URL, as well as alt and title tags on the img and a tags.

The first release of the site used the Danger4K theme, but we have moved to a fully original theme. I really can't wait to implement a theme in Drupal 6 (Theme Developer, part of the Devel module).

To get the maps and markers to look exactly the way we wanted, we used the theme overriding ability and over rode the phptemplate_views_view_gmap and phptemplate_gmap_views_marker_label functions. We just copy the provided theme functions into your template.php file and updated to change the markers and what is attached inside the marker bubbles.

With Views and the GMAP module, I am already spitting out my content into a Google map on our site. But for dog clubs around the country, we figured they might want a constantly updating map that they could embed into their own pages. Of course, for Google Maps to work on a site, they would need a Google API key, so a potential webmaster/editor is directed to Google to get the said key. After that, they simply must pick the local area they want to embed, the size of the map, and through the magic of the Forms API, and some knowledge of the Google Maps API/Javascript, out comes an embedded map, which makes use of a GoeRSS feed pumped out of Drupal (example of embedded map here).

A custom merging of Nice Menus and Taxonomy Context helped us make the taxonomy specific flyout menus

The cost of all this customization: Only 400 lines of temaplate code and theme overrides, and 300 lines of code in a custom module.

Probably the most important lesson we found making this site is that no matter how quickly you develop the site, the content creation is the key. We have since spent scores of hours researching and entering the content/data for our site. Good thing there is the node_import module. Now we can place our research findings into properly formatted CSV file, and instantly import dozens of new dog parks at one time.

I am always so amazed at how Drupal lets me get straight to the new/important stuff. Thank you Drupal, Drupal.org and all you developers, marketers and supporters that make it all possible.