Google Maps Version 3 Example with Markers and InfoWindow

HTML posted 6 months ago by christian

   1  <style media="screen" type="text/css">
   2    #map { width:960px; height:330px; }
   3  </style>
   4  
   5  
   6  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
   7  
   8  <div id="map"></div>
   9  
  10  <script type="text/javascript">
  11    var map;
  12    var marker;
  13    var initialized = false;
  14  
  15    var infowindow = new google.maps.InfoWindow({
  16      content: '',
  17      //disableAutoPan: true // Not compatible with InfoWindows. They are cropped...
  18    });
  19  
  20    // Triggered when map is loaded or moved
  21    var boundsChangedListener = function() {
  22      if(initialized == true) { return };
  23  
  24      initialized = true;
  25  
  26      addMarkers();
  27    };
  28  
  29    function addMarkers() {
  30      var bounds = map.get_bounds();
  31      var southWest = bounds.getSouthWest();
  32      var northEast = bounds.getNorthEast();
  33  
  34      var lngSpan = northEast.lng() - southWest.lng();
  35      var latSpan = northEast.lat() - southWest.lat();
  36  
  37      var icon = '/images/icons/xxx-club-16.gif';
  38  
  39      for (var i = 0; i < 10; i++) {
  40        var point = new google.maps.LatLng(
  41          southWest.lat() + latSpan * Math.random(),
  42          southWest.lng() + lngSpan * Math.random()
  43        );
  44  
  45        var marker = new google.maps.Marker({
  46          position: point, 
  47          map:      map, 
  48          icon:     icon, 
  49          title:    "Marker"
  50        });   
  51  
  52        addMarker(marker);
  53      }
  54    }
  55  
  56    function addMarker(marker) {
  57      google.maps.event.addListener(marker, 'mouseover', function() {
  58        marker.html = 'Marker xxx';
  59        infowindow.open(map, marker);
  60      });
  61  
  62      google.maps.event.addListener(marker, 'mouseout', function() {
  63        infowindow.close();
  64      });
  65    }
  66  </script>
  67  
  68  

Tagged google-maps, maps, google

Tracking 404 and 500 with Google Analytics

JavaScript posted about 1 year ago by christian

Tracking 404 and 500 errors with Google Analytics is documented here, but I tend to forget so I’m putting the information here:

   1  // 404
   2  pageTracker._trackPageview("/404.html?page=" + document.location.pathname + document.location.search + "&from=" + document.referrer);
   3  
   4  // 500
   5  pageTracker._trackPageview("/500.html?page=" + document.location.pathname + document.location.search + "&from=" + document.referrer);

In Rails I set the response code and use that instead of hardcoding it in the view:

   1  <% if response.status != 404 %>
   2  pageTracker._trackPageview();
   3  <% else %>
   4  pageTracker._trackPageview("/404.html?page=" + document.location.pathname + document.location.search + "&from=" + document.referrer);
   5  <% end %>

Tagged 404, 500, google, analytics, track

How to automatically ping search engines when your sitemap has changed

Ruby posted about 1 year ago by christian

I prefer letting cron update sitemaps in the background, and at the end of the script I ping search engines to let them know it’s been updated:

   1  # Recreate sitemap goes here
   2  
   3  # Let search engines know about the update
   4  [ "http://www.google.com/webmasters/tools/ping?sitemap=http://xxx/sitemap.xml",
   5    "http://search.yahooapis.com/SiteExplorerService/V1/ping?sitemap=http://xxx/sitemap.xml",
   6    "http://submissions.ask.com/ping?sitemap=http://xxx/sitemap.xml",
   7    "http://webmaster.live.com/ping.aspx?siteMap=http://xxx/sitemap.xml" ].each do |url|
   8    open(url) do |f|
   9      if f.status[0] == "200"
  10        puts "Sitemap successfully submitted to #{url}"      
  11      else
  12        puts "Failed to submit sitemap to #{url}"
  13      end
  14    end
  15  end
  16  

More about sitemaps: http://en.wikipedia.org/wiki/Sitemaps

Tagged sitemap, ruby, ping, search, google

How to optimize your MephistoBlog powered site's search engine ranking (SEO for MephistoBlog)

Plain Text posted about 1 year ago by christian

At Aktagon we use MephistoBlog as CMS , and I couldn’t find any information on how to SEO optimize MephistoBlog on Google, so I’m sharing my notes here.

This tip shows you how to make your pages more search engine friendly.

First, add the title tag, plus the meta description and keywords tags to your layout’s Liquid template , as shown here:

   1  <meta name="description" content="{% if article %} {{ article.excerpt }}  {% else %} YOUR DEFAULT SITE DESCRIPTION {% endif %}" />
   2  	<meta name="keywords" content="{% if article %} {% for tag in article.tags %}{{ tag }}, {% endfor %} {% endif %} YOUR DEFAULT KEYWORDS" />
   3  	<title>{% if article %} {{ article.title }} &raquo; {{ site.title }} {% else %} {{ site.title }} &raquo; {{ site.subtitle }} {% endif %}</title>

Remember to update the default description and keywords in the meta tags’ body.

Now, whenever you publish an article, simply add an excerpt and some tags to it. The excerpt is used as the meta description and the article’s tags as the meta keywords, both make Google a bit happier, but the description is by far the more important.

Tagged seo, mephistoblog, meta, google, search, keywords

How to track user actions and custom events with Google Analytics and jQuery

JavaScript posted about 1 year ago by christian

This is a customization of Rebecca Murphey’s script:

   1  $('a').each(function() {
   2  	var $a = $(this);
   3  	var href = $a.attr('href');
   4  	
   5  	if(typeof pageTracker == 'undefined') { return; }
   6  
   7  	// Link is external
   8  	if (href.match(/^http/) && !href.match(document.domain)) {
   9  		$a.click(function() {
  10  			pageTracker._trackPageview('/external/' + href);
  11  		});
  12  	} else {
  13  		$a.click(function() {
  14  			pageTracker._trackPageview('/internal' + href);
  15  		});
  16  	}
  17  });

Note that clicks are shown as page views in reports, so you should exclude them from all reports. A future version of Google Analytics will allow you to track events, such as mouse clicks, without affecting page view reporting, see this page on the new event tracking beta feature for more information.

Tagged jquery, google, analytics, track, click