Some notes

Here, we used the World Map plugin for WordPress that features clickable countries. As for championship results, we have made the following presumptions: Great Britain is marked as a champion even though four countries actually represent GB: England, Scotland, Wales, and Northern Ireland. Since England was a champion in 1966, we mark Great Britain as a champion. Also, we do not distinguish the sports results of such now non-existing countries as West Germany, East, Czechoslovakia, USSR, and Yugoslavia.

Creating a FIFA best results map

So, how can you create such a map? Assuming you have installed the plugin and familiarized yourself with its settings, the first thing you should do is create a new map in the plugin. Let’s name it “FIFA World Cup best results”. By default, the entire map has a blue color. To preview the map with its current settings, switch to the “Preview” tab. Also, on this tab, you can find a shortcode to paste the map onto any page of your website.

Change the colors of all countries to gray. Then, we will colorize individual countries that ever participated in the World Cup. Conveniently, editing countries one by one is not required – thanks to the “Bulk Edit” function you can change the color of multiple countries in one go and several clicks.

When you click the “Bulk edit” button, a checkbox form appears. Here, you can select countries to which the settings that should be applied. As you remember, we want to make all countries gray. So, we just invert the selection with the “Toggle selections” button. See the screenshot.

Now, here is what we have got:

Country Groups

Then we need to colorize countries depending on their best World Cup results. The easiest way to do this is to use our plugin’s unique feature – grouping countries. Here is how it works.

Each country ever participated in World Cup achieved one of the following results: Champion, Finalist, Semifinals, Quarterfinals, 2nd Round, 1st Round. Hence, we need to create the same groups and fill each group with appropriate countries.

A huge advantage of this method is that it allows for easy modification of the infographic whenever this is required. Indeed, adding a new participating country requires merely editing a certain group and adding the given new country to it.

So, let’s create a group. On the “Groups” tab enter the name of the first group, “Champion”, then click “Add new group”.

This will unfold the detailed settings section. Here you can select countries to include in this group by simply clicking them on the map. In different years FIFA champions were Brazil, Germany, Italy, Argentina, Uruguay, France, England, and Spain. Select them on the map.

Scroll down to the “Group settings” section. Enable the “Keep individual highlighting” option. If turned on, this option keeps the selection of each country individual when a user clicks or moves the mouse to countries in the group. Otherwise, the entire group is highlighted and selected.

In the same section configure the colors of the Champions group.

Save changes and switch to the “Preview” tab to check the result.

Looks good so far. Now, we basically need to repeat the above for other groups: Finalist, Semifinals, Quarterfinals, 2nd Round, 1st Round. Save changes and check the map on the “Preview” tab:

Wow! That’s quite impressive albeit not very informative for now. Indeed, there is a place to improve FIFA’s best results map. Let’s add a map legend somewhere on the map that would explain which color corresponds to which World Cup result. We’ll use the “Points” tab for that. Double-click the map to add a point. A typical use of points is to mark cities on the map, but we’ll use them to make a legend. Configure points so that their colors matched the colors of our groups and give them corresponding names. You can adjust fonts, and size and even assign some click action to the point (which we do not need here, though).

After adding all points, we end up with the following infographics.

Perfect! Now, we can publish the map. Or we can make it even better, for example, by adding tooltips to countries to display the years each country achieved its best result in the World Cup. You can also add a link to each country so that clicking that country would open some detailed information page with some description of matches played by the country and other related info.

This is another post about infographics in our blog. If you happened to miss the first one, here it is: «Using HTML5 US Map plugin to create infographics».

So, as you see, creating interactive infographics is quite simple when you have the right tool.

Try World map for WordPress for free

By clicking on the county, the list of the cities with a population of more than 5000 people will be displayed near the map.  Also, the color of the county in this example depends on the number of cities included.

Here you find an example of the interactive USA map including the cities with a population of more than 200.000 people.

How did we make a US map with all cities?

As well as other plugins, a bundled plugin with all US maps has functions for the export and import of CSV and JSON files. Therefore the main task was to create a script that generates the file with the pre-integrated settings for the importation into a plugin. If you have good programmers, it won’t be time-consuming.  The script processes the database with the list of the cities and compares the state and the county. Also, we added the population’s amount filter.

But what’s to be done with the automatic links adding? The client’s request was as follows – each link for the city should have the following template: / [state] / [city]
For example, Tampa will have the following link: /florida/tampa/

How can you order this customization?

Do you need an out-of-the-box solution? We are always ready to offer services in the customization of our plugins or in new plugins development from scratch.

If you already have any special requirements for your plugin, please send them through our custom development page.

Get a Customized Map from Fla-shop.com!

Car-craft repair

“Car-craft repair” is overall one of the best companies in the motor body repair industry in Australia. Undoubtedly, the best company needs a very good interactive map to place information about its local departments. Therefore, on the screenshot above you can see the Australia interactive map plugin for WordPress on the main website page. Whereas a user clicks on one state, so WordPress redirects him automatically to the page with all necessary information of local dealers. Finally, the interactive map is also fully customized so that it corresponds to the website color scheme. Good decision.

Jim’s asbestos removal

Undeniably, Interactive maps from Fla-shop.com serve for ecology purposes! Thus “Jim’s asbestos removal” is a well-known Australian company that helps to remove asbestos from materials in industrial areas, suburban stations, and so on. Surely, they used our interactive map on the main page of a corporate website to redirect a user to the local departments’ pages. The interactive map has meanwhile eye-catching colors to attract visitor’s attention.

World Day of Prayer

“Word Day of Prayer” is primarily a non-commercial organization that unites women with many faith traditions to pray together. Of course, we were glad to help them to improve the Australian website with a high-quality interactive map. As can be seen on a screenshot below, the Interactive HTML5 Map of Australia helps the website visitors to find all necessary information about the State Committees.

Fly UAS

“Fly UAS” is preeminently a company that helps to get an upcoming remote pilot license (REPL) to all interested people in Australia. The Australia Interactive map on the main page uses customized colors and points at the same time for better visualization. As in the examples above, when a user clicks on a state, the system redirects him to a page with necessary information.

NSA Lacrosse

Given these points, “NSA Lacrosse” helps the lacrosse players to find camps and clinics throughout Australia states. As in many other cases, the map fits a website color scheme.

Bullock

In addition, the authors of this website decided to use an interactive map with the grouping of states. As well as on the screenshot, two states are grouped with the same color. This is, by the way, a useful feature of our plugins, allowing us to represent the global structure of companies without efforts.

Pronto Refrigeration

“Pronto Refrigeration” is a company, which has a large department structure in Australia and New Zealand. That’s why they use customized version of our plugin.

Countplus national audits

As you can see from the screenshot, this company uses the Australia map plugin with points and pop-up windows with additional information about local representatives. The customized colors of the map and points are associated with the information in the pop-up window.

Camdec logistics

An interactive map on this corporate website has different colors. Blue for the states with the local departments of the company and black for the states without local departments. For another thing, webmasters customized the information in pop-up windows for each state and users can easily find all the necessary information.

Westpac Equipment Finance & Commercial Introducers

This website allows visitors to find all necessary information about local company representatives by a simple click on a state. Australia HTML5 Map plugin from Fla-shop.com helps to fit the website design and color scheme.

Conclusion

On the whole, these 10 examples show us the full potential of Australia HTML5 Interactive Map WordPress plugin from Fla-shop.com. The interactive map is easy to customize and has a lot of useful premium features. Using this map you can place any necessary information you need to attract more attention to your website. You can also have more visitors and potential clients.

Are you interested? Download the plugin now!