How can we help?

Embedding in wordpress Site

Answered
Follow
Avatar
Nigel Farnfield

I want to embed the track of a single vessel in my Wordpress site, but my knowledge is very limited. I have acquired an API key for Single Vessel Track, but am at a loss on what to do next. I have searched your site for an answer, I have tried using the embed code listed on one of your pages, change the mms to the one I want, but that does not work, and have spent a few hours googling for an answer.
I am sure it is not that difficult I just don't know where to look.
Your assistance would be hugely appreciated
Regards
Nigel

1

Comments

12 comments

Sort by Date Votes
  • Official comment
    Avatar
    Christiana

    Dear Jesse. 

    Thank you for your post.

    Please note that, at the top left corner of the embedded map, there is a magnifying glass. 
    You may click on that and a search bar will appear (similar to the one in the MarineTraffic website) and this is a default option in our embedded map.

    Kindly try to add our embedded map in your page of preference and you may check to see if this option appears.
    In the event it does not, please let me know so that I may investigate this further.

    I hope this helps.
    Should you need anything else, please do not hesitate to ask.

    Kind Regards,

    Comment actions Permalink
  • Avatar
    Vasilis Kontas

    Hello Nigel,
    You can use the script of our embedded map as you can see here:
    http://www.marinetraffic.com/en/p/embed-map
    In order to track one specific vessel please use the script below:
    <script type="text/javascript">
    width='100%'; // the width of the embedded map in pixels or percentage
    height='450'; // the height of the embedded map in pixels or percentage
    border='1'; // the width of the border around the map (zero means no border)
    shownames='false'; // to display ship names on the map (true or false)
    latitude='37.4460'; // the latitude of the center of the map, in decimal degrees
    longitude='24.9467'; // the longitude of the center of the map, in decimal degrees
    zoom='9'; // the zoom level of the map (values between 2 and 17)
    maptype='1'; // use 0 for Normal Map, 1 for Satellite, 2 for OpenStreetMap
    trackvessel='0'; // MMSI of a vessel
    </script>
    <script type="text/javascript" src="//www.marinetraffic.com/js/embed.js"></script>
    Note that I have removed the Fleet order, since you are interested in tracking one specific vessel. Note that the vessel will be displayed only if it is within range of the system. This order overrides "zoom" option, so as for the map to zoom in the specific vessel.
    Please check and confirm.
    I look forward hearing from you.
    Best regards,

    1
    Comment actions Permalink
  • Avatar
    Nigel Farnfield

    Thank you for your reponse. I don't seem to be able to post a reply to your answer, so I will put it here!
    I used this code yesterday and got it working thank you, but I needed to show the track also, which is why I then looked at potentially using the API. Is there a way to add to this code to show the track for the previous x number of hours and also remove the big picture of the ship rather than having to click the x.
    If I explain the reason maybe that will help. My daughter is swimming the channel this week and I would like friends and family to be able to follow her progress. I know this is possible by going to the Pilots page on the Channel Swimming Association site, but in an ideal world I would like it all on her website, just to make life easier for everyone as they will see updates and photos being posted too, all in the same place.

    0
    Comment actions Permalink
  • Avatar
    Vasilis Kontas

    Hello Nigel,
    Glad to hear that you don't face any issue regarding our Embed Map.
    I have replied to your email providing further information.
    Best regards,

    0
    Comment actions Permalink
  • Avatar
    Daniel Sperling

    Hello,

    i have the same problem like Nigel. I use this code in my wordpress site:

    <script type="text/javascript">
    width='100%'; // the width of the embedded map in pixels or percentage
    height='450'; // the height of the embedded map in pixels or percentage
    border='0'; // the width of the border around the map (zero means no border)
    shownames='false'; // to display ship names on the map (true or false)
    latitude='37.4460'; // the latitude of the center of the map, in decimal degrees
    longitude='24.9467'; // the longitude of the center of the map, in decimal degrees
    zoom='9'; // the zoom level of the map (values between 2 and 17)
    maptype='1'; // use 0 for Normal Map, 1 for Satellite, 2 for OpenStreetMap
    trackvessel='211792170'; // MMSI of a vessel (note: vessel will be displayed only if within range of the system) - overrides "zoom" option
    fleet='dsperling@web.de'; // the registered email address of a user-defined fleet (user's default fleet is used)
    </script>
    <script type="text/javascript" src="//www.marinetraffic.com/js/embed.js"></script>

    but it does not work. All what i get is a blank site.  http://sparrow-charter.de/schiffsposition/

    Can someone help me? Please.

    Regards

    Daniel

    0
    Comment actions Permalink
  • Avatar
    Vasilis Kontas

    Hello Daniel,

    Thank you for your comment.

    Please accept my sincere apologies for my late reply.

    As I can see from the script you are using, you have added both the "trackvessel" and the "fleet" option.

    Can you please be kind enough to let me know if you are interested in displaying just the vessel with MMSI: 211792170 or your whole Fleet?

    Thank you in advance for your reply.

    I look forward to hearing from you.

    Kind regards,

    0
    Comment actions Permalink
  • Avatar
    Mirko Demoro

    i have the same problem I need to embed my fleet in a wordpress , can you help me ?

    0
    Comment actions Permalink
  • Avatar
    Vasiliki

    Hello Mikro,

    Thank you for contacting MarineTraffic.

    You can use the script of our embedded map as you can see here:
    http://www.marinetraffic.com/en/p/embed-map

    In order to track your Fleet please use the script below:
    <script type="text/javascript">
    width='100%'; // the width of the embedded map in pixels or percentage
    height='450'; // the height of the embedded map in pixels or percentage
    border='1'; // the width of the border around the map (zero means no border)
    shownames='false'; // to display ship names on the map (true or false)
    latitude='37.4460'; // the latitude of the center of the map, in decimal degrees
    longitude='24.9467'; // the longitude of the center of the map, in decimal degrees
    zoom='9'; // the zoom level of the map (values between 2 and 17)
    maptype='1'; // use 0 for Normal Map, 1 for Satellite, 2 for OpenStreetMap
    fleet=' '; // the registered email address of a user-defined fleet (user's default fleet is used)
    </script>
    <script type="text/javascript" src="//www.marinetraffic.com/js/embed.js"></script>

    Note that I have removed the trackvessel order, since you are interested in tracking your Fleet and not a specific vessel. Further to that, if you want to track a different Fleet than your Default one, please add the Fleet ID instead of your email address.

    This order overrides "zoom" option, so as for the map to zoom in the selected Fleet.

    Please check and confirm if this works for you.
    I look forward hearing from you.

    Best regards,

    0
    Comment actions Permalink
  • Avatar
    Jesse Varis

    Hi, I'm having a little different problem, I would like to have a search bar in my map, where you can search for a specific vessel, is it possible to embed that in the code?

    0
    Comment actions Permalink
  • Avatar
    K C

    How do I find the Fleet ID so that I can display a fleet which is not the default?

    0
    Comment actions Permalink
  • Avatar
    Aline

    Hello KC,

    Thank you for reaching out.

    You may go here:

    https://www.marinetraffic.com/en/data/?asset_type=vessels&columns=flag,shipname,photo,recognized_next_port,reported_eta,reported_destination,calculated_eta,current_port,imo,ship_type,show_on_live_map,time_of_latest_position,lat_of_latest_position,lon_of_latest_position,fleet,notes

    then choose your Fleet from the "Select a Quick View" option and your Fleet ID will be shown in the end of the url link of your browser.

    Please let me know if you have any questions.

    Best,

    0
    Comment actions Permalink
  • Avatar
    Tarlan Isaev
    • Edited

    Hi folks,

    Hope everyone is doing well :)

    Thanks so much for the helpful topic :)

    Could you pls help with this scaling issue by any chance? When I scale over the 110% the layout goes under the menu. How can I stop this from happening? :)




    Using Elementor HTML code element with this code:

    <script type="text/javascript">
    width='100%'; // the width of the embedded map in pixels or percentage
    height='960'; // the height of the embedded map in pixels or percentage
    border='1'; // the width of the border around the map (zero means no border)
    shownames='false'; // to display ship names on the map (true or false)
    latitude='54.9914'; // the latitude of the center of the map, in decimal degrees
    longitude='73.3645'; // the longitude of the center of the map, in decimal degrees
    zoom='4'; // the zoom level of the map (values between 2 and 17)
    maptype='1'; // use 0 for Normal Map, 1 for Satellite, 2 for OpenStreetMap
    trackvessel='0'; // MMSI of a vessel
    </script>
    <script type="text/javascript" src="//www.marinetraffic.com/js/embed.js">
    </script>

    Thank you :)

    0
    Comment actions Permalink

Please sign in to leave a comment.

Didn't find what you were looking for?

New post