Skip to main content

Adding Images & IFrames to your Map Points

What are we talking about here?

So let’s say you have a map that depicts all of the countries you have visited.  It’s one thing to have a pin in France and show “Paris, 2008” in the pop up bubble, but it would be a heck of a lot cooler if you could click on that pin and see an image of you next to the Eifel Tower.

Alternatively, maybe you’re looking to provide some information about France to the person looking at the map.  The ability to integrate an IFrame into the pin pop up bubble makes it easy to show the user a fully functional website about French tourism when they click on the pin.

If you followed the couple tutorials that talked about hyperlinks, e-mail and Skype this should be a piece of cake…

What does it look like from a spreadsheet perspective?

Just like our last 2 tutorials, the key here is all in the way you enter data into your Google Spreadsheet.  Again, a bit of HTML is all you need.  

Take a look at the second column in the spreadsheet titled Image.  It contains the HTML required to place an image in your pin pop up bubble.

The third column (you will have to scroll right), titled IFrame, contains the HTML required to display an IFrame in your pin pop up bubble.  

Feel free to us the CONCATENATE function to make life easier if you want as explained in the a previous post (Adding Hyperlinks to Your Map Points).

The HTML, while a bit more complex than that needed to produce e-mail and Skype links, is still relatively self explanatory.  In both cases, all you are doing is providing the location of the Image/IFrame.  The IFrame requires some sizing – feel free to play with that to make it appear how you like it. 

You guessed it - from here, all you have to do is assign your fields in Step 2b of the map creation process and you're good to go.  If you have questions feel free to post to the help forum.

What does it look like from a map perspective?

As you might expect, we see the 2 pins plotted on the map below.  When you click on the pin in France you will see an image of the French flag (sorry, I didn’t have a picture of you next to the Eifel Tower).  

Okay, now try clicking on the other pin – which happens to be in Israel.  Give it a second because just like any web page it takes a second to load.  Cool, right – you actually see a website in the bubble with tourist info.

Your toolbox should be starting to fill up now…have fun with it,

--The Map Commissioner (E-mail)

Popular posts from this blog

New Video Tutorials (Updated)

We decided to experiment and create some video tutorials in the hope they might be more effective instruction and better at getting the word out about what features exist in mapalist and how to utilize them. We hope you find value in the first few we put out. Creating your First Map Using Custom Icons Starting from an Excel Sheet Editing your Maps, Post-Creation Syncing your Map and Google Sheet

Allow your Member/User Base to Add Pins to your Map Using Google Forms

As the MapAList user base has grown over the past couple of years, one of the things we’ve noticed is that we have a ton of organizations leveraging our toolset to map their member/user bases. Religious organizations use MapAList to track their congregations; alumni associations use MapAList to track their members; campaigns and non-profits use MapAList to track their supporters/donors…you get the point. The reason I bring this up is because a few of these organizations have gotten smart and realized that they could push the work of updating their maps out to the user based directly using Google Forms. It’s like self check-out at the grocery store – the users love it because they are empowered (and because it’s a novelty to scan those barcodes) and so does the store because it reduces labor. Sounds cool – right? Well, implementing such a solution on your site with MapAList is not terribly difficult. Those folks at Google have made Google Forms easy to design and feed to a G

Adding Hyperlinks to Your Map Points

What are we talking about here? The ability to visualize a list of addresses on a map is definitely useful - and it's what we're all about here at MapAList.  Leveraging hyperlinks within maps makes them even more interactive for you and your users.   In this first post about hyperlinks, the goal is to show you how to associate a link to a website with a pin on your map.  This will allow whomever is viewing your map to click on a pin and see hyperlinks in the bubble that pops up. Furthermore, it will enable the viewer to click on the hyperlinks to navigate to a URL directly from the map.  Sound cool?  It is.  Sound hard?  Don't worry, we'll walk you through it... What does it look like from a spreadsheet perspective? There are 2 approaches to making this work, one certainly more efficient if you are dealing with multiple address records. In the sample spreadsheet below, you can see a column called Site  which is used to associate the address with a website (URL).