Bing™ Maps with Twitter

Embed a Map of Local Tweets on Your Website or Blog

+ Highlight Local Attractions

+ Real-time Tweets

+ Dynamic Maps

Bing Maps with Twitter Tutorial
Watch How-to Video

What if you could embed a map on your website, blog or Facebook Page that shows all the local activity on Twitter relevant to your business?1

This real-time activity stream is a great way to show what real people are doing nearby, right now. Using this embedded Bing™ Twitter map, hotels, cities, and other types of businesses have an easy way to highlight nearby attractions and engage website visitors.

Scenario Example

 

Here are a few examples:

  • Hotels - A hotel can embed a map with real-time Tweets of people enjoying nearby museums, amusement parks, restaurants, parks and more.

  • Cities & Towns - A city or town can highlight events, monuments, restaurants, and other activities using this map on their website. Results can also be filtered based on keywords and Twitter usernames.

  • Conferences & Events - Event planners can help attendees connect with each other and highlight nearby gatherings and meetups.

How-to Guide

This tutorial will show you how to easily embed a dynamic map on your website or blog that shows real-time Tweets from people in your area.

Click on the sections below for step-by-step instructions:

Step 1 - Launch the Bing™ Twitter Map App

The first step is to visit Bing™ Maps to set up your Bing™ Twitter map.

You'll want to make sure you go to the Silverlight version of Bing™ Maps so that you can launch the Bing™ Map Apps. Here is the URL: http://www.bing.com/maps/explore

Note: you only need Silverlight to configure the embeddable map. Your visitors can view the map whether they have Silverlight installed or not.

Launch Bing™ Map Apps
Launch Bing™ Map Apps

Next, click on the Map Apps button and select the Twitter Maps app.

Select the Twitter Maps App
Select the Twitter Maps App

Click Step 2 below to see how to configure it:

Step 2 - Configure It

Now you can configure your map centering it on your Location, and by adding Keywords or People that you want to see Tweets from. These act as "filters" on the Tweets that will be displayed on your map.

Click on the Search Filters link to display the entry fields.

The Bing™ Twitter Map App
The Bing™ Twitter Map App

If you only want to show Tweets from certain Twitter users, you can put their Twitter usernames in the People field. Same thing for Keywords or Location.

Adding Search Filters
Adding Search Filters

Once you have the map looking how you want it, click on the Embed in your site link in the lower left area of the screen.

Getting the embed code
Getting the embed code

Click Step 3 below to see how to grab the embed code:

Step 3 - Paste Embed Code Into Your Website

This will bring up the Embed window. From here you can configure the width and height of your map, and get the HTML code to paste into your website. Select and copy the embed code to your clipboard.

Change map dimensions and copy embed code
Change map dimensions and copy embed code

Now go to your website, and paste the embed code into the page that you want to display the map on. You can paste this into to any blog post or HTML page.

Paste the embed code into your website
Paste the embed code into your website

Now view your page - you should see a map of your location, with nearby Tweets!

Website with embedded map
Website with embedded map

If you're using Wordpress, Joomla, Drupal, BlogEngine.net, DotNetNuke, or ScrewTurn Wiki, you can get more detailed instructions and how-to videos by visiting the Code Snippet Embedding Tutorial.

Note: Your visitors will get an enhanced experience if they have Silverlight installed. But the map will still work without it.

Run Your Apps on the Microsoft Web Platform

Did you know that the most popular Web applications - like Wordpress, Joomla, Drupal, BlogEngine.net, DotNetNuke, and ScrewTurn Wiki – all run great on the Microsoft Web Platform?

Companies of all sizes are running their web infrastructure on the Microsoft platform because it’s cost efficient and provides the best ROI (see customer stories here).

Check out the Windows Web App Gallery, where you’ll be able to install, deploy, and customize these applications on the Windows Platform with just a few clicks.

Links to other resources: