# Create Map Network

After Import Demo data, You will see demo like here

![](https://2950831722-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrBL0RfxDBqGZBQvc99pQ%2Fuploads%2FGVQVCxsspLBzwPYFhviA%2FScreen%20Shot%202022-01-16%20at%203.01.38%20PM.jpg?alt=media\&token=236bcd0d-7f3c-4e98-a4d4-058ae1298bb5)

**Step 1**: Go to Plugins >> Image Map Pro >> Add New&#x20;

![](https://2950831722-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrBL0RfxDBqGZBQvc99pQ%2Fuploads%2FuaZR1yGU2E4dOzr0IRMt%2FScreen%20Shot%202021-10-20%20at%202.40.14%20PM.jpg?alt=media\&token=f7c38198-ec1d-4a04-82f3-a5a4c6c1ad31)

**Step 2**: Import Data. Find demo data in theme/install-resource/demo-import/Image-Map-Pro/ folder

![](https://2950831722-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrBL0RfxDBqGZBQvc99pQ%2Fuploads%2FUJFES9LiTEtDPqlLiRn1%2FScreen%20Shot%202021-10-20%20at%202.43.04%20PM.jpg?alt=media\&token=1e80a241-cdf6-4cff-9dfe-de921bc7aa42)

You can find code bellow:

```
{"id":6310,"editor":{"selected_shape":"oval-3203","tool":"oval","shapeCounter":{"ovals":3}},"general":{"name":"Network","shortcode":"Network","width":1291,"height":633,"naturalWidth":1291,"naturalHeight":633,"center_image_map":1},"image":{"url":"http://ovapt.com/transflash/wp/wp-content/uploads/2021/12/our-network.png"},"tooltips":{"constrain_tooltips":0,"fullscreen_tooltips":"none"},"spots":[{"id":"oval-586","title":"Oval 1","type":"oval","x":24.516,"y":38.23,"width":2.31,"height":5.002,"x_image_background":24.516,"y_image_background":38.23,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-831881","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"New York, United states"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-9608","title":"Oval 2","type":"oval","x":18.087,"y":40.442,"width":2.31,"height":5.002,"x_image_background":18.087,"y_image_background":40.442,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-546011","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Texas , United states"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-3803","title":"Oval 3","type":"oval","x":21.185,"y":32.069,"width":2.31,"height":5.002,"x_image_background":21.185,"y_image_background":32.069,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-440691","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Michigan , United states"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-1922","title":"Oval 4","type":"oval","x":12.045,"y":22.274,"width":2.31,"height":5.002,"x_image_background":12.045,"y_image_background":22.274,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-105011","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Wrigey , Canada"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-6691","title":"Oval 5","type":"oval","x":34.431,"y":8.846,"width":2.31,"height":5.002,"x_image_background":34.431,"y_image_background":8.846,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-887091","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Greendland"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-596","title":"Oval 6","type":"oval","x":52.479,"y":54.976,"width":2.31,"height":5.002,"x_image_background":52.479,"y_image_background":54.976,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-167771","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Khartoum , Sudan"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-566","title":"Oval 7","type":"oval","x":29.938,"y":69.194,"width":2.31,"height":5.002,"x_image_background":29.938,"y_image_background":69.194,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-360221","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Rioduorado , Brazil"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-5374","title":"Oval 8","type":"oval","x":81.217,"y":24.96,"width":2.31,"height":5.002,"x_image_background":81.217,"y_image_background":24.96,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-290061","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Beijing , China"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-1081","title":"Oval 9","type":"oval","x":74.246,"y":50.71,"width":2.31,"height":5.002,"x_image_background":74.246,"y_image_background":50.71,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-785461","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Mandalay , Myanmar"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-3747","title":"Oval 10","type":"oval","x":82.611,"y":75.986,"width":2.31,"height":5.002,"x_image_background":82.611,"y_image_background":75.986,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-502561","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Yulara , Australia"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-4429","title":"Oval 11","type":"oval","x":72.077,"y":37.914,"width":2.31,"height":5.002,"x_image_background":72.077,"y_image_background":37.914,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-903851","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Qinghai , China"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-2025","title":"Oval 12","type":"oval","x":65.725,"y":35.702,"width":2.31,"height":5.002,"x_image_background":65.725,"y_image_background":35.702,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-477171","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Bishkek , Kyzgyzstan"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-1159","title":"Oval 13","type":"oval","x":66.422,"y":23.696,"width":2.31,"height":5.002,"x_image_background":66.422,"y_image_background":23.696,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-528331","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Vakhovsk , Russia"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}},{"id":"oval-3203","title":"Oval 14","type":"oval","x":57.437,"y":28.119,"width":2.31,"height":5.002,"x_image_background":57.437,"y_image_background":28.119,"width_image_background":2.31,"height_image_background":5.002,"default_style":{"opacity":0,"background_color":"#47bf6f","background_opacity":0.33},"mouseover_style":{"background_color":"#47bf6f","background_opacity":0.19},"tooltip_style":{"border_radius":2,"padding":7,"background_color":"#ffffff","width":103,"auto_width":0},"tooltip_content":{"squares_settings":{"containers":[{"id":"sq-container-969351","settings":{"elements":[{"settings":{"name":"Paragraph","iconClass":"fa fa-paragraph"},"options":{"heading":{"text":"My Shape"},"text":{"text":"Voronezh , Russia"},"layout":{"box_model":{"padding":{"top":0,"bottom":6,"left":0,"right":0}}},"font":{"font_family":"raleway","font_weight":"500","text_color":"#000000"}}}]}}]}}}]}
```

**Step 3**: Edit Map

**Step 3.1**: Choose a Map to edit

![](https://2950831722-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrBL0RfxDBqGZBQvc99pQ%2Fuploads%2FGIzheyIj31jgIReO73N8%2FScreen%20Shot%202021-11-12%20at%2011.24.01%20AM.jpg?alt=media\&token=5f186e74-0697-4001-bfb3-c25132087733)

**Step 3.2**: Change Image

![](https://2950831722-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrBL0RfxDBqGZBQvc99pQ%2Fuploads%2FgmptoC6Qp9BqxvcmLfYs%2FScreen%20Shot%202021-11-12%20at%2011.32.46%20AM.jpg?alt=media\&token=d3289f5a-3fe2-45d4-89f9-65a02891d80a)

**Step 3.3**: Create and edit content

![](https://2950831722-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrBL0RfxDBqGZBQvc99pQ%2Fuploads%2FQxHxZziGTuIpwENVhbYR%2FScreen%20Shot%202021-11-12%20at%2011.29.16%20AM.jpg?alt=media\&token=bebdc1a8-a7fa-4d95-a813-2255250b6af9)

![](https://2950831722-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrBL0RfxDBqGZBQvc99pQ%2Fuploads%2FklCoyqKPzTZj6C4AJFfi%2FScreen%20Shot%202022-01-16%20at%203.07.18%20PM.jpg?alt=media\&token=33d23b74-c56b-40d8-b713-4e2cc61e936d)
