Audio not playing in Story Map Tour

[DavidEvans5]

I am trying to add audio clips to a Walking Tour story map I am creating using the instructions featured in the Adding audio to your Story Map Tour  ArcGIS Blog article. 

To get started I'm using the same audio file and HTML code shown in the tutorial and pasting the code into the caption. The audio player appears below the text but nothing happens when I click/tap on the play button when I preview or load the story map on either a desktop PC or a mobile device. 

If I go back to edit the caption I've notice that the HTML code has been altered in that the "<" a ">" symbols have been replaced by &lt; and &gt; respectively.  Below is copy of the code after it has been altered.

<audio controls="">&lt;source jive-link-external-small" href="https://community.esri.com/http%3A%2F%2Fdownloads.esri.com%2Fagol%2Flabs%2Fmaptour%2Fhorse.mp3" rel="nofollow" target="_blank">http://downloads.esri.com/agol/labs/maptour/horse.mp3" type="audio/mpeg"&gt; &lt;embed height="50" width="100"
jive-link-external-small" href="https://community.esri.com/http%3A%2F%2Fdownloads.esri.com%2Fagol%2Flabs%2Fmaptour%2Fhorse.mp3" rel="nofollow" target="_blank">http://downloads.esri.com/agol/labs/maptour/horse.mp3"&gt;</audio>

Here is a link to the map itself, the map is public so should be accessible to anyone. 

If there's anyone out there who has encountered this problem that can provide a solution I would hugely grateful!

[AlisonSizer]

Hi there,

Apologies -- that post needs some updating. Please try this html instead:

<audio controls src="http://downloads.esri.com/agol/labs/maptour/horse.mp3" type="audio/mpeg"></audio>

Note this won't work if your Map Tour points layer is a hosted feature layer, but given that you've already got an <audio> element showing up, I think this particular layer is fine. 

[DavidEvans5]

Hi Alison

Thank you for the response! I have tried the code you provided and unfortunately the audio clip still does not play!! The audio player appears but there's no response from clicking/tapping on the play button.

You said that it would not work if the tour points layer is a hosted feature layer. I created the Story Map entirely within the ESRI Story Map template, so I'm guessing that the Map tour points are hosted (in my organization's AGOL account). 

We have other feature services published from ArcGIS Desktop and hosted through ArcGIS Server that we can utilize in web-maps and web-apps. Do I need to create a feature service for the tour points in the same way? Is there some documentation or instructions online you can point me towards to show how I can accomplish this?

Thanks again!

David

[AlisonSizer]

Ugh, sorry about that code not working. This may be a bug on our end. I'm looking into it and will report back shortly. 

Alison

[RupertEssinger]

Hi David,

Sorry about the issue.

I've been working with Alison Sizer‌ on this issue (thanks Alison) and it is a bug we introduced inadvertently in our June 26th 2018 update to ArcGIS Online. Map Tours created before June 26th that contain embedded audio continue to work OK, and you can continue to add embedded audio into those tours using the embed code in the blog you referenced. We are looking into fixing this for our upcoming mid-September update.

Until then I don't think there's a workaround, apart from using a Map Tour created before June 26th to present audio. For example, if you or someone in your Organization created any Map Tours before June 26th, you may be able to repurpose one of them for your project. The important date is when the tour was created, not when it was last modified, so if you or a colleague have an unwanted demo or test tour, you could use that as the basis for your new tour project in order to include audio. Use the audio embed code from the blog you referenced, not the code that Alison posted above.

Rupert

[DavidEvans5]

Hello Rupert,

This audio issue continues to defy every solution we attempt to throw at it: I did have an old story map that used the tour template I was able to re-purpose to see if we could get the audio working. I used both the code block that Alison suggested and the code block from the Blog article but when I attempt to save the map, I get an error message informing me that there's is an invalid html tag or description. This happens with either block of code.

I can make the map public and share the URL with you if you would like to take a look at it, but since there's no way to save the map with the audio player code I'm not sure how much you can learn from looking at it. One thing I noticed is that this (earlier) story map template does not appear to have any way to link to externally hosted images (so images have to be hosted within the map), and you cannot use the import button to import your tour points from a .csv file.

