Open the experience

You’ll start by opening the experience that was created in the earlier tutorial.

  1. If you completed the previous tutorial, Resize widgets for smaller screens, reopen your American River Marine Estuary experience and skip to the next section.
    Note:

    If you don’t know how to find the experience, open ArcGIS Experience Builder and sign in with your ArcGIS account. Your experience will be listed on the Recent experiences page.

  2. If you did not complete the previous tutorial, open ArcGIS Experience Builder and sign in with your ArcGIS account.
    Note:

    If you don't have an ArcGIS account, see options for software access.

    The Recent experiences page appears.

  3. Click the Create new button.

    Create new button

  4. Click the ArcGIS Online tab.

    ArcGIS Online tab

  5. In the search bar, type estuary tutorial template 4.
  6. On the American River Marine Estuary Tutorial Template 4 card, click the Create button.

    Create button on the American River Marine Estuary template card

    The canvas appears, showing the experience created so far. It includes a map, a header, a column with more widgets, and a button that opens a window.

    Full view of the experience template

  7. On the builder toolbar, click the title and rename it American River Marine Estuary.

    Experience title

Preview and publish the experience

To make a web experience visible to the public, you must publish it and update its sharing privileges. Before you do so, you’ll test the app in a preview.

Note:

You can review map layouts using a cartography checklist to determine if anything is missing or should be changed.

  1. On the builder toolbar, click the Preview button.

    Preview button

    A new browser tab appears, showing the experience as it will appear for users. While you can preview the app in this view, other people cannot see it until it is published and shared.

    Full view of the experience

  2. Explore and test the map: test the switch map button, the bookmarks, the Swipe tool, and the About this map button.
  3. Close the preview browser tab.
  4. In Experience Builder, on the builder toolbar, click Publish.

    Publish button

    The experience is now published, but it also must be shared before others can see it.

  5. Click the More button and click Change share settings.

    Change share settings

    The item page appears for the experience.

  6. Click Share.

    Share button

  7. In the Share window, click Everyone (public) and click Save.
  8. Close the item page browser tab.
  9. In Experience Builder, on the builder toolbar, click the More button. Click Copy published item link.

    Copy published item link

    You can send this link to your client so they can embed it in their kiosk and on their website.

    You can continue to make changes to the app after it is published. When you save changes to a published experience, they will be visible in the editor and in its preview. However, the changes won’t be visible to the public until you click the Publish button.

Save a template

Your client is happy with your layout and asks if you can make more maps for other locations. You’ll save your experience as a template so you don’t need to rebuild the layout for each project.

  1. On the builder toolbar, click the More button and click Generate template.

    Generate template

    The page refreshes. A pop-up window on the builder toolbar includes a reminder that you are now working on an experience template instead of an experience.

    Got it button

  2. Click the title and rename it American River Marine Estuary Template.

    Template title

  3. On the builder toolbar, click Publish.
  4. Click the More button and click Change share settings.

    Change share settings

  5. In the item page, click Share.

    Earlier, you chose to share the experience with everyone because it was intended as a public-facing app. However, you’ll share the template just with people within your organization, so they can make more layouts like it.

  6. Click Organization.

    Organization

  7. Click Save.
  8. Copy the URL for the item page to send to your colleagues.

    Once on this page, you or anyone else in your organization can click Create Web Experience to start a new experience from your template.

    Create Web Experience button

In this tutorial, you previewed, published, and shared an experience and an experience template. In this tutorial series, you built an interactive layout to present two web maps of a marine estuary. You learned how to add and configure widgets and windows, different methods for adjusting the size and position of widgets, how to arrange a layout with rows and columns, how to adjust an experience’s theme, and how to update a source map. You also learned some principles of map layout design.

You can find more tutorials in the tutorial gallery.