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

Story maps - ALIGN at top

BarbaraBiskopstøHansen

Hi, I am working on a tour in story maps and have been able to remove the cover, but there is one thing really bugging me, thats the alignment on top, is there a way to align the list of places to the map itself, it does not look good that the list always starts in the middle of the page? I know it alignes when you scroll, but I want it to be align at the top right away?

I have attached an image so you see what I mean? Is there a way to get more control of the design itself?

align2.png

foto2021.jpg

Find more posts tagged with

Map tour

Accepted answers

oevans_storymaps

@BarbaraBiskopstøHansen - If you want to hide the story header you can do this by adding

?header=false

to the end of the URL of your story.

For example: https://storymaps.arcgis.com/stories/c87bc0a59c0144008e25d50a5dd1b192?header=false

If you are embedding the story in another web page, the header will be hidden automatically.

All comments

BarbaraBiskopstøHansen

It worked pretty ok, there is just a mini-gap now, but I can live with the that, it helped when making enabling the navigation, thank you for the help 🙂

oevans_storymaps

@BarbaraBiskopstøHansen - If you want to hide the story header you can do this by adding

?header=false

to the end of the URL of your story.

For example: https://storymaps.arcgis.com/stories/c87bc0a59c0144008e25d50a5dd1b192?header=false

If you are embedding the story in another web page, the header will be hidden automatically.

BarbaraBiskopstøHansen

Hi Owen 🙂

I have been trying to pull it up, but I cant get it above this text where it says (story title etc).. and I am using minimal, actually I would like to have not header... just the map, but aligned at the top.

kind regards,

Barbara

send12.png

4.jpg

oevans_storymaps

@BarbaraBiskopstøHansen -- That space in the side panel will be removed as long as the tour is the first block in your story (this enhancement was added in Oct 2023). Since you can see that space when viewing the story it means there's still at least one block above your map tour.

Depending on how you built your story, it may not be obvious how to get rid of that last empty text block (you can't just use the delete key because there's no text there).

One easy way to do it is to just drag your map tour block up to the very top of the story (above the empty text block). You can grab the tour block using the drag handle on the left side of the tour slides panel and drag it where you want.

Screenshot 2024-06-18 at 10.41.19 AM.jpg

If you're using the Minimal cover layout, it can help to temporarily enable the navigation bar (from the Design panel) so you can see when you are all the way at the top. With other cover layouts it's obvious where the bottom of the cover is, so the navbar isn't needed. When you drop the tour, you should see something like what is shown below where the insertion line is very close to the navbar or the cover's bottom edge.

Screenshot 2024-06-18 at 10.43.50 AM (2).jpg

Hope this helps!

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.