status

Google Maps Sidebar Widget for WordPress (Per Post)

My friends at Moss Creek Media had an idea.  They wanted to put a Google map of where a picture was taken next to the image.

I looked at all the plug ins and could only find one that added a Google map to a sidebar.  This was great! Something existed so I didn't have to build it but, it only supported one location (defined globally for every instance of the widget) and  what I needed to do was set the location according to the currently displayed image.

Modification time

The original plug-in google-map-v3-for-idn created by Raphael Berrhoun was very easy to modify. I created a new shortcode called gps that you insert into each post where the sidebar widget is displayed.

 [gps latitude="43.62132" longitude="-71.629517" description="<strong>House of Goodness</strong><br/>31 Main St<br/>Oakland, CA 12334"] 

Next all I had to do was modify some of the javascript to read the values passed in by the shortcode (should they be available). If the values were not present then it defaults to the normal values.

function makeMap() {
                        var lat = '".$lat."';
                        var lng = '".$lng."';
                        var info ='';
                        if ( (document.getElementById('gps-latitude')!='undefined') && (document.getElementById('lng')!='undefined') ) {
                             lat = document.getElementById('gps-latitude').innerHTML;
                             lng = document.getElementById('gps-longitude').innerHTML;
                             info = document.getElementById('gps-description').innerHTML;
                        }

Usage

You can download my modified the version of the plug-in. All that you will need to do is add the GPS line to your post and make sure you have installed the widget into your sidebar and populated the Google Maps API key. (Under settings in the control panel)

  mod_google-map-v3-for-idn.zip (14.3 KiB, 119 hits)

01
May 2010
POSTED BY Matthew
DISCUSSION No Comments
status

Redirect Blogengine Links to WordPress (running on a Rackspace Cloud)

Problem

I used to have a web server running IIS and BlogEngine.  When people come to my new site looking for an article they will get a nasty error.  For one the site is now PHP.  I wanted to remap all the files from the old URL’s to the new URL’s.

Old URL
http://www.devclarity.com/blog/post/topic.aspx

New URL
http://www.devclarity.com/index.php?s=topic

I figured I would just put a redirect in .htaccess, but little did I know that the web server sees the .aspx extension of the old URL and processes it on the IIS server.  Thanks a lot Rackspace Cloud :-)

Solution

I created a Web.Config file to send all errors to a page called Redirect.aspx.
<?xml version="1.0" encoding="utf-8" ?>
<configuration>
    <system.web>
		<customErrors defaultRedirect="redirect.aspx" mode="On">   
		    <error statusCode="500" redirect="redirect.aspx" />
		    <error statusCode="404" redirect="redirect.aspx" />
		    <error statusCode="403" redirect="redirect.aspx" /> 
		</customErrors>
    </system.web>
</configuration>
Then, redirect.aspx takes the URL and modifies the aspx extension to a html one and redirects the new link back to the page.
<%
	Dim ASPXPath as String
	
	ASPXPath = Request.QueryString("aspxerrorpath") 
	ASPXPath = ASPXPath.Replace("aspx", "html").replace("-", "+")
%>
<html>
<body>
	<h3>Please wait, your content has moved</h3>
	
	<script>
		window.location='<%=ASPXPath%>';
	</script>
</body>
</html>

Old URL:
http://www.devclarity.com/blog/post/topic.aspx

New URL:
http://www.devclarity.com/blog/post/topic.html

So now, the only thing was setting up the .htaccess file to handle the old url.  What this rule does, is it takes the topic out of the passed URL and reroutes it to the WordPress search engine.
RewriteRule ^blog/post/([\w-\+]+)\.html$ /index.php?s=$1 [R=permanent,L]

Result

http://www.devclarity.com/blog/post/Backup-Mover.aspx now takes you to the remapped Backup Mover page on the WordPress site.

(Of course, this post is new so if you use the old backup-mover link you will see this page first with the backup mover article under it :-( )
26
Jan 2010
POSTED BY Matthew
DISCUSSION 1 Comment
status

Gallery extension for BlogEngine

Paul Tumelty wrote a very nice BlogEngine component that creates a page of Lightbox 2 links dynamically from a directory of images.

I have added to this extension, you can now pass in a “SetName” to define a set of images.  Defining a set of images in lightbox allows you to use the built in Previous and Next capabilities of Lightbox 2.

I also noticed an error with thumbnail generation, it was hard coded to a value of 75, that has been fixed as well.

Get the Lightbox JS here
Get the Gallery extension here

Download the update

  Blogengine-Lightbox.zip (3.4 KiB, 219 hits)

I also had an issue with Prototype interfering with lightbox (making the application appear not to work).  If this happens to you simply update the blog.js file in your installation root directory of BlogEngine to correct this error.

04
Jun 2009
POSTED BY Matthew
DISCUSSION No Comments