Since February 2016 both WordPress and jQuery versions of MapSVG have the same MapSVG Map Builder and they share almost identical functionality so there is one common documentation for both versions. If you have jQuery version of MapSVG Builder and you still want to dive into the code, there is a special jQuery documentation. Download ZIP file from CodeCanyon and unpack it. You will get a mapsvg folder containing all plugin files. Upload it to your plugins folder (default path is /wp-content/plugins). Then go to your WP Admin Panel, choose Plugins >, Installed plugins >, MapSVG >, click ‘Activate’. MapSVG menu item will appear in menu on the left. Just overwrite /wp-content/plugins/mapsvg folder with new version of MapSVG. Don’t remove your previous installation or you will lose your custom maps and markers. Then go to MapSVG control panel: migration script will start and it will update all your maps to the new version. Just put mapsvg folder with all its contents anywhere on your server. Then enter http://yoursite.com/path-to/mapsvg/ to get started. If you have PHP mode turned ON – you need to change access rules for …/mapsvg/maps/user-uploads to 777. SVG maps are located in /wp-content/plugins/mapsvg/maps folder. Plugin scans that folder each time you open MapSVG Control Panel to get the full list of available maps. Click on the search box on the start screen of MapSVG Builder and start typing the name of map you need. If you have PHP mode ON – just start typing the name of map you need in the search box on the start screen of MapSVG builder, or upload a custom SVG file from your browser. If you have PHP mode OFF – enter URL of a SVG file and click ‘Go’. If you want to upload custom SVG file – put it into /mapsvg/maps/user-uploads folder. Also you’re able to edit the map you have previously created in MapSVG and inserted into your website. To do that, just enter URL of that page on the start screen of MapSVG Builder and it will get map settings from that page automatically. On: the map will always take all available width of its container, keeping width/height ratio defined above. off – don’t use global popovers function – custom JS function which should return a string. Example: off – don’t use global tooltips SVG id – show Region ID defined in SVG file or in case of a Marker – ID defined in MapSVG Builder. SVG title – show Region title defined in SVG file. Shows nothing for a Marker. function – custom JS function which should return a string. Example: on | off – use it to represent statistical information by every Region on your map with different shades of a color: population, income, fuel prices, etc. Such maps are called Choropleth Maps (link opens Wiki in new tab). To get an idea how it works, turn Gauge on and then switch to Regions tab and set gaugeValue for a few Regions. ID of menu container. You have to add empty <,ul id=’id_example’>,<,/ul>, container anywhere on your page by yourself. Then MapSVG will fill it automatically with list of active (not disabled) Regions. If a map is geo-calibrated, you will see New Marker input field in Markers tab. Just enter an address and marker will be added to the map. Also you can add a Marker if you switch the map to Edit Markers mode: click on the map to add a marker. One of the most important features of MapSVG is that you can always draw your own map or floorplan in any vector editor which is able to export images in SVG format – Adobe Illustrator, InkScape, Corel Draw, etc. Remember that you are not limited to maps – you can add interactivity to any vector image. Most of the time custom SVG files are working ‘out of the box’ – just upload an image to MapSVG and you’re ready to go. However there are few things you need to keep in mind: Source.