Story Map Map Tour Text Formatting

265
2
Jump to solution
03-22-2024 11:53 AM
Labels (2)
K_Jueckstock
New Contributor III

Hey everyone, 

I'm looking to create a slide panel with really nice text formatting. I have attached a photo of an example from another story map I found. (https://storymaps.arcgis.com/collections/dd4c2e6d5c2a40dd98e881f6ba616605?item=11_=) 

I did find one solution but it was incredibly heavy on coding. I am not familiar with code, if this is my only option I will definitely pursue the new frontier, but if there's another resource I'm missing I would love some guidance. 

 

Super interested in being able to create a header, change color, font, and text size. 

Thanks!! 

PS I would love functionality to edit that slide panel directly in the tour like you can for a sidecar, doesn't seem to have this yet?

 

storymap.JPG

Tags (2)
0 Kudos
1 Solution

Accepted Solutions
AbbyE_Esri
Esri Contributor

Hi @K_Jueckstock , I love this story! Good news is, you can mimic this in your builder without any coding. 

In terms of themes, you could create your own theme that looks similar to this story's, or use an existing theme to get a similar look and feel. I'd recommend either the Mesa theme (found on the Design panel), or the Historical featured theme (found after clicking the Featured themes gallery button in the Design panel).

AbbyE_Esri_0-1711392019428.png

 

Next, add a map tour to your story and use the Guided > Map focused layout: 

AbbyE_Esri_1-1711392067836.png

Then, add the text in the title and description of your first point. You can add multiple lines of text, bold, and change the color of the text using the text editor. The editor will even recommend the story's theme colors to keep cohesion in the design. 

AbbyE_Esri_2-1711392160515.png

 

Something cool that the example story you mentioned does is create a separator with text! That line that appears in the narrative panel is actually just a line of multiple underscores: ____ . You can then select that text and change the color so it looks like a colored separator.

Let me know if this information helps, or if you have any follow up questions on how to further customize your story.

--Abby

View solution in original post

2 Replies
AbbyE_Esri
Esri Contributor

Hi @K_Jueckstock , I love this story! Good news is, you can mimic this in your builder without any coding. 

In terms of themes, you could create your own theme that looks similar to this story's, or use an existing theme to get a similar look and feel. I'd recommend either the Mesa theme (found on the Design panel), or the Historical featured theme (found after clicking the Featured themes gallery button in the Design panel).

AbbyE_Esri_0-1711392019428.png

 

Next, add a map tour to your story and use the Guided > Map focused layout: 

AbbyE_Esri_1-1711392067836.png

Then, add the text in the title and description of your first point. You can add multiple lines of text, bold, and change the color of the text using the text editor. The editor will even recommend the story's theme colors to keep cohesion in the design. 

AbbyE_Esri_2-1711392160515.png

 

Something cool that the example story you mentioned does is create a separator with text! That line that appears in the narrative panel is actually just a line of multiple underscores: ____ . You can then select that text and change the color so it looks like a colored separator.

Let me know if this information helps, or if you have any follow up questions on how to further customize your story.

--Abby

K_Jueckstock
New Contributor III

Abby!!

Thank you so much for your reply, this information is a fantastic resource, and exactly what I was looking for! I just tried it out and it worked great.  I originally created my map tour from a feature service so I was stuck working with html in the attribute table, which does seem to work but is just not super convenient. I'm going to redo it with your method so I have full control over the pane, but I'm wondering if I missed some kind of editing functionality for the pane if the tour is created from a feature service? 

I am also curious if there are benefits or drawbacks of using a feature service vs. direct media upload and input other than this kind of edit control? 

Thank you so much for your response!! Very very helpful 

0 Kudos