Joomla Installation | Documentation

You can install any of our maps on the Joomla platform. Just follow these steps:

1. First, choose the map you want to install
   HTML5 World Map HTML5 US Map HTML5 Canada Map HTML5 North America Map HTML5 County Map HTML5 Congress Map HTML5 State Map HTML5 Custom Map HTML5 Europe Map HTML5 UK Map HTML5 Australia Map HTML5 Country Map

2. Customize your map using our online customization tool.

3. Host your map files on SimpleMaps.com (detailed instructions). Note: You could also self-host the map files by uploading the mapdata.js and worldmap.js files to your server over FTP. However, it is simpler to use our hosting.

4. Copy the embedding code from the online customization tool. It should look something like this:

   <script src="https://hosting.simplemaps.com/users/RANDOM_ID/mapdata.js"></script>
   <script src="https://hosting.simplemaps.com/users/RANDOM_ID/worldmap.js"></script>
   <div id="map"></div>

5. Login to the Joomla admin (http://yoursite.com/joomla/administrator/index.php).

6. By default, the Joomla editor will strip out any <script> tags that you paste into an Article. So, we need to temporarily turn off the Joomla editor. To do this, click System Global Configuration.

   

7. In the Site Settings, change the Default Editor to Editor - None and then Save your changes.

   

8. It's now possible to paste the embedding code from Step 4 into an Article and the map will appear. Feel free to do this if you just want to quickly verify the map will work.

   However, if you ever re-enable the editor and make changes to your Article, the embedding code will be removed and the map will disappear. Therefore, we recommend adding the map as a Module. Then, you can re-enable the editor, add the map Module to your Article, and still be able to edit the Article without losing the map.

9. To create a Module for your map go to Extensions Modules

   

10. Click New to create a new Module.

    

11. Scroll down and choose Custom Module.

    

12. Give the module a Title of Map. Paste the embedding code from Step 4 into the text box. Finally, Save your changes.

    

13. Go back and re-enable the editor via System Global Configuration, change the Default Editor to Editor - TinyMCE and then Save your changes.

    

14. Finally, we can add the map to an article. Go to Content Articles and edit an existing Article or create a new one.

    

15. Click on the Module button...

    

16. ...and select the Map Module.

    

17. You should see the following shortcode added to your Article.

    {loadmodule mod_custom,Map}

    Save your changes.

    

18. Navigate to the Article on your website. Your map will be visible!

    

19. If you have trouble, or need help, please contact us.