How To Insert A Google Map Into A Thread & Post On Xenforo

Discussion in 'XENFORO Forums Guide' started by GTR-Admin, Aug 9, 2018.

  1. GTR-Admin

    GTR-Admin Ben Kemp
    Staff Member

    Joined:
    Mar 22, 2016
    Messages:
    139
    Likes Received:
    61
    Trophy Points:
    28
    Gender:
    Male
    Ratings:
    +61 / 0 / -0
    #1 GTR-Admin, Aug 9, 2018
    Last edited: Aug 12, 2018 at 10:08 AM
    Google Maps in Threads & Posts on Xenforo


    Option 1: from Google Drive

    Works with the existing BB Media Sites "Google Drive" code and requires no editing.

    Getting a Google Map to display on the forums has been a source of frustration for a long time. I had NO idea you could achieve it via Google Drive until it was demonstrated by Kevin P on the Top 10 Motorcycling Roads in North Thailand thread;

    I've actually spent hours and hours trying to find a workable Xenforo add-on app, with no success - other than the GPX Viewer app.

    Instructions for adding a Google Map from Google Drive into Xenforo:
    Note: an "image" snapshot of the map displays initially, in a new window, but clicking the "Open with Google My Maps" opens a full interactive map window.

    1.) Create the map in Google "My Maps" and set it as "public" access.
    2.) use the Insert / Media option in the menu, and select "Google Drive"

    google-embed-media.

    3.) Your Google Drive page opens - locate the map you want to share and "right-click" on it...

    g-drive-share.



    5.) Copy the "Link to Share" URL and paste that into the "Enter Media URL" in the thread or post you are editing
    6.) Click the "Insert" button

    That's it...



    Option 2: Google My Maps


    Note: this is a full-width interactive Google map, but it requires creation of a new BB Code in the Media Codes add-on app for Xenforo. Instructions for that are included at the end, for other Xenforo forum admins.

    Instruction for inserting a Google My Map into a Post


    1.) Use the Insert / Media option in the menu, and select "Google My Maps"


    4-paste-link-google-my-map.

    2.) That opens your Google My Maps page

    2-google-my-maps-list.

    3.) Click on the Map you want to insert to open it

    4.) At right of the map name, click the "triple vertical dots" menu icon

    5.)Click on "Embed on my site" option from the menu

    6.) Copy the Embed this map code

    3-embed-google-my-map.


    7.) Revert to the Thread or Post where you want to insert the map

    8.) Paste in the Embed Code and click the "Insert" button

    5-insert-map.


    Example: Mae Um Long Hot Springs Map, Mae Sariang





    Adding a new "Google Maps" BB Media Code in a Xenforo 1.5x Forum


    The URL structure may well vary depending on what kind of map you are trying to display, so the following BB CODE is specifically for My Maps that have been saved and shared as "public" access...

    After a lot of searching for forum BBCODE MAP examples and much trial and error, I finally got it to work as follows;

    Media Site ID: map
    Site Title: Google Maps
    Site URL:
    Code:
    https://www.google.com/maps/d/
    Match URLs:
    Code:
    google.com/maps/d/embed?mid={$id}
    Embed HTML:
    Code:
    <iframe src="https://www.google.com/maps/d/embed?mid={$id}" width="100%" height="450"></iframe>
     

    Attached Files:

  2. ianyonok

    ianyonok Ol'Timer

    Joined:
    Dec 9, 2008
    Messages:
    800
    Likes Received:
    292
    Trophy Points:
    63
    Ratings:
    +292 / 0 / -0
    Sounds easy......
     
  3. GTR-Admin

    GTR-Admin Ben Kemp
    Staff Member

    Joined:
    Mar 22, 2016
    Messages:
    139
    Likes Received:
    61
    Trophy Points:
    28
    Gender:
    Male
    Ratings:
    +61 / 0 / -0
    Yes, and there are now two solutions to a long-term problem...
    • Option 1 from Google Drive: the initial display in the thread or post is a snapshot "image" of the Map. At top centre, click the "Open with Google My Maps" link to display the full interactive map
    • Option 2: My Maps will work for previously saved maps that have public access set.
    I am damned if I know why the Xenforo forum software developers can't provide a proper mechanism for "embedding" a full map directly into a thread or post. For example, in the same way YouTube videos are easily inserted, for example. In this day and age, given the global reliance on Google Maps for so many things, its makes no sense to me.

    Adding a general map - as you'd have if you searched for a location / hotel / landmark etc, requires different BB Code parameters but I will have a play with that next...
     
  4. Peeto

    Peeto Ol'Timer

    Joined:
    Jun 21, 2016
    Messages:
    54
    Likes Received:
    8
    Trophy Points:
    8
    Gender:
    Male
    Ratings:
    +8 / 0 / -0
    The problem is Google change the output (link) mechanism from time to time.

    At my forum I solved it (for now) with BB code media site.

    Here is what I did. Screenshot_20180812-005224.

    Screenshot_20180812-005802.

    With this solution you need only to post the link and is converted into an embedded image.
     
  5. GTR-Admin

    GTR-Admin Ben Kemp
    Staff Member

    Joined:
    Mar 22, 2016
    Messages:
    139
    Likes Received:
    61
    Trophy Points:
    28
    Gender:
    Male
    Ratings:
    +61 / 0 / -0
    #5 GTR-Admin, Aug 12, 2018 at 9:23 AM
    Last edited: Aug 12, 2018 at 10:07 AM

    Google Maps


    Thanks Peeto

    I could not get your code example to work for previously saved Google My Maps. The goo.gl URL is the issue there - the problem being twofold;
    1. "My Maps" are located in
      Code:
      https://google.com/maps/d/
    2. Google's URL shortener is being phased out from March 2018 and will end completely by March 2019.
    However, I eventually figured out a solution, that is now included in the original post in the top of this Thread.
     
  6. Peeto

    Peeto Ol'Timer

    Joined:
    Jun 21, 2016
    Messages:
    54
    Likes Received:
    8
    Trophy Points:
    8
    Gender:
    Male
    Ratings:
    +8 / 0 / -0
    My media site is more for a general map.

    So if you search in Google map for a city, a street or a hotel Google will give you this link for sharing.

    They changed the format already some times in the past.

    I am working on a solution to post just coordinates and have it displayed as a map.

    All this give me already some Grey hairs.
     

Share This Page