What are Story Maps? 

Story maps are interactive maps that allow you to highlight the spatial aspects of a story in a visually engaging way. The university supports the story map software Story Map JS. 

What is Story Map jS?

Story Map JS is a free tool that allows users to create an interactive map that highlights the spatial aspect of a narrative through a map, text, videos, and images. Maps created through Story Map JS can be embedded into a WordPress site. 

Instructions

Sign In
  1. Go to Story Map JS homepage 
  2. Click on "Make a StoryMap"
  3. Sign in with Google 
Instructions for Making a map 
Create a New Map 
  1. Click on green "New" button                                   
  2. Type a title for the map 
  3. Click on the green "create" button                           
  4. Click on the "add slide" box on the right side of the screen
  5. Add a title for the stop in the "Headline" box
  6. In the text box under "Headline" add the information about the stop
  7. Add an image or video by copying and pasting the image/video URL. OR Upload an image from your device by clicking on "upload an image" then choose an image file.
  8. Cite the image in the "credit" box
  9. Describe the image in the "caption" box
  10. In the box highlighted in red add location by typing the street address or coordinates
  11. Repeat steps 4-11 until you done telling your story 
Change Map background 
  1. Click on the "Option" button in the top left of the screen                               
  2. Select "Display"
  3. Go to "Map Type" 
  4. Chose a new Map Type by selecting the map name 
  5. Click "Close"           
Save Your progress 
  1. Click Save in upper left corner     
  2. Click on "Publish Changes" next to the Save button
  3. To view saved changes select the blue "Preview" next to "Edit"  
Embed on Wordpress website 
  1. Click on "Options" in upper left corner                                                           
  2. Select "Sharing" 
  3. Click on "Open Sharing Settings"
  4. Scroll down until you see the "Embed" section 
  5. Copy the code under "Embed" 
  6. Click "Close"                                     
  7. Login to your Wordpress site
  8. Navigate to the page on the website you want to add the map 
  9. Click the blue plus in the upper left hand corner 
  10. Scroll down until you see "Custom HTML" and select it
  11. Paste the code you copied into the text box that says "Write HTML"
  12. Click "Save"