Wednesday, July 13, 2016

Embed a Story Map

Esri Story Maps let you combine authoritative maps with narrative text, images, and multimedia content. They make it easy to harness the power of maps and geography to tell your story. Story maps inform, educate, entertain, and inspire people about a wide variety of topics.

You can view examples at the Story Maps Gallery. Story maps are easy to author using builders that are unique to each story map. Learn more at Story Map Apps, where you can find an overview and tutorial for each. 

Once you’ve created a story map, or found one that’s public, you can embed them in your website or blog. In this example we’ll use a publicly shared story map, one that uses Story Map Swipe and Spyglass that provides a view of Chicago using an historic map layer from the David Rumsey collection and current imagery. 

The URL to the story map is:
http://www.arcgis.com/apps/StorytellingSwipe/index.html?appid=01be34448b9046798cdc6378b9649a9d

To embed the story map in a website or blog we can use an iframe tag.



Using &embed at the end of the story map URL (in the src attribute) we can minimize the UI to remove the title, subtitle, and social links since these may be redundant since we're embedding the story map into an existing context.

Embedding groups with ArcGIS Online

One of the ways you can share a public group is to embed its web maps and web applications in a ribbon gallery on a web page such as a blog or your organization's website. The group share dialog provides the HTML you need, and offers options for the layout and display of the items. All you have to do is select the options you want, then copy and paste the text into your web page or blog like we've done here.



This example uses the Community Basemaps group. Click Share, then Embed in Website to view options and obtain the embed HTML.