{"id":845,"date":"2018-12-29T09:04:35","date_gmt":"2018-12-29T09:04:35","guid":{"rendered":"https:\/\/www.fla-shop.com\/blog\/?p=845"},"modified":"2022-06-13T03:30:04","modified_gmt":"2022-06-13T03:30:04","slug":"howto-customize-font-interactive-map","status":"publish","type":"post","link":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/","title":{"rendered":"How to customize the font for an interactive map?"},"content":{"rendered":"\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<h2 class=\"wp-block-heading\">Contents<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li><a href=\"#header2\">Use any font for interactive maps from Fla-shop.com<\/a><\/li><li><a href=\"#header3\">How to use fonts already included in WP theme?<\/a><\/li><li><a href=\"#header4\">How to use any of Google Fonts in the map? Step-by-step instruction.<\/a><\/li><li><a href=\"#header5\">Conclusion<\/a><\/li><\/ul>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Use any font for interactive maps from Fla-shop.com<\/h2>\n\n\n\n<p>Thankfully, the interactive maps from Fla-shop are filled with customization options, including settings to help you change the font of all the text on the maps.<\/p>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<link href=\"https:\/\/fonts.googleapis.com\/css?family=Gloria+Hallelujah\" rel=\"stylesheet\">\n<!-- start HTML5 Map --><div id=\"map-container\"><\/div><link href=\"\/blog\/wp-content\/uploads\/2018\/maps\/worldcontinents\/map.css\" rel=\"stylesheet\"><script src=\"\/blog\/wp-content\/uploads\/2018\/maps\/worldcontinents\/raphael.min.js\"><\/script><script src=\"\/blog\/wp-content\/uploads\/2018\/maps\/worldcontinents\/settings.js\"><\/script><script src=\"\/blog\/wp-content\/uploads\/2018\/maps\/worldcontinents\/paths.js\"><\/script><script src=\"\/blog\/wp-content\/uploads\/2018\/maps\/worldcontinents\/map.js\"><\/script><script>var map = new FlaMap(map_cfg);map.drawOnDomReady('map-container');<\/script><!-- end HTML5 Map -->\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<p>For the purpose of this read, we have put together a step-by-step guide on how to change the font styles of an interactive map. So without further ado, let&#8217;s get started:<\/p>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<h2 class=\"wp-block-heading\">How to use fonts already included in WP theme?<\/h2>\n\n\n\n<p>Now, if you are looking forward to changing the font style of the interactive maps to match the typography of your site, then it would be best to use the fonts that come with the WP theme you are using.<\/p>\n\n\n\n<p>To use any system font or font that is already used in the WordPress template, simply paste the font name in the appropriate field.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/font-family-settings-1.png\" alt=\"Font settings for interactive map\"\/><\/figure>\n\n\n\n<ol class=\"wp-block-list\"><li>Font-family for names on the map<\/li><li>Font-family for pop-up names<\/li><li>Font-family for text inside the tooltip<\/li><\/ol>\n\n\n\n<p>And just by following these three simple steps, you will be able to change the font style on your interactive map. But what if you don&#8217;t want to limit yourself to only using the fonts included with your WP theme?<\/p>\n\n\n\n<p>Well, Fla-shop.com interactive maps help you use Google Fonts as well.<\/p>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<h2 class=\"wp-block-heading\">How to use any of Google Fonts in the map? Step-by-step instruction.<\/h2>\n\n\n\n<p>If you want to use any of the Google fonts that are not used in your WP site, then below will be step by step instructions.<br>To connect Google fonts, you can use any of the plugins, for example, Easy Google Fonts <a href=\"https:\/\/wordpress.org\/plugins\/easy-google-fonts\/\">https:\/\/wordpress.org\/plugins\/easy-google-fonts\/<\/a><br>Install and activate this plugin.<\/p>\n\n\n\n<p>Below are the steps how to connect any font to the map.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 1.<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/easy-google-fonts-0.png\" alt=\"Step 1\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 2.<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/easy-google-fonts-2.png\" alt=\"Step 2\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 3.<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/easy-google-fonts-3.png\" alt=\"Step 3\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 4.<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/easy-google-fonts-4.png\" alt=\"Step 4\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 5.<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/easy-google-fonts-5.png\" alt=\"Step 5\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 6.<\/h3>\n\n\n\n<ol class=\"wp-block-list\"><li>Open the &#8220;General settings&#8221; tab<\/li><li>Font-family for names on the map<\/li><li>Font-family for pop-up names<\/li><li>Font-family for text inside the tooltip<\/li><\/ol>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/font-family-settings-2.png\" alt=\"Step 5\"\/><\/figure>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<h2 class=\"wp-block-heading\">Result. Map with customized fonts<\/h2>\n\n\n\n<link href=\"https:\/\/fonts.googleapis.com\/css?family=Indie+Flower\" rel=\"stylesheet\">\n\n\n <!-- start Fla-shop.com HTML5 Map --> <div class='usaHtml5Mapbottom htmlMapResponsive' style='max-width:980px; width: 100%'><div id='usa-html5-map-map-container_0' class='usaHtml5MapContainer' data-map-variable='usahtml5map_map_0'><\/div><div style='clear:both; height: 20px;'><\/div> <style> #usa-html5-map-map-container_0 { } #usa-html5-map-map-container_0 .fm-tooltip-name { color: #000000; font-size: 24px; font-family: 'Indie Flower'; } #usa-html5-map-map-container_0 .fm-tooltip-comment { color: #a01915; font-size: 14px; font-family: 'Indie Flower'; } #usa-html5-map-map-container_0 .fm-tooltip-comment p { color: #a01915; font-size: 14px; font-family: 'Indie Flower'; } @media only screen and (max-width: 480px) { #usa-html5-map-map-container_0 { float: none; width: 100%; } } <\/style><script type=\"text\/javascript\"> jQuery(function(){ var hightlighted = null; usahtml5map_map_0 = new FlaShopUSAMap(usahtml5map_map_cfg_9); usahtml5map_map_0.draw('usa-html5-map-map-container_0'); usahtml5map_map_0.on('mousein', function(ev, sid, map) { if (hightlighted && sid != hightlighted) { map.stateHighlightOut(hightlighted); hightlighted = null; } }); var html5map_onclick = function(ev, sid, map) { var cfg = usahtml5map_map_cfg_9; var link = map.fetchStateAttr(sid, 'link'); var is_group = map.fetchStateAttr(sid, 'group'); var popup_id = map.fetchStateAttr(sid, 'popup-id'); var is_group_info = false; if (typeof cfg.map_data[sid] !== 'undefined') jQuery('#usa-html5-map-selector_0').val(sid); else jQuery('#usa-html5-map-selector_0').val(''); if (is_group==undefined) { if (sid.substr(0,1)=='p') { popup_id = map.fetchPointAttr(sid, 'popup_id'); link = map.fetchPointAttr(sid, 'link'); } } else if (typeof cfg.groups[is_group]['ignore_link'] == 'undefined' || ! cfg.groups[is_group].ignore_link) { link = cfg.groups[is_group].link; popup_id = cfg.groups[is_group]['popup_id']; is_group_info = true; } if (link=='#popup') { if (typeof SG_POPUP_DATA == \"object\") { if (popup_id in SG_POPUP_DATA) { SGPopup.prototype.showPopup(popup_id,false); } else { jQuery.ajax({ type: 'POST', url: 'https:\/\/www.fla-shop.com\/blog\/' + 'index.php' + '?map_id=9' + '&usahtml5map_get_popup', data: {popup_id:popup_id}, }).done(function(data) { jQuery('body').append(data); SGPopup.prototype.showPopup(popup_id,false); }); } } else if (typeof SGPBPopup == \"function\") { var popup = SGPBPopup.createPopupObjById(popup_id); popup.prepareOpen(); popup.open(); } return false; } if (link == '#info') { var id = is_group_info ? is_group : (sid.substr(0,1)=='p' ? sid : map.fetchStateAttr(sid, 'id')); jQuery('#usa-html5-map-state-info_0').html('Loading...'); jQuery.ajax({ type: 'POST', url: (is_group_info ? 'https:\/\/www.fla-shop.com\/blog\/' + 'index.php' + '?map_id=9' + '&usahtml5map_get_group_info=' : 'https:\/\/www.fla-shop.com\/blog\/' + 'index.php' + '?map_id=9' + '&usahtml5map_get_state_info=') + id, success: function(data, textStatus, jqXHR){ jQuery('#usa-html5-map-state-info_0').html(data); }, dataType: 'text' }); return false; } if (ev===null && link!='') { if (!jQuery('.html5dummilink').length) { jQuery('body').append('<a href=\"#\" class=\"html5dummilink\" style=\"display:none\"><\/a>'); } jQuery('.html5dummilink').attr('href',link).attr('target',(map.fetchStateAttr(sid, 'isNewWindow') ? '_blank' : '_self'))[0].click(); } }; usahtml5map_map_0.on('click',html5map_onclick); }); <\/script><div id='usa-html5-map-state-info_0' class='usaHtml5MapStateInfo'><\/div> <\/div> <div style='clear: both'><\/div> <!-- end HTML5 Map --> \n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>As you can see, it is extremely easy to customize the font used by the interactive maps from Fla-shop.com. You get all the options, from using the fonts that come with your WP theme, to using different Google Fonts, the options are immense. This can really help you to get your entire site&#8217;s typography on the same page, and improve the overall user experience.<\/p>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group article_sm_block\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<p class=\"has-text-align-center\"><a class=\"greenbutton\" href=\"https:\/\/www.fla-shop.com\/products\/wp-plugins\/united-states\/us\/\">Get try-for-free customizable US map for WordPress<\/a><\/p>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Have you paid any attention to the font style you are using with your interactive maps? it can be awfully off-putting if the maps come with a different font style which is unsynchronous with your site. It can affect your site&#8217;s aesthetics and hamper user experience. <\/p>\n","protected":false},"author":1,"featured_media":1352,"comment_status":"open","ping_status":"open","sticky":false,"template":"post1.php","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2],"tags":[],"class_list":["post-845","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to customize the font for an interactive map? Step-by-step guide.<\/title>\n<meta name=\"description\" content=\"Fla-shop.com maps come with a lot of customization options to fine-tune its design. Here we will discuss how you can change the font for an interactive map.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to customize the font for an interactive map? Step-by-step guide.\" \/>\n<meta property=\"og:description\" content=\"Fla-shop.com maps come with a lot of customization options to fine-tune its design. Here we will discuss how you can change the font for an interactive map.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/\" \/>\n<meta property=\"og:site_name\" content=\"Fla-Shop.com\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/flashopcom\/\" \/>\n<meta property=\"article:published_time\" content=\"2018-12-29T09:04:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-06-13T03:30:04+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/custom-fonts.png\" \/>\n\t<meta property=\"og:image:width\" content=\"600\" \/>\n\t<meta property=\"og:image:height\" content=\"315\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@flashop\" \/>\n<meta name=\"twitter:site\" content=\"@flashop\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#\\\/schema\\\/person\\\/16214725e757dd92d37dbfe3e2a5db1e\"},\"headline\":\"How to customize the font for an interactive map?\",\"datePublished\":\"2018-12-29T09:04:35+00:00\",\"dateModified\":\"2022-06-13T03:30:04+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/\"},\"wordCount\":435,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/12\\\/custom-fonts.png\",\"articleSection\":[\"How-To\u2019s\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/\",\"url\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/\",\"name\":\"How to customize the font for an interactive map? Step-by-step guide.\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/12\\\/custom-fonts.png\",\"datePublished\":\"2018-12-29T09:04:35+00:00\",\"dateModified\":\"2022-06-13T03:30:04+00:00\",\"description\":\"Fla-shop.com maps come with a lot of customization options to fine-tune its design. Here we will discuss how you can change the font for an interactive map.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/12\\\/custom-fonts.png\",\"contentUrl\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/12\\\/custom-fonts.png\",\"width\":600,\"height\":315,\"caption\":\"Map with custom font\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/howto-customize-font-interactive-map\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to customize the font for an interactive map?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/\",\"name\":\"Fla-Shop.com\",\"description\":\"Interactive Maps, HTML5, WordPress, Map Use-cases \u2013 Fla-shop.com blog\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#organization\",\"name\":\"Fla-shop.com\",\"url\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/wp-content\\\/uploads\\\/2017\\\/06\\\/fla-shop_twitter_logo.jpg\",\"contentUrl\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/wp-content\\\/uploads\\\/2017\\\/06\\\/fla-shop_twitter_logo.jpg\",\"width\":128,\"height\":128,\"caption\":\"Fla-shop.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/flashopcom\\\/\",\"https:\\\/\\\/x.com\\\/flashop\",\"https:\\\/\\\/www.youtube.com\\\/user\\\/flashopcom\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.fla-shop.com\\\/blog\\\/#\\\/schema\\\/person\\\/16214725e757dd92d37dbfe3e2a5db1e\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/3bd8fdbd458f1b6c6dc6d8d2dc471f4986c4680b9492a7410ba0cc65f54527c7?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/3bd8fdbd458f1b6c6dc6d8d2dc471f4986c4680b9492a7410ba0cc65f54527c7?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/3bd8fdbd458f1b6c6dc6d8d2dc471f4986c4680b9492a7410ba0cc65f54527c7?s=96&d=mm&r=g\",\"caption\":\"admin\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to customize the font for an interactive map? Step-by-step guide.","description":"Fla-shop.com maps come with a lot of customization options to fine-tune its design. Here we will discuss how you can change the font for an interactive map.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/","og_locale":"en_US","og_type":"article","og_title":"How to customize the font for an interactive map? Step-by-step guide.","og_description":"Fla-shop.com maps come with a lot of customization options to fine-tune its design. Here we will discuss how you can change the font for an interactive map.","og_url":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/","og_site_name":"Fla-Shop.com","article_publisher":"https:\/\/www.facebook.com\/flashopcom\/","article_published_time":"2018-12-29T09:04:35+00:00","article_modified_time":"2022-06-13T03:30:04+00:00","og_image":[{"width":600,"height":315,"url":"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/custom-fonts.png","type":"image\/png"}],"author":"admin","twitter_card":"summary_large_image","twitter_creator":"@flashop","twitter_site":"@flashop","twitter_misc":{"Written by":"admin","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#article","isPartOf":{"@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/"},"author":{"name":"admin","@id":"https:\/\/www.fla-shop.com\/blog\/#\/schema\/person\/16214725e757dd92d37dbfe3e2a5db1e"},"headline":"How to customize the font for an interactive map?","datePublished":"2018-12-29T09:04:35+00:00","dateModified":"2022-06-13T03:30:04+00:00","mainEntityOfPage":{"@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/"},"wordCount":435,"commentCount":0,"publisher":{"@id":"https:\/\/www.fla-shop.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/custom-fonts.png","articleSection":["How-To\u2019s"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/","url":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/","name":"How to customize the font for an interactive map? Step-by-step guide.","isPartOf":{"@id":"https:\/\/www.fla-shop.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#primaryimage"},"image":{"@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#primaryimage"},"thumbnailUrl":"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/custom-fonts.png","datePublished":"2018-12-29T09:04:35+00:00","dateModified":"2022-06-13T03:30:04+00:00","description":"Fla-shop.com maps come with a lot of customization options to fine-tune its design. Here we will discuss how you can change the font for an interactive map.","breadcrumb":{"@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#primaryimage","url":"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/custom-fonts.png","contentUrl":"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2018\/12\/custom-fonts.png","width":600,"height":315,"caption":"Map with custom font"},{"@type":"BreadcrumbList","@id":"https:\/\/www.fla-shop.com\/blog\/howto-customize-font-interactive-map\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/www.fla-shop.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to customize the font for an interactive map?"}]},{"@type":"WebSite","@id":"https:\/\/www.fla-shop.com\/blog\/#website","url":"https:\/\/www.fla-shop.com\/blog\/","name":"Fla-Shop.com","description":"Interactive Maps, HTML5, WordPress, Map Use-cases \u2013 Fla-shop.com blog","publisher":{"@id":"https:\/\/www.fla-shop.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.fla-shop.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.fla-shop.com\/blog\/#organization","name":"Fla-shop.com","url":"https:\/\/www.fla-shop.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.fla-shop.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2017\/06\/fla-shop_twitter_logo.jpg","contentUrl":"https:\/\/www.fla-shop.com\/blog\/wp-content\/uploads\/2017\/06\/fla-shop_twitter_logo.jpg","width":128,"height":128,"caption":"Fla-shop.com"},"image":{"@id":"https:\/\/www.fla-shop.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/flashopcom\/","https:\/\/x.com\/flashop","https:\/\/www.youtube.com\/user\/flashopcom"]},{"@type":"Person","@id":"https:\/\/www.fla-shop.com\/blog\/#\/schema\/person\/16214725e757dd92d37dbfe3e2a5db1e","name":"admin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/3bd8fdbd458f1b6c6dc6d8d2dc471f4986c4680b9492a7410ba0cc65f54527c7?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/3bd8fdbd458f1b6c6dc6d8d2dc471f4986c4680b9492a7410ba0cc65f54527c7?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/3bd8fdbd458f1b6c6dc6d8d2dc471f4986c4680b9492a7410ba0cc65f54527c7?s=96&d=mm&r=g","caption":"admin"}}]}},"_links":{"self":[{"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/posts\/845","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/comments?post=845"}],"version-history":[{"count":22,"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/posts\/845\/revisions"}],"predecessor-version":[{"id":1634,"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/posts\/845\/revisions\/1634"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/media\/1352"}],"wp:attachment":[{"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/media?parent=845"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/categories?post=845"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fla-shop.com\/blog\/wp-json\/wp\/v2\/tags?post=845"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}