Try a nearby area, or check the list in the right column. If you type your region and no code shows up, that means that the region is not available on the map. Click the green field to add the country code. Here I’m typing “Canada,” and you see the Canada selection appears in green, which includes the region code (CA). Start typing the region name in the “Region Code” field, and the region selection will pop up. In the “Name” field, add the region name. Start by clicking the “Add New Region” button. Adding a Region by Clicking the “Add New Region” Button Let’s go over each method, and you can decide which one works best for you. We can click the “Add New Region” button and search for one, or select a region from the list of those available in the right column. There are two ways to add a region to our map. The rest of the map disappears.Įntering region codes into “Exclude Regions” removes those areas from the map altogether.įor example, if we enter RU into “Exclude Regions,” Russia disappears from our map. The final default values are to include or exclude regions.Įntering region codes (more on them in a minute) into “Include Regions” displays only those regions. We’ll set the Click Action to “Open URL (new tab),” that way we can add clickable URLs to the regions. It controls what happens when a region is clicked. The next value is “Click Action,” and we are going to change that. You’ll see the list of default values starting with fill, hover, and empty colors. Looks nice, but it doesn’t do anything when we mouseover or click. If we saved the map before defining regions, it would be visible, but there wouldn’t be any interactive elements. This is where we add interactivity to the map. I’m going to leave the default settings here, but you can change: Here’s where you set some of the map display options. Since we’re just making one, I’ll leave that blank. You can add a description to the “Description” field to help you keep track of multiple maps. But if you prefer a Mercator projection, that’s available, as well as AlbersUSA, if you’re working with a map of the United States. The “Miller” setting is the default projection, and I’m going to leave that be for now. The “Projection” setting changes the way the map is represented. A busy site or a site with a lot of mobile traffic will benefit by using the smaller (“Low”) files.įor this demonstration, I’m going to use “World Great Lakes Ultra.” The “Ultra” files are even larger than the “High” files, but since this isn’t a live site, it’s okay. You’ll have to decide how to balance detail vs. So, of course, the “High” image will take longer to load. The “High” version of the map requires a larger file than the “Low” version. Scroll down the “Add New Map” page to the “Map Settings” section.Ĭlick the “Map to display” drop-down to see the available maps.Īs you’ll notice, there are at least two versions of most maps, “High” and “Low.” That refers to the detail contained in the map image. But there are hundreds of maps available to choose from. Select a Region Mapīy default, the plugin displays a world map. Now, let’s choose what’s shown on our responsive vector map.

In the left column navigation, mouse over the “Maps” link and click the “Add New” link. While those are the only required steps, we’ll also add markers to highlight specific locations inside a region. Once you have located the plugin, click the “Install Now” button.Ĭreating a new vector map only requires a few steps. In the “Search plugins…” box, enter, “Interactive Geo Maps.” In the left column navigation, mouse over the “Plugins” link and click the “Add New” link. Nothing unusual here, just follow the usual plugin installation steps. Installing the Interactive Geo Maps Plugin Let’s go through the steps for creating a map so you can see how it works. You can customize the appearance of regions, add tooltips, even add URLs to regions to make them clickable. You can do it in 15 minutes, without an API or fiddling with additional scripts. But now there’s an excellent (and free!) plugin that does a beautiful job of vector mapping it’s called Interactive Geo Maps.Ĭreating a world subdivisions map, or a map of a specific country with Interactive Geo Maps is easy. There were a small handful of map plugins, but none that did the job without a lot of configuration, or again, API connections. Editing vector files, using APIs, or installing Javascript libraries – adding a responsive map became complicated very quickly. In the past, adding a vector map to a WordPress site has been a complicated task.

Vectorial map