Mapsvg plug-in: interactive maps for WordPress

Easy), create image maps, upload or SVG files. The SVG file comes with Google maps. If you need help creating a map, you can click the tutorials or support links at the top of the control panel for quick help. Let’s select one of the existing maps. I want to go with China. Anyway, they have been made there recently, so n\/b: the developer suggests to replace the unmodified map with the geographically modified map. Because… The geographically modified map is updated with a region title, you can simply add a marker to the geographic coordinates (latitude \/ longitude) or enter an address that is automatically converted to coordinates. – Select China (or other desired map) from the mapsvg tutorial new SVG map drop-down menu. If you don’t like scrollbars, you can use the search window. Male or female fill in the title on the next screen and change the preloaded text if necessary. Set the map size on the same screen, turn off reactive design (open by default, so do not touch the dial), and most importantly, open tooltips and pop-up windows. You can also see that the map has been divided into regions (in this case, Chinese regions) and can be clicked! Also, familiarize yourself with other controls, including menu drop-down menus. Change some colors to feel the plug-in. Navigate to Menu > colors as follows: The color screen helps you choose the color of your dreams. I mean, there is no limit to the colors you want to use. Use the color selector until you find the desired color. Because WordPress is BAE, it will use blue shadow. Select a color and don’t forget to press the save ctrl+s button, as shown in the following figure. Than? I said mapsvg is easy to use. Several clicks have changed the color of the map, and I am in a good mood. Just like when I ranked first in Google a few years ago, I was in a good mood. Editing the rest of the map is just as easy. To prove my point, I think it will be interesting, so I want to add tooltips. If you add tooltips to mapsvg, how do you add tooltips that appear when you hover over a map area? That’s easy. I’ll tell you that later. By the way, if there is anything unclear for some reason, please do not hesitate to check the official mapsvg tutorials and documentation. A better way is to click on the comments section at the end of the post. Then I will summon Thor for you. In addition to solving all the problems, the hammer must add templates to add tooltips (remember the template editor mentioned earlier?) To do this, navigate to Menu > Templates and select area tooltips. Male then add the following code in the template editor and press the save ctrl+s button above. Province: the above code is simple HTML with handlebars tag. To display only regional titles, use the {{title}} tag. You can also define custom fields to be learned. However, let’s turn on the tooltip function first. Go to Menu > settings and open the tooltip function, as shown in the following figure. As can be seen from the screenshot above, the tooltip is active. Nonetheless, we’ll show you how to add custom fields to enrich tooltips in ways you can’t imagine. Suppose you want to add photos and more information to the tooltip. What would you like to do? To do this, call the previously mentioned database object. You can add a custom field to a map by adding a custom field mapsvg to a database object. Although the field {title}} already exists, let’s see how to add more custom fields. Custom fields, including text, text area, check box, image, etc
. I want to add an image in the Nei Mongol area. Navigate to the menu > area and click the edit field button as highlighted in the following image. On the next screen, press the image button shown below, and then press the save field button. Click the ctrl+s save button to save the changes. Always remember to save your changes. Then press the list button, as shown in the following figure. Male convert the map to region editing, and click region (we selected Nei Mongol). A new custom field (image) must be displayed on the right. Click the Browse button. See the image below. Add an image on the next screen, and then click the select image button. Male confirm (1) redirect to the area editing screen where the button needs to be clicked. Click Save as ctrl+s (2) and return to preview (3) mode, as shown below: At this time, move the mouse over Inner Mongolia, and no image will appear on the tooltip. What’s the matter. Well, we didn’t create a template for the image. Try it at this moment. Navigate to Menu > Templates > area tooltips and make the following changes to your code: Province: androg {{titl} androg first image: androg all images: androg {\each image} androg {\/\/each} the following images are for further explanation. Don’t forget to press the Save button. Male now move the mouse over the selected region (Nei Mongol in this case). Tell me what you saw. This is on my screen. Is it clean? You learned how to add custom fields to a mapsvg map. Adding Popover and tags is as easy as pie. In addition, if you know these basics, it is recommended that you create interactive maps \/ footprints in the sun. Working with mapsvg is the work of fourth grade students, because Roman Stepanov provides excellent support and amazing guidance through the tutorial. To display a map on the WordPress site, save your changes and go to page> add. Then press the mapsvg button above to select the map. This will add the shortcut code [mapsvg id= \

Author:

Leave a Reply

Your email address will not be published. Required fields are marked *