Skip to main content

Patterns Get help

Open this example (Get help) in a new window 
<details class="govuk-details">
  <summary class="govuk-details__summary">
    <span class="govuk-details__summary-text">
      Contact the claims team for help
    </span>
  </summary>
  <div class="govuk-details__text">

    <p>
      Telephone<br>
      <a href="tel:08081570385" class="govuk-link">0808 157 0385</a>
    </p>

    <p>
      Outside UK<br>
      <a href="tel:+441632960847" class="govuk-link">+44 1632 960847</a>
    </p>

    <p>
      Email<br>
      <a href="mailto:myservicesupport@justice.gov.uk" class="govuk-link">myservicesupport@justice.gov.uk</a>
    </p>

    <p>
      Opening times<br>
      Monday to Friday: 8am to 6pm
    </p>

    <p>
      Closed on bank holidays.
    </p>

  </div>
</details>


{% from "govuk/components/details/macro.njk" import govukDetails %}

{% set contactHTML %}
<p>
  Telephone<br>
  <a href="tel:08081570385" class="govuk-link">0808 157 0385</a>
</p>

<p>
  Outside UK<br>
  <a href="tel:+441632960847" class="govuk-link">+44 1632 960847</a>
</p>

<p>
  Email<br>
  <a href="mailto:myservicesupport@justice.gov.uk" class="govuk-link">myservicesupport@justice.gov.uk</a>
</p>

<p>
  Opening times<br>
  Monday to Friday: 8am to 6pm
</p>

<p>
  Closed on bank holidays.
</p>
{% endset %}

{{ govukDetails({
  summaryText: "Contact the claims team for help",
  html: contactHTML
}) }}

When to use

Help users get help from within the digital service.

How to use

Put the component at the bottom of every page of your service.

Determine which combination of channels are best for your service:

  • Telephone
  • Email
  • Webchat
  • Contact form

You’ll need to get agreement of where issues will be sent, who will read it and who will respond to it.

Each service will need to determine the best combination of help channels they offer to users. They will also need to determine the response time.

Contact form

Contact form fields can include:

  • What do you need help with (textarea)
  • Reference number if applicable (text input)
  • Your email address (Email input)
  • Your telephone number (Telephone input)

Tell users what the response time before the form and when it’s submitted successfully.

The form should also send additional data automatically like:

  • page url
  • date and time of submission

This will let customer support staff triage the issue and respond quickly.

Get help and contribute

Get help

You can contact the MoJ Design System team for help or support using this pattern.

Help improve this pattern

The MoJ Design System team would like to hear:

  • how you have used this pattern in your service
  • any feedback you have about its usage, for example accessibility or ideas for improvement

Add these comments to the get help discussion on GitHub.