It's okay if we have to wait until the September update to use audio in the tour map, but if you do have any other ideas for how to get audio working in a tour map before then I'd be happy to give it another try. 

Thanks again!

David

[RupertEssinger]

Hi David,

Oops, sorry I should have mentioned this in my first reply above: If you repurpose an old Map Tour to work around the bug that was introduced in tours created after June 26th, you have to use a Map Tour that does not use a hosted feature service behind the scenes, i.e. a tour that is not created by uploading images directly into the Builder (because that workflow uses a feature service in which the images are stored).

The reason for this is that feature services impose their own, stricter set of supported HTML rules, and this does not include Audio. This is what is giving you the message about the invalid tag when you try and save. Map Tours that use images uploaded into the builder have never supported tags like Audio and Hr (this disparate HTML support is a peculiarity of Map Tour that we don't like and that we won't be carrying forward in our future dev plans for this app) and don't let you save the tour until you remove any unsupported HTML.

So if you repurpose an old Map Tour to work around this issue, it has to be a tour that references its images from Flickr, Google+, or directly via URLs (either URLs entered manually in the Builder or via URLs included as data in a CSV file uploaded into the Builder, or via URLs included as attributes in a CSV, shapefile or feature layer added into a web map that was then published as a Map Tour.  Use the audio embed code from the blog you referenced, not the code that Alison posted above. So I am pretty confident that the Map Tour you are trying this workaround with uses uploaded images. Sorry about this extra hoop. Note that you can't change an existing Map Tour that uses uploaded images so that it no longer uses them, because this option is chosen at initial create time.

I'm hoping you can find an older tour to work with that doesn't use image upload. Another alternative would be to use Story Map Journal for your tour-type story. Using Map Journal lets you present multiple images, embedded content, including audio (using the code that Alison posted above) and unlimited narrative text, and so can be a great way to make more detailed tours. There are some examples in our Gallery (click this link for examples). Out-of-the-box Map Journal doesn't support clicking on a point on the map to go to the section about that place, but if you need that it can be added via some customization.

Rupert

[KyleBalke__GISP]

Rupert Essinger‌ and Alison Sizer‌

Rupert,

I am in the process of moving the Missoula Children's Poetry Map that Ken Wall and I meet with you about in July to the final resting place on the School District ArcGIS Online site.  However I am running into the same audio issue as described above (audio was working in the version published prior to the June update).

Does this audio bug also occur in the Shortlist app?  And is there really no working around or solution until September?

Kyle Balke

[RupertEssinger]

Hi Kyle

Yes sorry about the issue. You are correct that the same issue applies to Shortlist since you have created your latest version of the Shortlist since June 26th. Audio embeds in Shortlists will continue to work in Shortlists created before that date. So could you continue to use your original version of your Shortlist, which was created before that date?

Rupert

[DavidEvans5]

Hi Rupert Essinger and Alison Sizer

I have been anxiously waiting for the September update to ArcGIS online hoping that there would be a fix for the problem we discussed here a couple of months ago that was preventing me from including audio clips in a Story Map I was developing for a digital walking tour project.

The September update was rolled out last night and I went ahead and created a completely new Story map for testing purposes and imported my tour stop points from a .csv file which has the links to the pictures and thumbnails used within the story map (all of which are hosted on through our own server). I followed the steps described in the recent ArcGIS blog article: Adding audio to your Story Map Tour and published this new map and ran into a new problem with the same result: now the audio player no longer appears within the caption so no audio can be played. I just get part of the code that I pasted in (shown below). It seems that after I paste the code, part of the code (the </audio> part) is erased. I have tried this in both Chrome and Internet Explorer with the same result.

I also tried using the code that was suggested by Alison on July 20, which at least loads the audio player, but the player itself is unresponsive when the story map is published.

Here is a link to this new version of the walking tour map if you would like to see what is happening. Is there anything I’m missing here or that you can suggest I try to get it to work?

Thanks

David