Looking to create your first story? Here's a basic guide to using the ArcGIS StoryMaps builder.
Allen Carroll, Esri's StoryMaps team
We're glad that you're eager to get started with ArcGIS StoryMaps, our latest and most versatile place-based storytelling tool. We think you'll find it easier than ever to make beautiful and informative multimedia narratives.
This tutorial gives you the basics you need to get started.
Before we begin, though, an important word for anyone who has still been creating story maps using our "classic" template apps or who has classic template stories that are still shared widely: Those templates are currently in what's known as mature support, meaning no updates will be made to the product to ensure that they continue to function correctly in web browsers or on mobile devices. The classic templates will be fully retired in fall 2025, meaning published stories will no longer be available. If you have mostly worked with classic stories to date and/or have existing classic stories that you value highly, it's critical that you develop and implement a plan to transition your work to ArcGIS StoryMaps as soon as possible; here's some advice about moving to ArcGIS StoryMaps to help you begin or continue that process.
Start your story
Go to storymaps.arcgis.com and sign in. Doing so will land you on your very own My Projects page. This page is your jumping off point for all of your ArcGIS StoryMaps content, which is grouped into four output types: stories, briefings, collections, and themes. It will look something like this:
At any point, you can return to your My Projects page via the profile menu in the upper right-hand corner of the app header.
If you haven't created any stories with ArcGIS StoryMaps, you'll only see the Create new story button with the plus sign. Once you start working on a story, you'll be able to access it here any time. Next? You guessed it — click on Create story and select Start from scratch from the drop-down menu. You'll briefly see this little guy...
And then your story's cover, or title page, will appear. Next you'll want to...
Create a cover
Click on Title your story to type in your title. Click below the title to add a subtitle (it's optional), and, below that to adjust your byline.
You'll notice in the upper right that there's an option to Add cover image or video. If you choose to feature a video on your cover, the video will automatically play without sound and loop. ArcGIS StoryMaps also includes two additional cover designs; we'll deal with that in the Adjust the design section below.
Build your narrative
Click the little plus sign below the cover, and you'll see a menu of options. This menu, which we call the block palette, is the heart of the ArcGIS StoryMaps builder. It gives you a cool and powerful set of options — think of them as building blocks — with which you can assemble your story, piece by piece. The block palette is organized by function: basic features, data visualization techniques, incorporating media, and immersive blocks.
The options within the Basic portion of the block palette are pretty straightforward: Text is self-explanatory. Buttons act as an eye-catching link out from your story, while separators provide a visual break between sections of a story. The code block offers a place for plaintext formatting, which is useful for providing code snippets (you can configure the block to recognize the syntax of 13 coding languages).
In the Data visualization section of the block palette, you'll see an option to add maps to your story (we'll dive much deeper into adding maps in a little bit), as well as tables that allow you to organize and present light data and other information across a simple matrix of rows and columns. Finally, the chart block lets you create four different kinds of simple charts using data that you input.
The Media section is how you'll add visual and aural components to your story, and the Immersive blocks provide unique, scrolling multimedia experiences that occupy the entirety of the browser window when viewed.
Feel free to play around. Try different blocks — it's easy to delete items that you add.
Write some text
It usually makes sense to start with the Text option. When you choose Text, you'll see a flashing cursor. If you want to add standard (called "paragraph") text, just start typing (or paste in) your prose. But you can also highlight chunks of text and use the text formatting menu that appears to create bold and/or italic passages, apply a strikethrough or superscripts and subscripts, add a hyperlink, alter the text color, and change your text into a different kind of text block — including three heading sizes, quotes, or lists. Heading and paragraph text blocks can also be aligned to the center or the right if desired.
Now try typing in two or more paragraphs. (You can add consecutive paragraphs by simply pressing return on your keyboard.) As you hover over the text, you'll see that little plus sign appear in the left margin between paragraphs. You can click those little pluses to bring up the block palette and insert new content at any point within your story.
Add an image
Open the block palette, then pick Image from the Media section of the menu. Navigate your folders to find an image you'd like to include and add it to your story. (You can also add a photo by directly linking to it from elsewhere on the web, or, once you have images in your story, there will be an option to reuse them, as well.) When you hover over the image, you'll see a little set of options in a panel at the top of the image.
The leftmost item that looks like a pencil opens up the image editor, where you can use the crop and markup tools to modify the image. When cropping you can choose from a set of standard aspect ratio rectangular size, set your own custom size, and even give the image rounded corners or an oval shape. You can also rotate the image or flip it horizontally (like a mirror image), if needed. On the Markup tab you’ll find drawing tools — lines, points, shapes, arrow, etc. — that can be used to annotate your image to call out specific elements of it.
A screenshot of the markup tab of the ArcGIS StoryMaps image editor opened with a photo of a waterfall, with a red circle drawn around a viewing platform at the base of the falls and a red arrow pointing to the circle
The crop (left) and markup (right) tabs of the ArcGIS StoryMaps image editor.
The five items in the middle of the image toolbar let you set the size of the image within your story. Small, medium, and large options are pretty obvious; large images go right up to the edge of the browser, which can provide a nice dramatic effect—but they should be used judiciously. There are also two Float options. These offset the media to the left or to the right, allowing the text to flow around it (like the above screenshot of the image options toolbar, for instance). The gear symbol lets you confine the image to the viewer's window space, set it to be a clickable hyperlink, add alternative text to increase your story's accessibility, and provide attribution information. A click on the three dots lets you replace or delete the image.
Image gallery in action
By the way, with image sizing you’ll only be able to select sizes for which your image is large enough; e.g., you'll only be able to choose the large option if your image is at least 1,920 pixels wide. Another thing to keep in mind is that you can set an image to always fit entirely within the screen or window in which it's being viewed (this can be toggled in the image options accessed by clicking the gear symbol). This is especially useful for images with vertical aspect ratios that might otherwise require scrolling to see in their entirety.
Note that there's a place for a caption under each image that you add. Captions are optional; the placeholder Add a caption text won't appear when you publish your story. We recommend that you include credit information for your images—and to be sure you're not using copyrighted images without permission. (For advice on how to properly choose and use images in your story, check out Bern Szukalski's blog post.)
You can also create a collage of images using the Image gallery feature in the block palette (this block was used for the image editor screenshots above). You can upload up to a dozen images that will be configured into a rectangular pattern. Readers will be able to expand the gallery into a carousel of individual images.
Moving stuff around
Once you've added text, images and other media, you can drag and drop items to move them around within your story. When you hover over a text or code block, a media item, a map, a separator, a button, or an entire immersive block, you'll see a little handle appear next to its upper left corner.
Click and drag the handle, and you'll see a thumbnail follow you up and down the story, and a bar will appear between paragraphs and other items. Release the mouse and the item will reappear in its new location. You can move immersive sections around, too, but the handles for these are located on the left side of the slide panel (more on that below).
Undo/redo
The undo/redo mechanisms occupy a prominent location in the builder.
Move a block all the way up your story and decide you actually liked it better where it was? Accidentally delete the wrong paragraph? ArcGIS StoryMaps has you covered: In the builder header you'll see a pair of curved arrows, one pointing backwards, and the other pointing forwards. These are your undo/redo functions, making it easy to experiment and correct any mistakes without having to worry about anything being permanent.
Make a map
From the block palette, choose Map, and you'll quickly see this:
Let's ignore that New express map button (upper right) for now. The web map browser serves up cards representing all the maps you've saved to your ArcGIS Online account. You can opt, via the tabs just below the title, to see the maps you've favorited, the maps shared within your ArcGIS organization or to groups you are a part of, maps that are publicly published by anyone, and you can access scores of cool maps on Esri's Living Atlas of the World. You can search for maps within any of those tabs to help you quickly find what you're looking for. (Note that you can't edit web maps directly in ArcGIS StoryMaps beyond toggling layer visibility and a few other options that determine how the map can be viewed and interacted with by readers.)
Now let's go back and click the New express map button. Before we do, though, a word of explanation: Express maps are there so that you can easily make simple and clear maps without requiring any GIS expertise or needing to do any work at all outside of the ArcGIS StoryMaps builder. An express map might show a single location, a series of locations (with customizable pop-ups), or even routes and areas. You can also add labels and arrows to express maps. Let's take a look.
Once you've opened the express map editor, pan and zoom to the location and scale that you want (or use the search function). When you click Save to put the map in your story, it will save your chosen map extent (and any other items you've added to it).
Just above your map is a selection of simple drawing tools. Here's what they do:
Play around with the drawing tools. Draw a bunch of features on the map. A tip on lines and areas: double-click to finish drawing. To delete a feature, highlight it and drag it to the trash can that appears near the bottom of the map.
You'll notice that when you draw a point, line, or area, it gets added to the drawn features panel (1). Click on an item in the drawn features panel to add pop-up content (2). You can add an image, a title, and a description, and adjust its visual style; then click Done. Here (3) is how the completed pop-up looks. You can also create feature groups in the map designer to help organize your drawn features; your customized groupings will be reflected in the map's legend.
A few more express map tips: First, the color of the drawn features in your express map starts out matching the accent color dictated by the theme of your story. You can change the accent color of a custom theme (see "Adjust the design" later in this story) — but you can also change the color of any individual drawn feature or a whole group of features at once. Choose from a couple of additional, preset theme-based colors or use the color picker to come up with your own particular shade. For non-numbered points, you can also select from three different sizing options and even opt to bring in your own symbol.
Second, click on the little gear icon in the layers panel to access the map settings and you'll see, among other things, that you can choose from a catalog of fifteen standard basemaps, plus the option to use a web map, including those offered by the Living Atlas.
Also in the settings panel you can opt to do without a map legend (the default setting). We recommend this for simple, self-explanatory maps. Another option, disabling map navigation (the ability to pan and zoom) can come in handy to keep readers focused on the map extent you've chosen. Finally, you can opt to turn on an overview map, which will appear as a little globe in the bottom right-hand corner of the map that delineates the current extent of the map. [Note that all of these map settings options are also available when you've added a web map to a story.]
One more significant capability of express maps: You can choose to upload an image to serve as the base for the map. This means that all those drawing and annotation tools can be applied to, say, a photo or graphic instead of a map.
The four items approaching the bottom of the block palette — swipe, timeline, sidecar, and map tour — all provide unique multimedia formats. The latter two are considered "immersive" blocks, due to the fact that they occupy the entire browser window as you scroll through them.
You can use any or all of these exciting blocks in your narratives, or none at all. But they're a nice way to add variety to your story, and can be useful for specific purposes such as making a presentation or guiding readers through a series of points of interest.
Sidecar
Sidecar is a scrolling, slide-based block that has three layout choices, each of which provides powerful narrative tools. The floating panel layout is ideal for visually striking media with short captions or descriptions (it's similar to the immersive section in our classic Cascade app). The docked panel layout is optimal for longer narrative content, as it doesn’t overlap the media. The slideshow layout is similar to the floating panel, but readers experience its slides laterally, rather than vertically, by manually clicking through them.
We'll start with docked panel, a split-screen layout with a scrolling narrative panel and a stationary media panel.
You can have a mix of items within the narrative panel. In the example here, I've included an image, heading, and paragraph of text. The media panel has a photo in this case, but I could have chosen a video, map, 3D web scene, swipe block (more on that later), or embedded web content.
You'll notice a dark strip at the bottom of your sidecar in the builder. We call this the slide panel, and you can use it to create and manage a series of sequential slides within the sidecar.
You can drag and drop thumbnails to change the order of your slides, and you can click the three dots below each thumbnail to duplicate, delete, hide a slide, or even add audio to the background of a slide. Duplicating a slide duplicates the media within it, including web maps and scenes. You can create the cool effect of map choreography by duplicating a slide with a web map and then changing the map's zoom level or turning layers on and off in the duplicated slide to have your readers focus on a particular geographic extent or theme.
Images in the media panel automatically fill the space within it (left), which means that they'll probably be cropped a bit. You can opt to have the media "fit" the space, which will display the entire media but possibly leave some blank space around it, by clicking the gear icon to open the media options and choosing the fit option (right) instead of fill.
If you do go with fill, you have the ability to set the focal point of the media to ensure that the important parts of it will always be visible despite the cropping. Also in the media panel, you'll see a preview of your media with a white circle: the focal point. Click on the image to move the focal point to the part of the image you want to be sure remains visible. When you think you're in the right spot, click Save. Voilà! Note that you can make similar focal point adjustments for images in other immersive blocks and express map pop-ups.
See the two little buttons along the right edge of the narrative panel? You can use those to change the position (left/right) and width (narrow/medium/wide) of the panel.
Now let's take a closer look at another sidecar layout option, floating panel.
Choose this when you want to showcase your content as full-size, screen-filling form, and when you don't have long explanatory text. You can, however, include multimedia content within the floating panels. You can also adjust both the width (narrow, medium, wide) and horizontal placement (left, center, right) of your floating panels.
You can choose a transparent background for the panel, with options for light or dark text to complement the underlying media. This is only advisable when using media that has large, consistently-colored areas.
Finally, the third layout of sidecar is the slideshow layout.
When you use the slideshow layout of sidecar, your media, including images, videos, web maps, 3D scenes, and express maps, fill the entire slide background, like the floating panel layout.
You can add concise bits of text to each slide to provide context. Like the narrative panels for the other sidecar layouts, you can also incorporate media, embeds, and other elements.
The slide panel works exactly like it does for the other sidecar layouts, and makes managing your content a breeze. Use it to add, duplicate, and rearrange your slides.
You can move the narrative panel around and adjust its width and transparency so that it doesn't interfere with key parts of your media.
Since the reader doesn't have to scroll through every slide in order to continue through the story, the slideshow layout can be great for incorporating sections of "optional" information that isn't critical to the telling of your story, but provides additional context if a reader is interested in digging deeper into a particular sub-topic.
Note that you can freely switch back and forth between any of the three sidecar layouts without losing any content, via the options menu in the lower left of the slide panel.
Looking for more information about sidecar? Here's an instructional story about adding a sidecar to your story map. And here's a blog post offering some advice about which sidecar options to use in a variety of circumstances.
Before we move on to the next immersive block, one more cool feature of sidecar is the ability to add media actions, which enable you to adjust the appearance of a map or 3d scene within a sidecar slide, or swap the slide's media content out entirely for a different piece of content.
One way to configure a media action is to open the block palette in a sidecar slide and click Media action. You'll see a button appear.
Replace the pre-populated text within the button by typing in your own title. Then click the Add action button to expand a menu of the media option possibilities.
The three items closest to the bottom allow you to completely change the media element in that slide, to a different map, image, video, or embedded content.
If the slide contains a web map, web scene, or express map, you also have the option to edit the map's appearance by changing its zoom and extent and/or turning layers on or off. Let's go ahead and do that by clicking Edit map view.
You'll then be in the map designer, where you can adjust the map. In this case I've zoomed closer to a favorite Acadia National Park hike, and I've turned off map layers that aren't relevant to that outing.
I've added a button each for three favorite outings. A second click on a media action button returns readers to the previous map view.
You can also configure media actions that present as clickable "links" within the accompanying narrative text. This blog post offers a handy primer on media actions and their uses.
Map tour
The five distinct layouts of map tour.
Map tour allows you to plot points on a map and add media content and narrative text to those points that will display in either a side or floating panel, depending on your layout choice. There are two different types of map tour: Guided tour and Explorer tour. Each of those subsequently has multiple layout options of its own.
First we'll talk about guided tour, which lets you walk your audience through a set of places in sequential order. As readers scroll, the map's focus shifts from one tour stop to the next; accompanying text and media (photos and/or video) for that place are displayed alongside it.
Two layouts are available for guided tours. The map focused option puts images and descriptions in floating panels, with the map occupying the remainder of the screen. The media focused layout puts map and text in a side panel, letting your images become the stars of the show. In both layouts the map is interactive, so readers can explore on their own if they wish.
With guided tour, storytellers also have the option to start a tour at a specified number (helpful for making multiple guided tours throughout a story appear to be part of one unified tour), and/or to have a tour count down instead of up (fun for putting rankings and top 10 lists, etc., into a cartographic format).
Explorer tour offers a less linear experience. Points are plotted on the map, with a corresponding gallery of thumbnails in either list or grid form in the side panel. Clicking on any item on the map or in the side panel brings up its associated media and/or narrative information. The upshot is the reader can browse the points in whatever order they like.
Configuring a map tour has much in common with authoring a sidecar; the slide panel lets you add (up to 100 items), reorder, hide, and delete tour stops. You can add up to five images and videos to your stops, and you can also manually set the location and initial map zoom levels for each stop.
To save time, adding geotagged media (like a photo taken with a smartphone) will automatically place a point on the map at those coordinates. To save even more time, you can start a tour by uploading multiple images at once; each image will populate your tour with one point. Or, you can start a tour by linking it to an ArcGIS Online feature service with point data and using the relevant attribute fields to automatically fill in the title, description, and media for each stop on the tour. Tours created from a feature service also have access to a third explorer tour layout: Categorized, which uses another author-designated attribute field to divide the items in the tour up into thematic categories.
Like sidecar, map tour is also highly flexible in terms of changing layouts as you go. At any point, you can click on the options menu in the slide panel to switch between any of the four layouts of map tour. This transition is seamless, with no content getting lost in the process.
Though it's not technically an immersive block, swipe lets you elegantly compare two images or maps side by side. It's especially great for comparing related map themes. In the example below, we're looking at satellite imagery of the Esri headquarters campus vs. a topographic map, but you can imagine comparing, say, vegetation to soil types, or income levels to life expectancy. It's also ideal for then-and-now photographs.
Creating a swipe is easy: Find Swipe on the block palette, click, encounter this...
...and follow the instructions. Maps will automatically sync; setting the location and zoom level for one map will adjust both. If need be, you can even add the same web map to both sides of a swipe block, then toggle layers on or off in the map designer to compare different data within the same map.
As mentioned before, you can also add a swipe block to the media panel of a sidecar. In the floating layout, the narrative panel will fade out while the swipe handle is being dragged back and forth so that nothing is blocking the maps or images being compared.
ArcGIS StoryMaps' newest block introduces a temporal component, allowing storytellers to construct a sequence of "events" that can each be accompanied by a description and an image.
Select Timeline in the block palette...
...and you'll first be prompted to choose between two vertically-oriented layouts: Waterfall centers the event information and stacks them on top of each other, while Single side aligns the information to the right of a vertical line. Additional layouts, including horizontal options, are in the works, so stay tuned!
A fresh timeline block starts...
...with two empty events, but you can add more until you've reached a maximum of 20 by clicking the +button in between any two events or at the bottom of the timeline. That + button also provides an option to insert a dotted spacer between events to indicate a longer passage of time relative to others.
Hover over an event...
...and you will see three icons to the right-hand side. The left-most one is the familiar symbol for dragging an item; you can use this to reorder an event within the timeline. The middle icon allows you to add an image to that event (animated GIFs are supported!). Finally, the trash can icon deletes an event.
Note that images added to a timeline block will fill the allotted space, meaning that they may be cropped, depending on their aspect ratio. You can always change the focal point of the image in the image options (little gear button) to ensure that the most important part of the image will be visible.
Though sweeping historical sagas tend to first come to mind for timeline treatment, the block is actually quite versatile. It can be used for shorter-duration events, like a daily schedule; sequential instructions, such as a recipe; or even things that have nothing to do with time, like a top 10 ranking. For more details about timeline and ideas for how to use it creatively see this blog post.
By the way, you can also add a timeline to a narrative panel within a sidecar block!
Add an embed
A really cool feature of ArcGIS StoryMaps is the ability to incorporate other web content into your narrative, either as links or as fully interactive items. You can perform this magic via the embed block.
Choose Embed in the block palette, and copy in a URL or iframe code. In the screenshot below I've added a link to a Tweet:
Certain pre-approved web content, like Tweets, will appear in the story as a fully-interactive embed by default. Most embedded web content, however, will appear at first with some safeguards deployed to prevent their interactivity from conflicting with the reader's ability to scroll through the story. These come in the form of an initial "click to interact" prompt, along with a button in the upper right corner of the embed that will open it in a new browser tab. You can see both of these in the animation below.
An example of a live embed in action
Both of those settings can be turned off via the options menu (gear icon) at the top of the embed. Doing so useful when you want the reader to immediately be able to access the embedded content, particularly for embeds that don't have a lot of scrollable area or zoomable maps that might impede the flow of the story.
For readers using narrower screens — smartphones, or tablets in portrait mode, for instance — all embeds will appear as a stand-in that opens the content in a new tab, which is a much nicer experience on those smaller devices. The default form of the stand-in is a card, an example of which is seen here:
If you're not happy with the text or thumbnail that automatically appears in the card, you can change it to give readers a better sense of what they'll see if they choose to click on the card. Simply check the custom card details box in the embed options and edit the title, description, and thumbnail image to your liking. You can also opt for the embed to be represented simply by an image of your choosing.
Here are additional resources to help you master embeds, in the form of a blog post and a handy cheat sheet.
Adjust the design
One of the snazziest things about ArcGIS StoryMaps is the ability to make lots of design refinements.
In the builder's header there's a Design button. Click it, and a panel will open on the right side of your screen.
Choose a cover design
The first design choice is to change the cover layout for your story. You've got six choices; three of them fill the allotted space with the cover media (usually involving some cropping of the media), while the other three fit the entire media into the space. Here is a brief rundown of the six cover styles, from in the order that they're presented in the design panel:
Minimal (fill): This is the default for all brand new stories; comes with a horizontal strip for media above the title (so vertically oriented media isn't advisable here), though if you prefer to have no cover media at all, this is the best option.
Top (fit): Also positions the media above the title, but will show the whole piece of media.
The title card appearance options in the "Full" cover layout.
Full (fill): The media will occupy the entire cover space, with the title card superimposed on top of it, with the media darkened slightly so that the title, subtitle, byline, and date can be superimposed directly on top of it. Clicking the little paint palette icon on the outline of the text box will bring up some options for styling that title text — if you've already experimented with the floating panel layout of sidecar, these options will be familiar. You can remove that shading from the media and go with white or black text directly on top of the natural media (though this is only advisable if the media contains sufficient areas of contrast to the text). Alternatively, you can opt to fill in the background of the text box according to the story's design theme (more on that in just a second). You can also position the title panel in three positions, both horizontally and vertically, for a total of nine placement options, and adjust its width.
Card (fit): The title card will be "stacked" on top of the media, but off to one side to keep most of the media showing. You can adjust the title card's width (in three sizes), as well as whether it's on the left side of the right side of the media.
Split (fit): Another layout with the title to either side of the media with the entire media showing, but this time there will be no overlap of the title onto the media.
Side-by-side (fill): Similar to the split layout, except the media will fill the available space. You have the option to expand the space the title occupies relative to the media space, and vice versa.
The six cover layouts.
Choose a theme
Perhaps the coolest design panel item is Theme, with which you can change the the look and feel of your whole story with a single click on one of six pre-set themes. This story is using the Summit theme; clicking on Obsidian changes the background from white to black. It also changes the fonts and the accent color. You'll notice that it changes your express maps, too, utilizing a darker basemap to complement the story background. Several more pre-designed themes can be found in the Featured themes gallery; the currently available featured themes will rotate occasionally, but if you've applied one to a story it will still remain that story's theme until you change it.
Better yet, try creating your own custom theme! Our theme builder gives you lots of options to customize color palettes, fonts — including Google Fonts' open-source font library — quote blocks, separators, the basemap that's initially used in express maps and map tours, button links, and you can even add a logo. Click Browse my themes; if you haven't yet created a custom theme, you'll see this:
A click on Create new theme will escort you into the theme builder, where you can select any one of the six standard themes as a base from which to start creating your own custom theme. Once you've chosen your starting point, the panel on the left will change to reveal controls for editing a myriad of visual components of the theme.
A screenshot of the ArcGIS StoryMaps theme builder
In those theme controls, you can change colors, fonts, and other aesthetic elements as you go. Here's a tutorial with detailed instructions on using the theme builder, and here's a blog post with tips on getting the most out of the theme builder, from choosing tasteful color combinations to making good font choices, and more.
Once you've created custom themes, you can access them via the Manage link next to the "Theme" heading in the design panel, or through your My Projects page.
A screenshot of the ArcGIS StoryMaps "My Themes" page
The themes page looks much like your stories and collections pages. You can edit, delete, and add new themes from this page.
Enable optional sections
There's an additional handy item in the design panel that we haven't mentioned: It's the ability to toggle on and off story navigation and a credits section.
When you enable navigation, the heading 1 text types within your story become bookmarks that appear within a navigation bar. This also includes heading 1s within sidecar slides and in the credits section. When one of your readers clicks on an item in the nav bar, the story jumps to that section, or chapter, of the story.
If you mouse over the bar in the builder, a little gear icon appears; clicking on it brings up a control panel, with which you can turn off items or edit their text. The nav bar can handle up to thirty items.
The credits section adds a block at the end of your story, within which you can list data sources, image credits, and other footnote-style items. A two-column format lets you name and describe sources and incorporate hyperlinks. The section has a slightly different background than the rest of the story to visually separate it from the main narrative.
Add a logo
And wait — there's more!
The Logo section of the design panel allows you to add your own organization's logo to a couple of key places within a story: the header and/or the cover. You can set a logo to act as a link to a website if you choose, too. (You can also attach a logo to a custom theme.)
If you want a deeper dive into all the ways you can leverage the design panel you should check out this blog article (though some design panel features and functions have since changed, the advice is still very sound).
Creating accessible content
All of us should strive to maximize accessibility of our stories for people with visual impairments or other challenges. For instance, every piece of media in a story has an option for adding alternative text, which is a description of that media for the benefit of screen readers and other assistive technologies. Here's a whole story about best practices for creating accessible content in ArcGIS StoryMaps.
Publish and share
You might have noticed that there's no save button, but that the top bar is telling you that your story is saved, and is a draft. ArcGIS StoryMaps autosaves your story after every modification to it, down to individual keystrokes; no worries that a browser crash or other mishap will ruin hours of work.
Publish
You can preview your story at any point (the Preview function is next to Publish in the builder header) to see what it will look like in published form on PCs and laptops, on tablets, and on smartphones.
When you're ready to publish, go ahead and click Publish. You'll jump to a new page with two panels. On the left are options for configuring the Story card. Here you can determine the thumbnail image, story title, and a brief summary that will display, for instance, when the story is shared on social media or comes up in a search result. Note that, by default, changing these details will also be reflected in the ArcGIS Online item page for that story, but you can uncheck the box at the bottom of the Story card panel if you'd rather they didn't.
On the right are the sharing settings: Private means the story will be visible only to you; My organization makes it accessible to other people in your ArcGIS organization; Everyone makes your story public. You can also share your story to ArcGIS groups you're a part of by using the search box.
Below the sharing settings are two Advanced options. The first, Allow duplication, gives anyone to whom your story is visible the ability to create a copy of the story in their own account. The second checkbox determines whether your story will show up in web search results or not.
When you're satisfied with these settings, click Publish again in the upper right-hand corner. As part of the publishing process, the story checker will look for permissions issues with the maps in your story, and flag any maps or layers whose sharing permissions are more restrictive than that of your story.
Once you've published, you'll land on a page that makes it easy to immediately share your story by providing a button to copy the story link and a QR code that will bring up the story on mobile devices. You can leave that page via buttons that will either take you to view the published version of the story, or back into the story editor.
After publishing, you can return to editing the story at any time. When you do that, you'll notice that instead of seeing Draft in the top bar, you'll see Unpublished changes. That indicates that the edits you're making don't affect the published story until you publish again.
Clicking the three dots next to Publish opens the More actions menu and gives you a variety of options, including changing the sharing settings, discarding any unpublished changes, or unpublishing a published story story (this just reverts the story to draft mode; you can re-publish at any time).
Story settings is broken into three tabs. On the left is the Display tab, where you can choose to hide the easy-sharing menu that normally appears in the header of a published story; hide the story's cover (which will still be visible in the builder, so don't be worried that something isn't working when you first check this box); determine which date, if any, is displayed in the cover; and specify an intended language and date format for your story. Setting a language helps screen readers and web translators know what to do when they come across a story in a language that's different from the web browser's.
In the middle is the Analytics tab, which contains an option to add your Google or Adobe Analytics ID if you'd like to gather information about web traffic to your story (more on how that works here).
And on the right is the Advanced tab, where you can toggle an option that allows fancy external embedding tricks; most users won't need to take advantage of this, so you can likely leave that tab alone.
There's one more option in the More actions menu that we think you'll like: You can Duplicate your story. Click that, and everything in your story, as it currently exists within the builder, will be copied to a brand-new story. The only change: "(Copy)" will now appear at the beginning of the new story's title. (This is the same workflow for duplicating someone else's story if the author of that story has enabled duplication in the publish page settings.)
Duplicating your story gives you freedom to experiment with new approaches to your narrative while safely maintaining your story in its current form, or to create similar formats of stories that you can swap out the necessary information and media without having to rebuild the whole story from scratch every time.
Share your story (if you like)
If your published story is available to the public, you might want to promote it through platforms like Twitter or Facebook.
A key part of successful sharing is having an attractive card (or link preview) for your content. Lucky for you, ArcGIS StoryMaps generates these cards automatically:
On the back end, the builder takes your story's title, subtitle, and cover image, bringing them together in a card that is sure to stand out in endless social media feeds. As mentioned above, you can opt to manually change any of those elements, if desired, via the Story details portion of the publishing page. If at any point you change the image being referenced by the social card from your story, the card will automatically update to show whatever image you swapped in.
When viewing a publicly published story, there is also an icon in the header that opens up a Share modal, where you can quickly generate that share card for a few specific social media platforms, plus see a QR code that can be used to bring up the story on mobile devices.
In that modal, you can also select the Embed tab to reveal a copyable iframe code snippet that can be used to embed the story externally in another website or platform. If you're interested in external embedding, check out this blog post.
Make a collection
Last but by no means least, you can assemble suites of content — anything created in ArcGIS StoryMaps, as well as other Esri web applications, uploaded content, or embedded content — into collections. Collections can be created and accessed by selecting them in the output type menu at the left-hand side of your ArcGIS StoryMaps content page.
You can use collections to showcase your work, to combine related content on a particular theme, or to serve as a base for recurring content, like a newsletter. Collections can also be useful as a sort of virtual binder within which you can assemble, in a single place, an assortment of resources, including stories, configurable apps, dashboards, images, videos, PDFs, and any embeddable content from anywhere on the web. This can be useful for emergency management agencies, for instance, who need to make it easy for time-crunched responders to find important information in a single location.
You can also use collections to gather a series of stories into a "story book," in which case you can consider a collection as a table of contents, with each story serving as a chapter in a longer narrative.
We've given you three ways to enhance the look and feel of your collection via the Design option in the header. You can choose among three layout options: grid, magazine, and journal:
Collection layout options (left to right): grid, magazine, journal
For each of these, you also have the option of turning on a map view, in which half of the collection overview will be occupied by a map. You can then assign locations to items in the collection that represent place-based content and they will appear as pins on the map, allowing readers to explore the collection geographically.
Also in the design panel, you have a choice of three navigation options: compact, tabbed, and bulleted:
Collection navigation options: compact (top), tabbed, and bulleted
Finally you can apply a custom theme to a collection just like you can to a story.
There's one more important, story-based capability that I'd like to point out. Let's go back to the very beginning, to your My Stories page. You may have noticed, next to the Create story button, there was also a button to Create template (beta).
A template is a particular kind of story that you can use to provide a story structure and framework for others to easily follow, recreate, and build upon. When you start a new template, you'll see that it looks virtually identical to the story builder and functions the same, as well. The only differences are a banner running across the header that lets you know you're working on a template, and in the block palette, you'll notice a block in the Basic section titled Instructions. This block adds a boxed-in text "aside" where you can provide information for anyone following the template about how to go about completing the story.
A screenshot of an instructions block reading "The template's Instructions block is seen here as a screenshot, but it will appear as real text in an actual template."
When you're ready to publish a template, you'll notice on the Publish settings page that the "Allow duplication" box is checked, with no way to uncheck it — that's because the whole point of templates is to allow others to build their own story from a copy of a template. You can still adjust the privacy setting of a template as desired.
When viewing a published template, that helpful banner will be present again to remind you that you're viewing a template, and this time, a button in the header prompts you to Create story from template. Doing so creates a copy of the template in your own account, but as a story, not a template, and drops you into the builder for that story.
When editing a story that was created from a template, you'll be able to see, edit, and remove any instruction blocks that were included with the template (but you won't be able to add new instruction blocks). When you publish that story, any remaining instruction blocks will not be visible in the story viewer.
The green strip and symbol in the upper left-hand corner of an item card indicates that it is a template.
Once you've created some templates, you can access them through your My stories page. In the default view, all of your stories and templates will be visible; templates will be marked with a green strip and icon at the top of their item card. You can also filter the view to show just stories or just templates, using the drop-down menu (initially labelled "Content") below the My content tab. create a template from any published story that you have viewing privileges for that has the "allow duplication" box checked. You can do this either from the more actions (three dots) menu in the story viewer or from the story's item card in your ArcGIS StoryMaps content page.
Oh, and you can create a template from any published story for which you have viewing privileges that has the "allow duplication" box checked. You can do this either from the more actions (three dots) menu in the story viewer or from the story's item card in your ArcGIS StoryMaps content page.
Templates have the potential for all kinds of functions, from providing instructions for students to complete a school assignment, to guiding volunteers through how to create a compelling narrative to support a local initiative, to setting up an intra-organizational model for a report. We're excited to see how our community puts them to use! To help you get started with templates, check out this blog post.
A note about briefings
Briefings are the fourth type of ArcGIS StoryMaps output, and the only one we haven't really mentioned so far in this primer. Briefings are intended to be a shorter-form storytelling tool that's geared more for presentations and other kinds of simple information sharing, rather than the longer narrative form that stories lend themselves to.
Briefings are built and organized through your My content page, just like the other content types, and the briefing builder functions pretty similarly to the story builder. They are based on a series of horizontal slides that are clicked through one by one, or navigated via an expandable table of contents. Those slides can be populated by many of the same features that exist in the story block palette, namely text and a few types of media and maps, but they're rather more space-limited, so efficiency is the name of the game when it comes to briefings.
An example of what briefings look like in ArcGIS StoryMaps.
One thing that's especially cool about briefings is that they have their own complementary tablet app for on-the-go viewing, and briefings can even be downloaded onto the tablet for viewing in situations without an Internet connection. As the creator of a briefing, you have the ability to provide alternative media for offline viewing in lieu of maps, 3d scenes, and embeds.
To learn more about briefings and their purpose, this blog post is a good place to start. We also have a step-by-step tutorial if you're interested in digging more into how to build your own briefings.
We hope you'll have fun using the ArcGIS StoryMaps builder. Please let us know how it's going, and whether you have suggestions for improvements.
And please plan to come back to this tutorial. We'll be updating it as we add new features.
This story was created by the StoryMaps team using ArcGIS StoryMaps. Learn more about this next-generation storytelling tool — and try it yourself — here.
Image gallery in action
The undo/redo mechanisms occupy a prominent location in the builder.
The five distinct layouts of map tour.
An example of a live embed in action
The title card appearance options in the "Full" cover layout.
Collection layout options (left to right): grid, magazine, journal
Collection navigation options: compact (top), tabbed, and bulleted
The green strip and symbol in the upper left-hand corner of an item card indicates that it is a template.