Can I embed the RealTime live map on my transit agency's website?

Absolutely! Follow the steps below!

  1. Head over to Replace demo with your agency's slug (e.g. demo for
  2. Read and follow the instructions:
    1. The special embedded version will expand to fit your page, letting your riders see as much as possible. Minimum map dimensions are 600 pixels wide by 500 pixels high.
      If your page does not have a white background, begin by inserting this into your page (replace the value for transloc_bgcolor with your HEX color):
      <script type="text/javascript">
      var transloc_bgcolor = 'EEEBE2';
    2. Finally, insert the following HTML code into your page (below the prior code if you inserted it):​
      <!-- TransLoc Real-Time Tracking - DO NOT EDIT BELOW -->
      <script src="" type="text/javascript"></script>
      Track your ride online with the TransLōc Real-Time Tracking app.  See in real-time where all vehicles are.<br />
      Choose your map mode:
      <a href="" title="The live location map">TransLōc Real-Time Tracking</a> |
      <a href="" title="TransLōc Tracking for your mobile phone">Mobile Access</a> |
      <a href="" title="An accessible Tracking app">Text Version</a> |
      <a href="" title="Read announcements that are impacting service">Announcements</a>
      <!-- TransLoc TVS - DO NOT EDIT ABOVE -->
  3. Again, remember to replace demo with your agency's slug.
  4. Please contact us at if you have any questions or require assistance.

Did you find this article helpful?