1. Component Guide
  2. Meta Tags
Component

Meta Tags

Meta tags to provide analytics information about the current page

This takes a content-store links hash like object which it can then turn into the correct analytics identifier metadata tags.

These are additionally used by the GOV.UK browser extension to provide details about a given page.

The code which reads the meta tags can be found in custom-dimensions.js.

Search for usage of this component on GitHub

How it looks (preview) (preview all)

<meta name="govuk:format" content="html_publication">
  <meta name="govuk:publishing-application" content="whitehall">
  <meta name="govuk:schema-name" content="html_publication">
  <meta name="govuk:content-id" content="00000000-0000-0000-0000-00000000000">
  <meta name="govuk:navigation-page-type" content="Taxon Page">
  <meta name="govuk:section" content="business tax">
  <meta name="govuk:withdrawn" content="withdrawn">

How to call this component

<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    document_type: "html_publication",
    publishing_app: "whitehall",
    schema_name: "html_publication",
    content_id: "00000000-0000-0000-0000-00000000000",
    navigation_page_type: "Taxon Page",
    section: "business tax",
    withdrawn_notice: true
  }
} %>

Accessibility acceptance criteria

The analytics meta tags component should not be visible to any users.

Other examples

With content history tags (preview)

The tags in this object will generate the content-has-history tag, set to true. This tag is triggered when either, within content_item:

  1. public_updated_at and first_public_at within details are both present and they aren’t the same value
  2. change_history within details is present and it has a value of more than 1

See below example for specific details.

<meta name="govuk:content-has-history" content="true">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    public_updated_at: "2021-01-15T12:30:45.000+00:00",
    details: {
      first_public_at: "2020-11-03T09:15:00.000+00:00",
      change_history: "5"
    }
  }
} %>

With date and postcode stripping for static analytics (preview)

<meta name="govuk:static-analytics:strip-dates" content="true">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: null,
  local_assigns: {
    strip_dates_pii: true,
    strip_postcodes_pii: true
  }
} %>

With organisations (preview)

<meta name="govuk:analytics:organisations" content="&lt;D1&gt;&lt;D3&gt;&lt;EO3&gt;">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    links: {
      organisations: [
        {
          analytics_identifier: "D1"
        },
        {
          analytics_identifier: "D3"
        }
      ],
      worldwide_organisations: [
        {
          analytics_identifier: "EO3"
        }
      ]
    }
  }
} %>

With world locations (preview)

<meta name="govuk:analytics:world-locations" content="&lt;WL3&gt;">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    links: {
      world_locations: [
        {
          analytics_identifier: "WL3"
        }
      ]
    }
  }
} %>

With political tags (preview)

<meta name="govuk:political-status" content="political">
  <meta name="govuk:publishing-government" content="2010-to-2015-conservative-and-liberal-democrat-coalition-government">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    details: {
      political: true,
      government: {
        current: true,
        slug: "2010-to-2015-conservative-and-liberal-democrat-coalition-government"
      }
    }
  }
} %>

With historic political tags (preview)

<meta name="govuk:political-status" content="historic">
  <meta name="govuk:publishing-government" content="2010-to-2015-conservative-and-liberal-democrat-coalition-government">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    details: {
      political: true,
      government: {
        current: false,
        slug: "2010-to-2015-conservative-and-liberal-democrat-coalition-government"
      }
    }
  }
} %>

With non-political tags (preview)

<meta name="govuk:political-status" content="non-political">
  <meta name="govuk:publishing-government" content="2010-to-2015-conservative-and-liberal-democrat-coalition-government">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    details: {
      political: false,
      government: {
        slug: "2010-to-2015-conservative-and-liberal-democrat-coalition-government"
      }
    }
  }
} %>

With taxonomy added via document type (preview)

You can trigger taxonomy tag rendering by either including a document_type attributes of “taxon” or including the parent_taxons or taxons attributes under the links attribute.

<meta name="govuk:format" content="taxon">
  <meta name="govuk:content-id" content="00000000-0000-0000-0000-000000000000">
  <meta name="govuk:themes" content="example-of-taxons">
  <meta name="govuk:taxon-id" content="00000000-0000-0000-0000-000000000000">
  <meta name="govuk:taxon-ids" content="00000000-0000-0000-0000-000000000000">
  <meta name="govuk:taxon-slug" content="example-of-taxons">
  <meta name="govuk:taxon-slugs" content="example-of-taxons">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    content_id: "00000000-0000-0000-0000-000000000000",
    document_type: "taxon",
    base_path: "/example-of-taxons"
  }
} %>

With taxonomy added via links (preview)

<meta name="govuk:themes" content="childcare-parenting, disabilities-benefits">
  <meta name="govuk:taxon-id" content="11111111-1111-1111-1111-111111111111">
  <meta name="govuk:taxon-ids" content="11111111-1111-1111-1111-111111111111,22222222-2222-2222-2222-222222222222">
  <meta name="govuk:taxon-slug" content="disabilities-benefits">
  <meta name="govuk:taxon-slugs" content="disabilities-benefits,childrens-social-care-providers">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    links: {
      taxons: [
        {
          content_id: "11111111-1111-1111-1111-111111111111",
          document_type: "taxon",
          base_path: "/disabilities-benefits"
        },
        {
          content_id: "22222222-2222-2222-2222-222222222222",
          document_type: "taxon",
          base_path: "/childcare-parenting/childrens-social-care-providers",
          links: {
            parent_taxons: [
              {
                content_id: "33333333-3333-3333-3333-333333333333",
                document_type: "taxon",
                base_path: "/childcare-parenting"
              }
            ]
          }
        }
      ]
    }
  }
} %>

With multiple step by step tags (preview)

<meta name="govuk:stepnavs" content="00000000-0000-0000-0000-000000000000,11111111-1111-1111-1111-111111111111">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    links: {
      part_of_step_navs: [
        {
          content_id: "00000000-0000-0000-0000-000000000000"
        },
        {
          content_id: "11111111-1111-1111-1111-111111111111"
        }
      ]
    }
  }
} %>

With primary step by step tag (preview)

<meta name="govuk:stepnavs" content="00000000-0000-0000-0000-000000000000">
  <meta name="govuk:navigation-page-type" content="Primary step by step shown">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    links: {
      part_of_step_navs: [
        {
          content_id: "00000000-0000-0000-0000-000000000000"
        }
      ]
    }
  }
} %>

With secondary step by step tag (preview)

<meta name="govuk:navigation-page-type" content="Secondary step by step shown">
<%= render "govuk_publishing_components/components/meta_tags", {
  content_item: {
    links: {
      secondary_to_step_navs: [
        {
          content_id: "22222222-2222-2222-2222-222222222222"
        }
      ]
    }
  }
} %>