Step by step navigation example

Remember last opened step

If steps are opened their IDs are added to an array in sessionStorage, so that if the user returns to this page in the same session, those steps will be opened on page load. This option can technically be used together with the option to open a step by default, but this is not recommended as it could confuse users.

How it looks (preview)

1. Step 1: Remember this

   Hello!

2. Step 2: Or this

   Hello!

How to call this example

<%= render "govuk_publishing_components/components/step_by_step_nav", {
  remember_last_step: true,
  steps: [
    {
      title: "Remember this",
      contents: [
        {
          type: "paragraph",
          text: "Hello!"
        }
      ]
    },
    {
      title: "Or this",
      contents: [
        {
          type: "paragraph",
          text: "Hello!"
        }
      ]
    }
  ]
} %>