Embed linked Icon for Directions

Hello everyone!

I’m new to MapHub as of this week and I have to say so far I LOVE IT!

Anyway, I started creating a map of parking locations for our area and it has really been great. I later found out you can add web links into the description sections which I found helpful as well. But then it got me thinking how helpful a directions button would be for someone traveling to that garage/lot/etc.

So using PhotoBucket I uploaded a small Direction Icon (probably the size of the reply button on these threads maybe smaller), copy and pasted the embedded code to Notepad, went to google maps and put the address of the parking garage in the destination section, and then took that web link and used it to replace the “a href=” link in the photobucket embedded code.

Ok… So if your still with me… Haha. I was bummed to find out that it did not work in the “Description” section but soon after I was pumped to find out it worked perfectly when you put the embedded code in the “Title” section of the point created! So from there I decided to do the rest of my map points, but later found out as soon as you hit the save button every one of them disappeared! Bummer…

So what I am wondering is if anybody can think of a way to go about this to where the embedded codes will save and visitors of our area will be able to use this great map with all parking locations and a way to get directions?

I hope this isn’t something that MapHub frowns upon, but I definitely think if we can get these codes to save in the map points it will be an easy way for people to add direction links to their maps and a huge benefit to the creators and users of these awesome maps!

I look forward to any feedback and hope everyone’s having a great day!

Best Regards,

Just thought I would offer my temp solution for anybody experiencing the same issue…

The main reason I didn’t just past the link itself in the “Description” area is the links were entirely too long!!! But using the short link creator that Google offers is a quick and easy fix.

Here’s the process below:

  1. Visit: https://www.google.com/maps/dir///@27.9779746,-82.8263613,15z
  2. Leave the starting point open and type the Destination people need directions to in the destination field
  3. Right click and copy the link in your address bar
  4. Open a new window and type: https://goo.gl./
  5. Past the lengthy URL into the “Your Original URL Here” field and hit the “Shorten URL” button
  6. Copy the new shortened URL and Paste it into the Description section of your point on your map!

In my Description area I kept it simple and said “Directions Here -> Short Link.”

Hope this helps anyone in need.

  • R

It is my understanding that you copied HTML web code… MapHub uses Markdown for it’s descriptions.

There is an HTML-to-Markdown converter here: https://domchristie.github.io/to-markdown/

It should show correctly after that

1 Like

Hi Roberto,

Thanks for the nice words!

Actually allowing directions to points is something I always wanted to do! I have some great news, I’m almost done implementing it. It’ll be able to launch Google Maps or Apple Maps on iOS devices and any standard map app on Android. On a desktop it’ll just link to the Google Maps directions website.

This means you don’t have to do anything at all, it’ll be added to all MapHub points on maps.


Hi Roberto and Patrick,

I’ve implemented directions which does it for you automatically.

When you click on a point, it opens Google Maps on desktop and iOS, your favourite mapping app on Android.

Just look for this icon:

I’ll write a blog post about it later.

Thank you so much for this information. It is very useful for those like me, we do not know anything about programming.