Thursday, 30th July 2009 at 8:31 pm | 94 Comments »

Map of all posts

Recently, someone left a comment on how to create a mashup page with a map of all your posts. It is something I know a lot of people ask how to do so I have written a ‘how to’ create a map of all posts template tutorial.

1. Create a Template

Create a new template file in your theme directory. The best thing to do is to create a duplicate of page.php and call it something like “map-archive.php”. In the new template file define the template name:

1
2
3
4
5
<?php
/*
Template Name: Map Archive
*/
?>

2. Get your posts

At the beginning of the template, underneath the template name, create a post query according to what you want to show on the map and assign it to the global $posts variable. For example the following query would get ALL your posts:

6
7
8
9
<?php
global $posts;
$posts = get_posts('numberposts=-1');
?>

3. Add your Header and Footer

Add in the header and footer into the template and any other HTML layout required for your site – you could refer to your main page.php template.

10
11
12
13
14
15
16
17
18
<?php get_header(); ?>
 
<div id="content" class="widecolumn">
   <h2>Map Archive:</h2>
   // We're going to put our map code here...
 
</div>
 
<?php get_footer(); ?>

4. Insert the WP Geo map template function

Call the $wpgeo->categoryMap(); template tag in your template code to show the mashup map.

<?php if ( isset($wpgeo) ) $wpgeo->categoryMap(); ?>

The best place to insert the above function is just above the the WordPress the_content() function. In most themes this will display below your page title and above any content you write (see below).

5. The Final Template…

…should look a bit like this (although it will vary depending on the theme you’re using):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<?php
/*
Template Name: Map Archive
*/
?>
 
<?php
global $posts;
$posts = get_posts('numberposts=-1');
?>
 
<?php get_header(); ?>
 
<div id="content">
 
   <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
 
   <div class="post" id="post-<?php the_ID(); ?>">
      <h2><?php the_title(); ?></h2>
      <div class="entry">
         <?php if ( isset($wpgeo) ) $wpgeo->categoryMap(); ?>
         <?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>
      </div>
   </div>
 
   <?php endwhile; endif; ?>
 
</div>
 
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Simply create a page and apply this template to show the map.

94 Responses to “Creating a mashup page with a Google map of all posts”

  1. Ed says:

    Hi,
    Congratulations for your plugin, is a great job!

    I am designing a map browser for an association, and I need to make a custom search based on the city (custom search) and the category.

    The search works fine, and order it by tittle and alphabetically ASC.
    The problem is that the map dont order the mashups alphabetically, and the map doesnt match with the results.

    I need to show all the posts of the query in the map, or show the mashups alphabetically also.

    I have pasted here my search.php
    http://pastie.org/2613592

    Thank you if anybody can help me, i will appreciate!

  2. santiago says:

    How can I filter by categories? I want to add a sidebar with all the categories on the right side

  3. Patrizio says:

    hello and thank you for your amazing plugin.
    I’d like to ask you, if is possible retrive also the feature image post in the popup;
    Thank you for the answer.

Leave a Reply