DLF Base
Use this template to keep your pages consistent with the rest of Digital Land.
The dlf-base.html template extends the GOV.UK template
The default max width is 1020px (with margins the content width is 960px). You can make it wider if needed. Using the dlf-base--full-width.html template is another option.
<!DOCTYPE html>
<html lang="en" class="govuk-template ">
<head>
<meta charset="utf-8">
<title>Digital Land - Planning data you can find, use and trust</title>
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="theme-color" content="#0b0c0c">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="shortcut icon" sizes="48x48" href="/design-system/static/images/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" sizes="32x32" href="/design-system/static/images/favicon-32x32.png" type="image/png">
<link rel="shortcut icon" sizes="16x16" href="/design-system/static/images/favicon-16x16.png" type="image/png">
<link rel="apple-touch-icon" href="/design-system/static/images/apple-touch-icon.png">
<meta name="digital-land:template" content="digital-land-frontend/base.jinja">
<link href="/design-system/static/stylesheets/dl-frontend.css" rel="stylesheet" />
<meta property="og:image" content="/design-system/static/images/govuk-opengraph-image.png">
</head>
<body class="govuk-template__body ">
<script>document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');</script>
<a href="#main-content" class="govuk-skip-link" data-module="govuk-skip-link">Skip to main content</a>
<!-- Cookie banner partial version 1.0.1 -->
<div id="global-cookie-message" class="govuk-clearfix global-cookie-message" data-module="cookie-banner" role="region" aria-label="cookie banner" data-nosnippet="">
<div id="cookie-banner" class="govuk-width-container">
<div class="govuk-grid-row">
<div class="govuk-grid-column-two-thirds">
<div class="cookie-banner__message govuk-!-margin-top-6">
<h2 class="govuk-heading-m">Tell us whether you accept cookies</h2>
<p class="govuk-body">We use <a class="govuk-link" href="/cookies">cookies to collect information</a> about how you use the Digital Land website to make the website work as well as possible.</p>
</div>
<div class="cooke-banner__buttons govuk-grid-row">
<div class="govuk-grid-column-one-half">
<button class="govuk-button" onclick="acceptCookies();showCookieConfirmation();">Accept all cookies</button>
</div>
<div class="govuk-grid-column-one-half">
<a class="govuk-button" href="/cookies">Set cookie preferences</a>
</div>
</div>
</div>
</div>
</div>
<div id="cookie-confirmation" class="govuk-width-container govuk-!-padding-top-6" tabindex="-1" style="display: none;">
<p class="cookie-banner__confirmation-message govuk-body">You’ve accepted all cookies. You can <a class="govuk-link" href="/cookies">change your cookie settings</a> at any time.</p>
<button class="cookie-banner__hide-button govuk-button govuk-button--secondary" onclick="document.getElementById('cookie-confirmation').style.display='none';">Hide</button>
</div>
</div>
<header role="banner" id="global-header" class="govuk-header with-proposition dl-header" data-module="govuk-header">
<div class="govuk-header__container govuk-width-container">
<div class="header-proposition">
<div class="govuk-header__content">
<a href="/" class="govuk-header__link govuk-header__link--service-name">
Digital Land
</a>
<nav class="govuk-header__navigation" aria-label="Menu">
<button type="button" class="govuk-header__menu-button govuk-js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
<ul id="navigation" class="govuk-header__navigation-list">
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/about">Team</a>
</li>
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/project/">Projects</a>
</li>
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/weeknote/">Weeknotes</a>
</li>
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/blog-post/">Blog</a>
</li>
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/guidance/">Guidance</a>
</li>
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/dataset/">Datasets</a>
</li>
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/organisation/">Organisations</a>
</li>
<li class="govuk-header__navigation-item">
<a class="govuk-header__link" href="/map/">Map</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</header>
<div class="govuk-width-container ">
<div class="govuk-phase-banner">
<p class="govuk-phase-banner__content">
<strong class="govuk-tag govuk-phase-banner__content__tag">
prototype
</strong>
<span class="govuk-phase-banner__text">
This is a prototype. Please provide <a class="govuk-link" href="mailto:digitalland@communities.gov.uk?subject=Prototype feedback">feedback to the Digital Land team</a>.
</span>
</p>
</div>
<main class="govuk-main-wrapper " id="main-content" role="main">
<h1 class="govuk-heading-xl">Default page template</h1>
</main>
</div>
<footer class="govuk-footer " role="contentinfo">
<div class="govuk-width-container ">
<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">
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" href="/cookies">
Cookies
</a>
</li>
<li class="govuk-footer__inline-list-item">
<a class="govuk-footer__link" href="/accessibility-statement">
Accessibility statement
</a>
</li>
</ul>
<div class="govuk-footer__meta-custom">
The <a class="govuk-footer__link" href="https://github.com/digital-land/digital-land/">software</a> and <a class="govuk-footer__link" href="https://github.com/digital-land/digital-land/">data</a> used to build these pages is <a class="govuk-footer__link" href="https://github.com/digital-land/digital-land/blob/master/LICENSE">open source</a>.
</div>
<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">
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">
<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="/design-system/static/javascripts/digital-land-cookies.js"></script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<script src="/design-system/static/javascripts/govuk/govuk-frontend.js"></script>
<script>
// initiate all GOVUK components
window.GOVUKFrontend.initAll();
</script>
<script src="/design-system/static/javascripts/digital-land-frontend.js"></script>
<script>
window.DLFrontend.initAll();
</script>
</body>
</html>
{% extends "digital-land-frontend/layouts/base.jinja" %}
{% block content %}
<h1 class="govuk-heading-xl">Default page template</h1>
{% endblock %}
Options
Option name | Option type | Description |
---|---|---|
pageTitle |
block | Add a title for the page. Will be added to the <meta> tag in the head |
staticPath |
variable | Option to set the root of the path to static assets, usually set in the renderer. Defaults to /static |
head |
block | Use this to override the assets digital land loads in the head. |
dlHead |
block | Use this instead of the head block to add to the things digital land loads in the head |
dlMetaTemplate |
block | Use this block to add a <meta name="dl-template" content="TEMPLATE"> , replace TEMPLATE with template name |
templateName |
variable | Use this to name the template or base template the page uses. Helpful when things go wrong. Defaults to dlf-base.html |
dlMapAssets |
block | This block contains assets needed for the maps on the digital land website |
includesMap |
variable | If true the assets needed for dl maps will be loaded |
dlCss |
block | Use to override the stylesheets digital land loads as default |
includeAutocomplete |
variable | If true the assets needed for the autocomplete component will be loaded |
header |
block | Inherited from GOV.UK base. By default, includes our cookie banner and top navigation banner |
beforeContent |
block | Inherited from GOV.UK base. Includes prototype banner and breadcrumbs block |
dl_breadcrumbs |
block | Hook to insert breadcrumbs component for the page |
content |
block | Inherited from GOV.UK base. Where the bulk of the page content will go |
footer |
block | Inherited from GOV.UK base. Includes the digital land footer |
feedbackPrompt |
block | Use to add a feedback component to the bottom of the page. Sits inside the footer block |
bodyEnd |
block | Inherited from GOV.UK base. A block to insert any scripts for the page. We have broken this down into specific block. |
googleAnalytics |
block | Where we include our cookie and google analytics scripts |
includeJQuery |
variable | If set to true a version of jQuery will be included on the page |
bodyEndScripts |
block | Where we include dl-frontend.js |