Select to view content in your preferred language

Story Map HMTL bootstrap Tabs

1014
4
04-26-2022 10:20 AM
JosephYang
Emerging Contributor

Hi everyone,

I am trying to create a list of tabs in a story map page very similar to this link:

https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_tabs_dynamic&stacked=h

For some reason the 
<li><a data-toggle="tab" href="#menu3">Menu 3</a></li> lines become after saving the project

<li><a  href="#menu3" target="_blank">Menu 3</a></li> which opens a new tab when the user clicks a tab. Is there a workaround this?

0 Kudos
4 Replies
OwenGeo
Esri Notable Contributor

The data-toggle attribute is not on ArcGIS Online's supported HTML allow list (see Supported HTML—ArcGIS Online Help | Documentation), so I believe that's why it's getting removed. There might be a different way to create the experience you want without using that attribute, or you could host your code on your own web server and embed it into the story.

I moved the question to the classic questions board since I believe you are working with one of the classic storytelling templates like Journal or Series.

Owen Evans
Lead Product Engineer | StoryMaps
0 Kudos
JosephYang
Emerging Contributor

Thanks Owen, yes I am using the Map Journal on Enterprise. 

I have tried using <iframe> to emded my html and the content is tabbed except is there a way to initiate map story actions through the embed htmls? 

Eg. I have a text in one of the tabs with a specific action

<a data-storymaps="MJ-ACTION-1651162466736" data-storymaps-type="media" href="#"

0 Kudos
OwenGeo
Esri Notable Contributor

I don't believe it's compatible with standard browser web security policies for content within an iframe to communicate with the parent page in that way. There might be a way to trigger a story action by implementing some cross-frame messaging via a postMessage API, but that's beyond my expertise. You'd have to work with a developer who has a deep understanding of security.

Owen Evans
Lead Product Engineer | StoryMaps
JosephYang
Emerging Contributor

I see. Story Map actions are a priority so I guess the closest solution would be to list everything in order on the page instead of tabs.

 

Thank you Owen

0 Kudos