Footer
Provides information related your service at the bottom of every page.
Props
maxcontentwidth
string
The maximum width of the main content area
testId
string
Sets a data-testid attribute for automated testing.
url
string
URL for the Government of Alberta logo link. Set to empty string to disable the link.
Defaults to
https://alberta.ca.
version
1 | 2
Defaults to
1.
Slots
nav
Named slot for content
meta
Named slot for content
Basic page layout
<GoabOneColumnLayout>
<section slot="header">
<GoabxAppHeader url="/" heading="Service name">
<a href="/login">Sign in</a>
</GoabxAppHeader>
</section>
<GoabPageBlock width="704px">
<p>
<GoabSkeleton type="header" size="4" />
<GoabSkeleton type="text" size="1" />
</p>
<p>
<GoabSkeleton type="header" size="4" />
<GoabSkeleton type="text" size="1" />
</p>
<GoabGrid minChildWidth="30ch">
<GoabSkeleton type="card" size="2" />
<GoabSkeleton type="card" size="2" />
</GoabGrid>
</GoabPageBlock>
<section slot="footer">
<GoabxAppFooter />
</section>
</GoabOneColumnLayout><goab-one-column-layout>
<section slot="header">
<goabx-app-header url="/" heading="Service name">
<a href="/login">Sign in</a>
</goabx-app-header>
</section>
<goab-page-block width="704px">
<p>
<goab-skeleton type="header" size="4"></goab-skeleton>
<goab-skeleton type="text" size="1"></goab-skeleton>
</p>
<p>
<goab-skeleton type="header" size="4"></goab-skeleton>
<goab-skeleton type="text" size="1"></goab-skeleton>
</p>
<goab-grid minChildWidth="30ch">
<goab-skeleton type="card" size="2"></goab-skeleton>
<goab-skeleton type="card" size="2"></goab-skeleton>
</goab-grid>
</goab-page-block>
<section slot="footer">
<goabx-app-footer></goabx-app-footer>
</section>
</goab-one-column-layout><goa-one-column-layout>
<section slot="header">
<goa-app-header version="2" url="/" heading="Service name">
<a href="/login">Sign in</a>
</goa-app-header>
</section>
<goa-page-block width="704px">
<p>
<goa-skeleton type="header" size="4"></goa-skeleton>
<goa-skeleton type="text" size="1"></goa-skeleton>
</p>
<p>
<goa-skeleton type="header" size="4"></goa-skeleton>
<goa-skeleton type="text" size="1"></goa-skeleton>
</p>
<goa-grid min-child-width="30ch">
<goa-skeleton type="card" size="2"></goa-skeleton>
<goa-skeleton type="card" size="2"></goa-skeleton>
</goa-grid>
</goa-page-block>
<section slot="footer">
<goa-app-footer version="2"></goa-app-footer>
</section>
</goa-one-column-layout>Show links to navigation items
<GoabxAppFooter maxContentWidth="100%">
<GoabxAppFooterNavSection maxColumnCount={1}>
<a href="a.html">Arts and culture</a>
<a href="b.html">Education and training</a>
<a href="c.html">Family and social supports</a>
<a href="d.html">Housing and community</a>
<a href="e.html">Life events</a>
<a href="f.html">Business and economy</a>
<a href="g.html">Emergencies and public safety</a>
<a href="h.html">Government</a>
<a href="i.html">Jobs and employment</a>
<a href="j.html">Moving to Alberta</a>
</GoabxAppFooterNavSection>
<GoabxAppFooterMetaSection>
<a href="privacy.html">Privacy</a>
<a href="disclaimer.html">Disclaimer</a>
<a href="accessibility.html">Accessibility</a>
<a href="using-alberta.html">Using Alberta.ca</a>
</GoabxAppFooterMetaSection>
</GoabxAppFooter><goabx-app-footer maxContentWidth="100%">
<goabx-app-footer-nav-section slot="nav" [maxColumnCount]="1">
<a href="a.html">Arts and culture</a>
<a href="b.html">Education and training</a>
<a href="c.html">Family and social supports</a>
<a href="d.html">Housing and community</a>
<a href="e.html">Life events</a>
<a href="f.html">Business and economy</a>
<a href="g.html">Emergencies and public safety</a>
<a href="h.html">Government</a>
<a href="i.html">Jobs and employment</a>
<a href="j.html">Moving to Alberta</a>
</goabx-app-footer-nav-section>
<goabx-app-footer-meta-section slot="meta">
<a href="privacy.html">Privacy</a>
<a href="disclaimer.html">Disclaimer</a>
<a href="accessibility.html">Accessibility</a>
<a href="using-alberta.html">Using Alberta.ca</a>
</goabx-app-footer-meta-section>
</goabx-app-footer><goa-app-footer version="2" maxcontentwidth="100%">
<goa-app-footer-nav-section slot="nav" maxcolumncount="1">
<a href="a.html">Arts and culture</a>
<a href="b.html">Education and training</a>
<a href="c.html">Family and social supports</a>
<a href="d.html">Housing and community</a>
<a href="e.html">Life events</a>
<a href="f.html">Business and economy</a>
<a href="g.html">Emergencies and public safety</a>
<a href="h.html">Government</a>
<a href="i.html">Jobs and employment</a>
<a href="j.html">Moving to Alberta</a>
</goa-app-footer-nav-section>
<goa-app-footer-meta-section slot="meta">
<a href="privacy.html">Privacy</a>
<a href="disclaimer.html">Disclaimer</a>
<a href="accessibility.html">Accessibility</a>
<a href="using-alberta.html">Using Alberta.ca</a>
</goa-app-footer-meta-section>
</goa-app-footer>Show quick links
<GoabxAppFooter maxContentWidth="100%">
<GoabxAppFooterMetaSection>
<a href="#">Give feedback</a>
<a href="#">Accessibility</a>
<a href="#">Privacy</a>
<a href="#">Contact us</a>
</GoabxAppFooterMetaSection>
</GoabxAppFooter><goabx-app-footer maxContentWidth="100%">
<goabx-app-footer-meta-section slot="meta">
<a href="#">Give feedback</a>
<a href="#">Accessibility</a>
<a href="#">Privacy</a>
<a href="#">Contact us</a>
</goabx-app-footer-meta-section>
</goabx-app-footer><goa-app-footer version="2" maxcontentwidth="100%">
<goa-app-footer-meta-section slot="meta">
<a href="#">Give feedback</a>
<a href="#">Accessibility</a>
<a href="#">Privacy</a>
<a href="#">Contact us</a>
</goa-app-footer-meta-section>
</goa-app-footer>