Embedding your MapShare Page on Facebook

Now you can promote your next adventure on a Facebook Fan Page and provide track points so your family and friends can follow along!

facebook.comdelorme

First, you’ll need to download the free Static HTML app on Facebook to create a custom Facebook tab. To install the app visit Static HTML’s app page or search “Static HTML: iframe tabs” on Facebook. The icon for this app is a grey box with a star in the middle (see below). Select this app and click the blue Add Static HTML to a Page button. Next, select the fan page you would like to add the app to. (*Note: Facebook does not allow Static HTML iframes on personal profiles.)

Static HTML icon

Once you’ve added the app, a new Welcome tab will appear in the APPS section of the fan page you’ve selected. Click on this tab and select the green Edit button at the top of the page. Enter your HTML, CSS or Java script content and view the layout with the preview button.

To embed your MapShare page, type the following content with your custom MapShare URL found on the Social tab of your Explore account:

mapshare

MapShare View

The next step is to customize how the MapShare Tab appears on your page. Select the ‘More’ drop down underneath your cover photo and select ‘Manage Tabs’. A menu box will appear, then click ‘Add or Remove Tabs’ at the bottom. Select ‘Edit Settings’ underneath the new Static HTML: iframe tab.

Please use the Custom Tab Name and Custom Tab Image below:

Custom Tab Name:   inReach

Custom Tab Image:   Download Here

DeLorme MapShare Icon

For an example , visit The Kayak Fishing Show’s Facebook Page: www.facebook.com/kayakfishingshow

11 Responses to Embedding your MapShare Page on Facebook

  1. lior says:

    i am trying to change the tab pic but i do not see a pencil icon when i hover the star tab.

  2. DeLorme says:

    Make sure all your apps are visible otherwise you’re unable to edit them. There’s a drop down arrow to the right of your four visible apps, click on this and you will be able to see the pencil icon as you hover over the ‘star tab’.

  3. can I also embed my map into my weebly website? Thanks
    tim

  4. DeLorme says:

    Hi Tim, If you can add HTML text to your website, then yes, you can. Just use the same iframe content as above and post it to your website. – Team DeLorme

  5. trying to get it working on Beautiful Nation here http://www.beautifulnationproject.org/track-journey but i can’t seem to get the map to work as it requires sign in..

  6. DeLorme says:

    Hi Justin, We took a look at your website and everything seems to be working. If you have any further questions feel free to contact our Customer Care team at 800.511.2459. – Team DeLorme

  7. Hello,
    The iframe trick works great on my site. I would like to know if there is a way to open the URL with the controls pane being hidden (eg by passing a parameter to the URL). This would allow getting a good rendering on mobiles where 90% of the display is occupied by the left pannel.
    Thanks,
    Cyrille

  8. DeLorme says:

    Cyrille,

    Unfortunately, that’s not a currently supported feature. It’s a great feature for us to add though and this has been passed along to our web development team. Thanks for the feedback.

    -Team DeLorme

  9. Chris Grant says:

    been trying for hours to get this to work. Always get an error. I am not sure if there are spaces in the iframe string or not. Also not sure if im putting it in the right tab, should it be in the index, style, or script tab?

  10. DeLorme says:

    Hi Chris,

    If you’re embedding your MapShare onto your Facebook page, the iframe above (spaces don’t matter) should be pasted into the index.html section. Remember, the link in the iframe needs to be adjusted to include your unique MapShare name found on the Social page of your account at explore.delorme.com.

    -Team DeLorme

  11. Chris Grant says:

    OK…working now…I kept transposing the L and O in the company name. Thanks for the help!

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 151 other followers

%d bloggers like this: