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; } } }

Disable image download from ArcGIS StoryMaps

KateBerg2

I have images in a StoryMap that my client wants to show but not make it easily downloadable. Currently it's possible in all options (sidecar, slideshow, etc.) to simply right click on a photo and "Save image as...". Is there a way to change how a photo is embedded in the Story Maps so this isn't possible?

Vind meer berichten getagd met

Accepted answers

oevans_storymaps

Hi Kate! Unfortunately that's not currently possible in StoryMaps, but we will add this suggestion to our list and investigate and see if others are also requesting this so we can evaluate it for inclusion in a future update.

All comments

oevans_storymaps

Hi Kate -- follow-up question: since there's no way to restrict someone from taking a screenshot or photo of the image, what does your client think blocking download would accomplish? Stories already downsample images for performance reasons, so the image in the story likely isn't the original full-resolution one. Does that make any difference?

KateBerg2

That is helpful to know they are downsampled. I think the point that our client was getting at was to make it harder to get access to the photos. Sure, screenshotting is always an option but it's one step harder than right clicking and getting the picture, if that makes sense. However, the demands for this project have changed, so this is no longer a high priority for us! Thanks for your help, Owen.

MJBiazar

Hi @KateBerg2 ,

While ArcGIS StoryMaps still don't support disabling image download when sharing or embedding a StoryMap, as a workaround, you can disable right-click interactions when you embed your app (StoryMap in this case) in another web page. This can be done by using "pointer-events" property in the iframe:

<iframe src="https://storymaps.arcgis.com/stories/24cd49esd615c614d70a5ea" width="100%" height="3000" frameborder="0" scrolling="no" style="pointer-events:none;"></iframe>

The downside of this method is that it disables all interactions including showing images in full-screen mode, clicking slideshow buttons, and scrolling. You can enable scrolling by increasing the iframe height. However, it may not be ideal from the design perspective if you have a complex StoryMap and may not work with certain elements on StoryMap such as slideshow and interactive maps. But it should work fine for simpler stories as long as you set the height of your iframe appropriately to fit your StoryMap content.

You may also find these resources helpful:

Best,

oevans_storymaps

@MJBiazar @KateBerg2 -- We made some changes earlier this year that help to deter downloading of images from StoryMaps.

You'll notice that now when you right-click an image in a story and try to use the browser's "Save image as..." option you don't get a readable image file.

Sorry for not updating this thread after that change was made!

MJBiazar

Hi @OwenGeo thanks for the update! This is great!! I think the only use case of disabling right-click will be to avoid users from copying the text.

Best,

GMSOSpur

HI @OwenGeo - We are trying to embed an ESRI Story Map as an iframe into our VueJS app. When we do this - the images we have embedded in our story map are not being displayed. If we open the src URL directly - we see all embedded images correctly but when we load this from within the app we do not see the images. Note that we have a user event that triggers the display of a hidden modal dialog that contains our embedded iframe that has as its source the ESRI Story Map. Any help greatly appreciated!

ESRI-Issue.PNG

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

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