Add a Page Footer
What You’ll Do
- Add a footer to your page
Step 1: Add a Footer
Last but not least, let’s add a footer in the form of another Grid System component.
Insert the following code between the <!-- FOOTER --> comments:
<!-- FOOTER -->
<footer role="contentinfo" class="slds-p-around_large">
<!-- LAYOUT GRID -->
<div class="slds-grid slds-grid_align-spread">
<p class="slds-col">Salesforce Lightning Design System Example</p>
<p class="slds-col">© Your Name Here</p>
</div>
<!-- / LAYOUT GRID -->
</footer>
<!-- / FOOTER -->
Step 2: Preview
Save your page, and click the Preview button.
Summary and Next Steps
You did it! You built a contact list page using the Design System and didn’t have to write a single line of CSS!
The Design System offers many components that were not covered in this project, so check out www.lightningdesignsystem.com for a complete list and continue to make your contact list page even more awesome!
For a more in-depth guided introduction to using the Design System, see our longer Trailhead module.
If you have feedback on this workshop or on any aspect of the Design System, let us know.
