Public layout example
With emergency banner
This allows the HTML for the emergency banner to be added to the page in the correct place. This is only the slot for the emergency banner - the markup for the banner needs to be passed in.
How it looks (preview)
<!DOCTYPE html>
<!--[if lt IE 9]><html class="lte-ie8 govuk-template" lang="en"><![endif]-->
<!--[if gt IE 8]><!--><html class="govuk-template" lang="en"><!--<![endif]-->
<head>
<meta charset="utf-8" />
<title>GOV.UK - The best place to find government services and information</title>
<script src="/assets/govuk_publishing_components/vendor/lux/lux-measurer-a2002530433042d7fa39cfe4320807d21db87c2295a7b247b8c6f1c76783ef25.js" async="async"></script>
<script src="/assets/govuk_publishing_components/rum-loader-4b2c0ed1c13efb6bdcde52d8f50a127abba38769ae89685475f4c351beff209b.js" async="async" data-lux-reporter-script="/assets/govuk_publishing_components/vendor/lux/lux-reporter-73c06d3df87aae4789194ac41054bd5f220550db96419275eaf9b116b76b0cac.js"></script>
<meta name="govuk:components_gem_version" content="35.5.0" />
<script src="/assets/govuk_publishing_components/load-analytics-6217b8cdcc0410ce58e481c57da88f70305017e69d9bf3f2c6f23a3040f4df36.js"></script>
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="o-weB38x5Njza-gsaMEJHY_k_gbuF0g4uU3xSgtHcccOp2gTpOlP0ZZfmFSeAJ4FC9hu2nk9-OPYsuU98AKN2g" />
<link rel="stylesheet" href="/assets/application-e9d6236b6e5602bb53e64a0869681eb482b87515964559b12e35928016406169.css" media="all" />
<!--[if lt IE 9]><script src="/assets/govuk_publishing_components/ie-a4524544a53d57a7e259b4bb966b9c32557c98c920b77e52d09304642b68401a.js" crossorigin="anonymous"></script><![endif]-->
<link rel="shortcut icon" href="/assets/favicon-6921a31b023a41929073393bdad00077436c3835994079bcd2e437261875b2fc.ico" type="image/x-icon" />
<link rel="mask-icon" href="/assets/govuk-mask-icon-de738c3fcce8ce2a91b67e89787090dc24a5cda0275ab6b75f6226c5b9619d3d.svg" color="#0b0c0c">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/govuk-apple-touch-icon-180x180-ea1cbb1cbbeddfff275dfa6e8e46b84cd530892df79dc4882a8f99b802b49a90.png">
<link rel="apple-touch-icon" sizes="167x167" href="/assets/govuk-apple-touch-icon-167x167-181e404a50c572923285fb83f0fbd78da6b4e38e3ce52f8e6b8e29da8586450a.png">
<link rel="apple-touch-icon" sizes="152x152" href="/assets/govuk-apple-touch-icon-152x152-02457fcdcee8d309276305af2233d41bfb8fd055e855727d355e61bce7ffa9bb.png">
<link rel="apple-touch-icon" href="/assets/govuk-apple-touch-icon-a318f305290c523aed80082456175b46c95350c0eeac93f42e78a71c7a55544e.png">
<meta name="theme-color" content="#0b0c0c" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta property="og:image" content="/assets/govuk-opengraph-image-a1f7d89ffd0782738b1aeb0da37842d8bd0addbd724b8e58c3edbc7287cc11de.png">
</head>
<body class="gem-c-layout-for-public govuk-template__body">
<script nonce="y+VQPvlt+SbWxNvN7S3E/A==">
//<![CDATA[
document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');
//]]>
</script> <a class="gem-c-skip-link govuk-skip-link govuk-!-display-none-print" data-module="govuk-skip-link" href="#content">Skip to main content</a>
<div id="global-cookie-message" class="gem-c-cookie-banner govuk-clearfix govuk-cookie-banner js-banner-wrapper" data-module="cookie-banner" data-nosnippet role="region" aria-label="Cookies on GOV.UK">
<div class="govuk-cookie-banner__message govuk-width-container">
<div class="govuk-grid-row">
<div class="govuk-grid-column-two-thirds">
<h2 class="govuk-cookie-banner__heading govuk-heading-m">Cookies on GOV.UK</h2>
<div tabindex="-1" class="govuk-cookie-banner__content gem-c-cookie-banner__confirmation">
<span class="gem-c-cookie-banner__content"><p class='govuk-body'>We use some essential cookies to make this website work.</p><p class='govuk-body'>We’d like to set additional cookies to understand how you use GOV.UK, remember your settings and improve government services.</p><p class='govuk-body'>We also use cookies set by other sites to help us deliver content from their services.</p></span>
<p class="gem-c-cookie-banner__confirmation-message--accepted govuk-body" hidden>You have accepted additional cookies. <span class="gem-c-cookie-banner__confirmation-message">You can <a class="govuk-link" data-module="gem-track-click" data-track-category="cookieBanner" data-track-action="Cookie banner settings clicked from confirmation" href="/help/cookies">change your cookie settings</a> at any time.</span></p>
<p class="gem-c-cookie-banner__confirmation-message--rejected govuk-body" hidden>You have rejected additional cookies. <span class="gem-c-cookie-banner__confirmation-message">You can <a class="govuk-link" data-module="gem-track-click" data-track-category="cookieBanner" data-track-action="Cookie banner settings clicked from confirmation" href="/help/cookies">change your cookie settings</a> at any time.</span></p>
</div>
</div>
</div>
<div class="js-confirmation-buttons govuk-button-group">
<button class="gem-c-button govuk-button" type="submit" data-module="gem-track-click" data-accept-cookies="true" data-track-category="cookieBanner" data-track-action="Cookie banner accepted" data-cookie-types="all">Accept additional cookies</button>
<button class="gem-c-button govuk-button" type="submit" data-module="gem-track-click" data-reject-cookies="true" data-track-category="cookieBanner" data-track-action="Cookie banner rejected">Reject additional cookies</button>
<a class="govuk-link" href="/help/cookies">View cookies</a>
</div>
<div hidden class="js-hide-button govuk-button-group">
<button class="gem-c-cookie-banner__hide-button govuk-button" data-hide-cookie-banner="true" data-module="gem-track-click" data-track-category="cookieBanner" data-track-action="Hide cookie banner">Hide this message</button>
</div>
</div>
</div>
<header class="gem-c-layout-header govuk-header gem-c-layout-header--no-bottom-border" role="banner" data-module="govuk-header">
<div class="govuk-header__container govuk-width-container">
<div class="govuk-grid-row">
<div class="gem-c-layout-header__logo govuk-grid-column-two-thirds">
<div class="govuk-header__logo gem-c-header__logo">
<a href="/" class="govuk-header__link govuk-header__link--homepage" data-module="gem-track-click" data-track-category="homeLinkClicked" data-track-action="homeHeader">
<span class="govuk-header__logotype gem-c-header__logotype header-logo">
<!--[if gt IE 8]><!-->
<svg aria-hidden="true" focusable="false" class="govuk-header__logotype-crown" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 132 97" height="30" width="36">
<path fill="currentColor" fill-rule="evenodd" d="M25 30.2c3.5 1.5 7.7-.2 9.1-3.7 1.5-3.6-.2-7.8-3.9-9.2-3.6-1.4-7.6.3-9.1 3.9-1.4 3.5.3 7.5 3.9 9zM9 39.5c3.6 1.5 7.8-.2 9.2-3.7 1.5-3.6-.2-7.8-3.9-9.1-3.6-1.5-7.6.2-9.1 3.8-1.4 3.5.3 7.5 3.8 9zM4.4 57.2c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.5-1.5-7.6.3-9.1 3.8-1.4 3.5.3 7.6 3.9 9.1zm38.3-21.4c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.6-1.5-7.6.3-9.1 3.8-1.3 3.6.4 7.7 3.9 9.1zm64.4-5.6c-3.6 1.5-7.8-.2-9.1-3.7-1.5-3.6.2-7.8 3.8-9.2 3.6-1.4 7.7.3 9.2 3.9 1.3 3.5-.4 7.5-3.9 9zm15.9 9.3c-3.6 1.5-7.7-.2-9.1-3.7-1.5-3.6.2-7.8 3.7-9.1 3.6-1.5 7.7.2 9.2 3.8 1.5 3.5-.3 7.5-3.8 9zm4.7 17.7c-3.6 1.5-7.8-.2-9.2-3.8-1.5-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.3 3.5-.4 7.6-3.9 9.1zM89.3 35.8c-3.6 1.5-7.8-.2-9.2-3.8-1.4-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.4 3.6-.3 7.7-3.9 9.1zM69.7 17.7l8.9 4.7V9.3l-8.9 2.8c-.2-.3-.5-.6-.9-.9L72.4 0H59.6l3.5 11.2c-.3.3-.6.5-.9.9l-8.8-2.8v13.1l8.8-4.7c.3.3.6.7.9.9l-5 15.4v.1c-.2.8-.4 1.6-.4 2.4 0 4.1 3.1 7.5 7 8.1h.2c.3 0 .7.1 1 .1.4 0 .7 0 1-.1h.2c4-.6 7.1-4.1 7.1-8.1 0-.8-.1-1.7-.4-2.4V34l-5.1-15.4c.4-.2.7-.6 1-.9zM66 92.8c16.9 0 32.8 1.1 47.1 3.2 4-16.9 8.9-26.7 14-33.5l-9.6-3.4c1 4.9 1.1 7.2 0 10.2-1.5-1.4-3-4.3-4.2-8.7L108.6 76c2.8-2 5-3.2 7.5-3.3-4.4 9.4-10 11.9-13.6 11.2-4.3-.8-6.3-4.6-5.6-7.9 1-4.7 5.7-5.9 8-.5 4.3-8.7-3-11.4-7.6-8.8 7.1-7.2 7.9-13.5 2.1-21.1-8 6.1-8.1 12.3-4.5 20.8-4.7-5.4-12.1-2.5-9.5 6.2 3.4-5.2 7.9-2 7.2 3.1-.6 4.3-6.4 7.8-13.5 7.2-10.3-.9-10.9-8-11.2-13.8 2.5-.5 7.1 1.8 11 7.3L80.2 60c-4.1 4.4-8 5.3-12.3 5.4 1.4-4.4 8-11.6 8-11.6H55.5s6.4 7.2 7.9 11.6c-4.2-.1-8-1-12.3-5.4l1.4 16.4c3.9-5.5 8.5-7.7 10.9-7.3-.3 5.8-.9 12.8-11.1 13.8-7.2.6-12.9-2.9-13.5-7.2-.7-5 3.8-8.3 7.1-3.1 2.7-8.7-4.6-11.6-9.4-6.2 3.7-8.5 3.6-14.7-4.6-20.8-5.8 7.6-5 13.9 2.2 21.1-4.7-2.6-11.9.1-7.7 8.8 2.3-5.5 7.1-4.2 8.1.5.7 3.3-1.3 7.1-5.7 7.9-3.5.7-9-1.8-13.5-11.2 2.5.1 4.7 1.3 7.5 3.3l-4.7-15.4c-1.2 4.4-2.7 7.2-4.3 8.7-1.1-3-.9-5.3 0-10.2l-9.5 3.4c5 6.9 9.9 16.7 14 33.5 14.8-2.1 30.8-3.2 47.7-3.2z"></path>
</svg>
<!--<![endif]-->
<!--[if IE 8]>
<img src="/assets/govuk-logotype-crown-0cdbde943be3a6518a5d7c00b607d134f4d5e3d0e8c68a1bfa2dc81f1f3edc4e.png" alt="" class="govuk-header__logotype-crown-fallback-image" width="36" height="32">
<![endif]-->
<span class="govuk-header__logotype-text">
GOV.UK
</span>
</span>
</a>
</div>
</div>
<div class="govuk-grid-column-one-third gem-c-layout-header__search">
<button
class="search-toggle js-header-toggle"
data-search-toggle-for="search"
data-button-name="search"
data-show-text="Show search"
data-hide-text="Hide search"
>
Show search
</button>
<form
action="/search"
class="gem-c-layout-header__search-form govuk-clearfix"
id="search"
method="get"
role="search"
>
<div class="gem-c-search govuk-!-display-none-print govuk-!-margin-bottom-0 gem-c-search--no-border gem-c-search--on-white" data-module="gem-toggle-input-class-on-focus">
<label for="site-search-text" class="gem-c-search__label">Search on GOV.UK</label>
<div class="gem-c-search__item-wrapper">
<input enterkeyhint="search" class="gem-c-search__item gem-c-search__input js-class-toggle" id="site-search-text" name="q" title="Search" type="search" value="">
<div class="gem-c-search__item gem-c-search__submit-wrapper">
<button class="gem-c-search__submit" type="submit" data-track-category="headerClicked" data-track-action="searchSubmitted" data-track-label="none" data-module="gem-track-click" enterkeyhint="search">
Search GOV.UK
<svg
class="gem-c-search__icon"
width="27"
height="27"
viewBox="0 0 27 27"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
focusable="false"
>
<circle
cx="12.0161"
cy="11.0161"
r="8.51613"
stroke="currentColor"
stroke-width="3" />
<line
x1="17.8668"
y1="17.3587"
x2="26.4475"
y2="25.9393"
stroke="currentColor"
stroke-width="3" />
</svg>
</button> </div>
</div>
</div>
</form>
</div>
</div>
</div>
</header>
<div class="govuk-!-padding-top-3 govuk-!-padding-bottom-3">This is the emergency banner slot</div>
<div class="gem-c-layout-for-public__blue-bar govuk-width-container"></div>
<div id="wrapper" class="govuk-width-container">
<main class="govuk-main-wrapper" id="content">
</main>
</div>
<div class="govuk-width-container">
<div class="gem-c-feedback govuk-!-display-none-print" data-module="feedback ga4-event-tracker">
<div class="gem-c-feedback__prompt gem-c-feedback__js-show js-prompt" tabindex="-1">
<div class="gem-c-feedback__prompt-content">
<div class="gem-c-feedback__prompt-questions js-prompt-questions" hidden>
<div class="gem-c-feedback__prompt-question-answer">
<h2 class="gem-c-feedback__prompt-question">Is this page useful?</h2>
<ul class="gem-c-feedback__option-list">
<li class="gem-c-feedback__option-list-item govuk-visually-hidden" hidden>
<a class="gem-c-feedback__prompt-link" data-track-category="yesNoFeedbackForm" data-track-action="ffMaybeClick" role="button" hidden="hidden" aria-hidden="true" href="/contact/govuk">
Maybe
</a> </li>
<li class="gem-c-feedback__option-list-item">
<button class="govuk-button gem-c-feedback__prompt-link js-page-is-useful" data-track-category="yesNoFeedbackForm" data-track-action="ffYesClick" data-ga4-event='{"event_name":"form_submit","type":"feedback","text":"Yes", "section": "Is this page useful?"}'>
Yes <span class="govuk-visually-hidden">this page is useful</span>
</button>
</li>
<li class="gem-c-feedback__option-list-item">
<button class="govuk-button gem-c-feedback__prompt-link js-toggle-form js-page-is-not-useful" data-track-category="yesNoFeedbackForm" data-track-action="ffNoClick" aria-controls="page-is-not-useful" aria-expanded="false" data-ga4-event='{"event_name":"form_submit","type":"feedback","text":"No", "section": "Is this page useful?"}'>
No <span class="govuk-visually-hidden">this page is not useful</span>
</button>
</li>
</ul>
</div>
</div>
<div class="gem-c-feedback__prompt-questions gem-c-feedback__prompt-success js-prompt-success" role="alert" hidden>
Thank you for your feedback
</div>
<div class="gem-c-feedback__prompt-questions gem-c-feedback__prompt-questions--something-is-wrong js-prompt-questions" hidden>
<button class="govuk-button gem-c-feedback__prompt-link js-toggle-form js-something-is-wrong" data-track-category="Onsite Feedback" data-track-action="GOV-UK Open Form" aria-controls="something-is-wrong" aria-expanded="false" data-ga4-event='{"event_name":"form_submit","type":"feedback","text":"Report a problem with this page", "section": "Is this page useful?"}'>
Report a problem with this page
</button>
</div>
</div>
</div>
<form action="/contact/govuk/problem_reports"
id="something-is-wrong"
class="gem-c-feedback__form js-feedback-form"
data-track-category="Onsite Feedback"
data-track-action="GOV.UK Send Form"
method="post"
hidden>
<div class="govuk-grid-row">
<div class="govuk-grid-column-two-thirds">
<div class="gem-c-feedback__error-summary gem-c-feedback__js-show js-errors" tabindex="-1" hidden></div>
<input type="hidden" name="url" value="http://components.publishing.service.gov.uk/component-guide/layout_for_public/with_emergency_banner">
<h3 class="gem-c-feedback__form-heading">Help us improve GOV.UK</h3>
<p id="feedback_explanation" class="gem-c-feedback__form-paragraph">Don’t include personal or financial information like your National Insurance number or credit card details.</p>
<div class="govuk-visually-hidden" aria-hidden="true">
<label for="giraffe">This field is for robots only. Please leave blank</label>
<input id="giraffe" name="giraffe" type="text" pattern=".{0}" tabindex="-1" autocomplete="off">
</div>
<div class="gem-c-textarea govuk-form-group govuk-!-margin-bottom-6">
<label for="textarea-381ff70e" class="gem-c-label govuk-label">What were you doing?</label>
<textarea name="what_doing" class="govuk-textarea" id="textarea-381ff70e" rows="3" spellcheck="true" aria-describedby="feedback_explanation">
</textarea>
</div>
<div class="gem-c-textarea govuk-form-group govuk-!-margin-bottom-6">
<label for="textarea-c1b60ee1" class="gem-c-label govuk-label">What went wrong?</label>
<textarea name="what_wrong" class="govuk-textarea" id="textarea-c1b60ee1" rows="3" spellcheck="true">
</textarea>
</div>
<button class="gem-c-button govuk-button" type="submit" data-ga4-event="{"event_name":"form_submit","type":"feedback","text":"Send","section":"Help us improve GOV.UK"}">Send</button>
<button
class="govuk-button govuk-button--secondary gem-c-feedback__close gem-c-feedback__js-show js-close-form"
data-track-category="Onsite Feedback"
data-track-action="GOV.UK Close Form"
aria-controls="something-is-wrong"
aria-expanded="true">
Cancel
</button>
</div>
</div>
</form>
<script nonce="y+VQPvlt+SbWxNvN7S3E/A==">
//<![CDATA[
document.addEventListener("DOMContentLoaded", function () {
var input = document.querySelector("#giraffe"),
form = document.querySelector("#something-is-wrong")
form.addEventListener("submit", spamCapture);
function spamCapture(e) {
if (input.value.length !== 0) return;
e.preventDefault();
}
});
//]]>
</script>
<form action="/contact/govuk/email-survey-signup"
id="page-is-not-useful"
class="gem-c-feedback__form gem-c-feedback__form--email gem-c-feedback__js-show js-feedback-form"
data-track-category="yesNoFeedbackForm"
data-track-action="Send Form"
method="post">
<div class="govuk-grid-row">
<div class="govuk-grid-column-two-thirds" id="survey-wrapper">
<div class="gem-c-feedback__error-summary js-errors" tabindex="-1" hidden></div>
<input name="email_survey_signup[survey_id]" type="hidden" value="footer_satisfaction_survey">
<input name="email_survey_signup[survey_source]" type="hidden" value="/component-guide/layout_for_public/with_emergency_banner">
<h3 class="gem-c-feedback__form-heading">Help us improve GOV.UK</h3>
<p id="survey_explanation" class="gem-c-feedback__form-paragraph">To help us improve GOV.UK, we’d like to know more about your visit today. We’ll send you a link to a feedback form. It will take only 2 minutes to fill in. Don’t worry we won’t send you spam or share your email address with anyone.</p>
<div class="govuk-form-group">
<label for="input-ef1f5b1e" class="gem-c-label govuk-label">Email address</label>
<input aria-describedby="survey_explanation" autocomplete="email" class="gem-c-input govuk-input" id="input-ef1f5b1e" name="email_survey_signup[email_address]" spellcheck="false" type="email">
</div>
<button class="gem-c-button govuk-button" type="submit" data-ga4-event="{"event_name":"form_submit","type":"feedback","text":"Send me the survey","section":"Help us improve GOV.UK"}">Send me the survey</button>
<button
class="govuk-button govuk-button--secondary gem-c-feedback__close js-close-form"
data-track-category="yesNoFeedbackForm"
data-track-action="ffFormClose"
aria-controls="page-is-not-useful"
aria-expanded="true"
hidden>
Cancel
</button>
</div>
</div>
</form>
</div>
</div>
<footer class="gem-c-layout-footer govuk-footer gem-c-layout-footer--border" role="contentinfo" data-module="ga4-link-tracker">
<div class="govuk-width-container">
<div class="govuk-footer__navigation" data-module="gem-track-click" data-track-links-only>
<div class="govuk-grid-column-two-thirds govuk-!-display-none-print">
<h2 class="govuk-footer__heading govuk-heading-m">Topics</h2>
<ul class="govuk-footer__list govuk-footer__list--columns-2">
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/benefits" data-track-options="{"dimension29":"Benefits"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"1","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/benefits">Benefits</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/births-deaths-marriages" data-track-options="{"dimension29":"Births, death, marriages and care"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"2","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/births-deaths-marriages">Births, death, marriages and care</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/business" data-track-options="{"dimension29":"Business and self-employed"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"3","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/business">Business and self-employed</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/childcare-parenting" data-track-options="{"dimension29":"Childcare and parenting"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"4","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/childcare-parenting">Childcare and parenting</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/citizenship" data-track-options="{"dimension29":"Citizenship and living in the UK"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"5","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/citizenship">Citizenship and living in the UK</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/justice" data-track-options="{"dimension29":"Crime, justice and the law"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"6","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/justice">Crime, justice and the law</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/disabilities" data-track-options="{"dimension29":"Disabled people"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"7","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/disabilities">Disabled people</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/driving" data-track-options="{"dimension29":"Driving and transport"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"8","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/driving">Driving and transport</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/education" data-track-options="{"dimension29":"Education and learning"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"9","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/education">Education and learning</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/employing-people" data-track-options="{"dimension29":"Employing people"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"10","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/employing-people">Employing people</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/environment-countryside" data-track-options="{"dimension29":"Environment and countryside"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"11","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/environment-countryside">Environment and countryside</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/housing-local-services" data-track-options="{"dimension29":"Housing and local services"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"12","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/housing-local-services">Housing and local services</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/tax" data-track-options="{"dimension29":"Money and tax"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"13","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/tax">Money and tax</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/abroad" data-track-options="{"dimension29":"Passports, travel and living abroad"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"14","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/abroad">Passports, travel and living abroad</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/visas-immigration" data-track-options="{"dimension29":"Visas and immigration"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"15","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/visas-immigration">Visas and immigration</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="topicsLink" data-track-label="/browse/working" data-track-options="{"dimension29":"Working, jobs and pensions"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"16","index_section":"1","index_section_count":"5"},"index_total":"16","section":"Topics"}" href="/browse/working">Working, jobs and pensions</a>
</li>
</ul>
</div>
<div class="govuk-grid-column-one-third govuk-!-display-none-print">
<h2 class="govuk-footer__heading govuk-heading-m">Government activity</h2>
<ul class="govuk-footer__list govuk-footer__list--columns-1">
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/government/organisations" data-track-options="{"dimension29":"Departments"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"1","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/government/organisations">Departments</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/search/news-and-communications" data-track-options="{"dimension29":"News"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"2","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/search/news-and-communications">News</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/search/guidance-and-regulation" data-track-options="{"dimension29":"Guidance and regulation"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"3","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/search/guidance-and-regulation">Guidance and regulation</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/search/research-and-statistics" data-track-options="{"dimension29":"Research and statistics"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"4","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/search/research-and-statistics">Research and statistics</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/search/policy-papers-and-consultations" data-track-options="{"dimension29":"Policy papers and consultations"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"5","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/search/policy-papers-and-consultations">Policy papers and consultations</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/search/transparency-and-freedom-of-information-releases" data-track-options="{"dimension29":"Transparency"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"6","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/search/transparency-and-freedom-of-information-releases">Transparency</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/government/how-government-works" data-track-options="{"dimension29":"How government works"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"7","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/government/how-government-works">How government works</a>
</li>
<li class="govuk-footer__list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="governmentactivityLink" data-track-label="/government/get-involved" data-track-options="{"dimension29":"Get involved"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"8","index_section":"2","index_section_count":"5"},"index_total":"8","section":"Government activity"}" href="/government/get-involved">Get involved</a>
</li>
</ul>
</div>
</div>
<hr class="govuk-footer__section-break">
<div class="govuk-footer__meta">
<div class="govuk-footer__meta-item govuk-footer__meta-item--grow">
<h2 class="govuk-visually-hidden">Support links</h2>
<ul class="govuk-footer__inline-list govuk-!-display-none-print" data-module="gem-track-click" data-track-links-only>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/help" data-track-options="{"dimension29":"Help"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"1","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/help">Help</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/help/privacy-notice" data-track-options="{"dimension29":"Privacy"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"2","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/help/privacy-notice">Privacy</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/help/cookies" data-track-options="{"dimension29":"Cookies"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"3","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/help/cookies">Cookies</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/help/accessibility-statement" data-track-options="{"dimension29":"Accessibility statement"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"4","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/help/accessibility-statement">Accessibility statement</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/contact" data-track-options="{"dimension29":"Contact"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"5","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/contact">Contact</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/help/terms-conditions" data-track-options="{"dimension29":"Terms and conditions"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"6","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/help/terms-conditions">Terms and conditions</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" lang="cy" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/cymraeg" data-track-options="{"dimension29":"Rhestr o Wasanaethau Cymraeg"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"7","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/cymraeg">Rhestr o Wasanaethau Cymraeg</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" data-track-category="footerClicked" data-track-action="supportLink" data-track-label="/government/organisations/government-digital-service" data-track-options="{"dimension29":"Government Digital Service"}" data-ga4-link="{"event_name":"navigation","type":"footer","index":{"index_link":"8","index_section":"3","index_section_count":"5"},"index_total":"8","section":"Support links"}" href="/government/organisations/government-digital-service">Government Digital Service</a>
</li>
</ul>
<svg aria-hidden="true" focusable="false" class="govuk-footer__licence-logo" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 483.2 195.7" height="17" width="41">
<path
fill="currentColor"
d="M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145"
/>
</svg>
<span
class="govuk-footer__licence-description"
data-module="gem-track-click"
data-track-action="copyrightLink"
data-track-category="footerClicked"
data-track-label="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/"
data-track-options='{"dimension29": "Open Government Licence v3.0"}'
data-track-links-only
data-ga4-track-links-only
data-ga4-link="{"event_name":"navigation","section":"Licence","index":{"index_section":"4","index_link":"1","index_section_count":"5"},"text":"Open Government Licence v3.0","index_total":"1","type":"footer"}"
>
All content is available under the <a class="govuk-footer__link" href="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/" rel="license">Open Government Licence v3.0</a>, except where otherwise stated
</span>
</div>
<div
class="govuk-footer__meta-item"
data-module="gem-track-click"
data-track-action="copyrightLink"
data-track-category="footerClicked"
data-track-label="https://www.nationalarchives.gov.uk/information-management/re-using-public-sector-information/uk-government-licensing-framework/crown-copyright/"
data-track-options='{"dimension29": "© Crown copyright"}'
data-track-links-only
data-ga4-link="{"event_name":"navigation","section":"Copyright","index":{"index_section":"5","index_link":"1","index_section_count":"5"},"text":"© Crown copyright","index_total":"1","type":"footer"}"
>
<a class="govuk-footer__link govuk-footer__copyright-logo" href="https://www.nationalarchives.gov.uk/information-management/re-using-public-sector-information/uk-government-licensing-framework/crown-copyright/">© Crown copyright</a>
</div>
</div>
</div>
</footer>
<script src="/assets/application-8c46719bfab08ba0c25fd5daaf894d3d6b42ca270ba44dbfddd84b38f72e610f.js"></script>
</body></html>How to call this example
<%= render "govuk_publishing_components/components/layout_for_public", {
emergency_banner: sanitize("<div class=\"govuk-!-padding-top-3 govuk-!-padding-bottom-3\">This is the emergency banner slot</div>")
} %>