Link Search Menu Expand Document

Embed immersive content and media to the Story Map

Sidecar

1 Click the green plus button and select sidecar to add an immersive block with media panel and narrative panel. There are three layouts of sidecar, Docked, Floating and Slideshow. Feel free to select any of them work best for your story, but select Docked for this workshop.

Insert descriptive text

2 Click the green plus button inside sidecar narrative panel and select text to add some population data about the city of Abbotsford:

About Abbotsford

Area: 375.6 km2

Population: 149,928

Population density: 399 residents per km2

Embed a map

3 Click the Add inside the media panel and select Map to add the Population of the City of Abbotsford web map created in previous section. Then, adjust the map extent and click Options on the left sidebar to display the legend of the map. click_on_ribbon

4 Add a new slide by clicking the green plus button in the side bar. Then, repeat Step 10 and 11 for the “Flood Risk of the City of Abbotsford” and add the descriptive text below:

“Floods are common on the West coast of Canada and can happen any time of the year. Thus, it is significant for residents to be prepared for future flooding events. The flood risk map illustrates the flood risk of the city of Abbotsford in five levels: low, mid-low, medium, mid-high, and high.”

Slideshow

5 Click the green plus button and select slideshow to add a full-screen, media-focused layout with minimal accompanying text.

Swipe

6 Click the Add and select Swipe let readers easily compare two maps or images with an interactive slider. Add the before and after floods image provided in the downloaded .zip.

7 Then, click the textbox and add the following descriptive text:

“What you should do if you must evacuate?

  • Always follow the instruction of local emergency officials.
  • Ensure each family member has waterproof clothing and footwear.
  • Lock all doors and windows and ensure gas, electricity and water are shut off (the City of Abbotsford)”

click_on_ribbon

8 Add a new slide by clicking the green plus button in the side bar. Then, click the add and select color to change the background to a single color and add the descriptive text below:

“What should you do after a flood?

  • Check if the water supply is safe to drink.
  • Avoid drinking floodwater since it may be contaminated or electrically charged.
  • Return home only when authorities indicate it is safe
  • Contact insurance and utility companies”

The city of Abbotsford

Map tour

9 Let us explore some Tourism Attraction in the city of Abbotsford. Click the green plus button on the main page and select map tour to showcase a set of places your readers can explore in any order, or be led through one at a time. Choose start from scratch. Then select guided and map focus as layout.

10Click the add image to add your prepared image here or insert a link: https://www.flickr.com/photos/spetersongallery/38464945140

11 Click the green plus button within the text box to add a title Mill Lake and add “Take me to Google Street View” into a Button.

You can use google map to find the Google Street View of Mill Lake, and copy the link to the Button by clicking the Edit.

click_on_ribbon

12Then, click add location and search and add the location of Mill Lake, BC to the map

click_on_ribbon

13 Add a new slide by clicking the green plus button in the side bar. Then, repeat Step 15 and 16 to add one more tourism attraction in the city of Abbotsford by yourself.

There are two options of zoom level. Use map tour setting will automatically adjust the zoom level so all points are visible simultaneously. Use current zoom level will keep the zoom level always be street or city. The zoom level can be changed in map option.

The Map Options on the top right corner of Map Tour can adjust the map appearance, such as zoom level, basemap, point color and map type (2D or 3D).