Cross service header example

With service navigation links

The header has space to optionally add links to different parts of your service, just as the current ‘service header’ component from the Design System does. Follow the same patterns for internal service navigation links as you do with the Design System service header.

How it looks (preview)

GOV.UK

GOV.UK email subscriptions

How to call this example

<%= render "govuk_publishing_components/components/cross_service_header", {
  show_account_layout: true,
  show_cross_service_header: true,
  product_name: "GOV.UK email subscriptions",
  one_login_navigation_items: {
    one_login_home: {
      href: "#",
      data: {
        module: "explicit-cross-domain-links"
      }
    },
    one_login_sign_out: {
      text: "Sign out",
      data: {
        module: "explicit-cross-domain-links"
      }
    }
  },
  service_navigation_items: [
    {
      text: "Example link 1",
      href: "#"
    },
    {
      text: "Example link 2",
      href: "#"
    },
    {
      text: "Example link 3",
      href: "#"
    }
  ]
} %>