nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Storymaps, Flash and responsive design

MandyLeith

Hello, we're planning to integrate a Storymap on our website, and we have a couple of questions: does StoryMaps use Flash? And does Storymaps use responsive design, ie does it adapt well for iphones and tablets? thanks for helping us with these questions.

Find more posts tagged with

Accepted answers

oevans_storymaps

Hi Mandy,

Thanks for your question, and it's nice to hear your organization is putting story maps on its website!

Story Maps do not use Flash, but they are responsively designed. If you open a story (like this Map Journal) and resize your browser (either just by dragging the window edge or using browser developer tools to simulate mobile device mode) you'll see the app layout change.

2016-04-06 at 9.01.32 AM.JPG 2016-04-06 at 9.01.41 AM.JPG

You can find many of good examples of embedded and linked story maps in our Story Map Gallery to get ideas of how best to integrate the story map on your website. Just use the Format filters along the left sidebar to show only the Embedded or Linked examples.

2016-04-06 at 8.55.38 AM.JPG

The best way to do this depends on your story -- some stories will work well in a smaller space while others look best full-screen. If your story looks best full-screen then we'd recommend using a simple screenshot or image from your story on your website and making that image a link that opens the full-screen story in another browser tab. If it works well in the smaller space then you can embed the live story in an <iframe> in your web page. If you do embed your story make sure you do some tests to make sure all sections of the story look and work well across a range of screen resolutions and browser window sizes.

You'll find more tips on embedding story maps in websites in this blog post.

Owen

All comments

oevans_storymaps

Hi Mandy,

Thanks for your question, and it's nice to hear your organization is putting story maps on its website!

2016-04-06 at 9.01.32 AM.JPG 2016-04-06 at 9.01.41 AM.JPG

2016-04-06 at 8.55.38 AM.JPG

You'll find more tips on embedding story maps in websites in this blog post.

Owen

MandyLeith

Thanks so much for your helpful reply Owen.

We'd like to go ahead and use the Story Map Tour app.

Can you help me to understand what it will cost to do this?

I need to provide my manager with a cost estimate before we go ahead.

We will need at least 3-5 logins and would like analytics, so I'm assuming

we'll need to purchase credits. I'd appreciate any help in identifying a

ball park cost. thanks!

Mandy

MandyLeith

One more question: we want to use the Story Map Tour app as part of a

webpage, not full page. Will that work?

thanks so much for your help!

Mandy

On Thu, Apr 7, 2016 at 12:00 PM, Mandy Leith <mleith@oceannetworks.ca>

oevans_storymaps

Hi Mandy,

Sure you can embed Map Tour. Here are some examples of Map Tours embedded in web pages. Also read through this blog post for some tips about embedding story maps in web pages.

As far as cost you can see the ArcGIS Online plans here. It would be best if you could talk to your Esri account manager about your specific needs, or you can email or call Esri Customer Service using the contact info on the plan webpage.

Owen

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.