One of the ways you can share maps, apps, or a group of maps and apps is to include them in a web page such as a blog or your organization's website. ArcGIS Online provides the code you need, options for what to include, and layout options.
Embed a map
To embed a public map you've opened in Map Viewer using ready-to-use HTML code, do the following:
- In Map Viewer, open a saved map.
- Verify that the map is shared with everyone (public).
Note:
If the map is not shared publicly, clicking Embed map
will automatically open the map sharing settings.See Considerations for sharing maps for more information.
- On the Contents (dark) toolbar, click Embed map .
- Optionally, in the Embed window, do any of the following to change how the embedded map will display:
- Define the map extent that will be included.
Tip:
Use keyboard shortcuts to help you set the extent of the map. Press Shift and drag a box on the map to draw a preview area. Press Esc to reset the preview area. To view the full list of keyboard shortcuts in Map Viewer, press Alt+? on Microsoft Windows or Option+? on Mac.
- Under Mode, choose Light or Dark.
- Under Map elements, check the check box next to any of the map elements to include them in the embedded map.
- Under Available actions, turn on the Open in map viewer toggle button to enable the option to open the embedded map in Map Viewer.
Note:
Under Map view, the Preserve map scale and Disable scroll zoom toggle buttons are turned on by default. If the Preserve map scale toggle button is turned on, the map will open at the preview scale, preserving the relative size of features across devices. Otherwise, the scale varies to show the features in the preview extent. If the Disable scroll zoom toggle button is turned on, zooming in and out using the mouse and wheel button will be disabled when navigating the embedded map.
- Define the map extent that will be included.
- Choose Script embed or iFrame embed from the embed code drop-down arrow and click Copy HTML to copy the HTML code provided.
Note:
The Script embed option uses web components, meaning that your website does not need to load an entire application for each embedded web map. Some web sites do not support embedding content without iFrames, so the iFrame embed option may be more appropriate. Both embed options provide the same configurable view of your map for sharing.
- Paste the code into the web page where you want the map to appear.
Note:
For the Script embed option, the HTML code contains a script tag and the custom element with the map to embed. Paste the script tag into the <head> of the web page. Add the custom element to the <body> of the web page where you want the map to appear. For best performance, you should keep the script version in the source URL current. For the most current version, see Embeddable Components from ArcGIS Maps SDK for JavaScript.
Embed an app
You may want to embed an app instead of a map in a website. Embedding an app can be useful in various scenarios. The following are some examples:
- Show an app you have created using an ArcGIS Instant Apps template (for example, using the Basic template) that includes all the app functionality you configured.
- Show a map that includes a premium service with embedded credentials, such as the World Routing Service, by embedding an app that includes the Directions widget in ArcGIS Experience Builder.
To embed an app using ready-to-use HTML code, do the following:
- Verify that you are signed in and have privileges to create and share content.
- Open the item page of the app you want to embed.
Note:
To share an app with users outside of your organization, the app, map, and layers must be shared publicly; otherwise, only group members will be able to view content. To reach the widest audience, consider making the app and its contents available to everyone (public).
Tip:
You can create an app from a map. Any changes made to the map, such as changes to the extent or layers, are reflected in the app.
- Click Configure.
- In the configuration window, click Share on the vertical toolbar.
- Click Copy in the Embed section .
- Paste the code into your website where you want the app to appear.
Note:
To ensure users outside of your organization can access your app, replace your organization's URL with the ArcGIS public URL (https://arcgis.com). For example, if your organization's URL is https://example.maps.arcgis.com, replace example.maps.arcgis.com with arcgis.com.
Tip:
You can also use URL parameters to control the look and feel or functionality of the app that you are embedding.
Embed a group
You can use ArcGIS Instant Apps to embed a group in a website, blog, or other platform. Embedding a group-based app allows you to showcase curated content, such as maps and apps, to users outside of your organization.
To embed a group-based app using ready-to-use HTML code, do the following:
- Verify that you are signed in and have privileges to create and share content.
- Click Groups at the top of the site and use the tabs, filters, sort options, and search as needed to find the group you want to embed. Click the name of the group to open its group page.
Note:
To share group content with users outside of your organization, the group and all the items in the group must be shared publicly. If the group is private, only group members will be able to view content. To reach the widest audience, consider making the group and its items available to everyone (public).
- On the Overview tab, click Create app using Instant Apps and create an app.
- Choose from the Category Gallery or Atlas templates.
- In the configuration window, click Share on the vertical toolbar.
- Click Copy in the Embed section .
- Paste the code into your website where you want the group to appear.
Note:
To ensure users outside of your organization can access your app, replace your organization's URL with the ArcGIS public URL (https://arcgis.com). For example, if your organization's URL is https://example.maps.arcgis.com, replace example.maps.arcgis.com with arcgis.com.