Footer

Barebones includes a simple site footer with copyright text and a footer menu.

The footer is intentionally minimal so each project can adapt the layout, content, and styling to the final design.

Template

The footer markup lives in footer.php.

It renders the site footer, calls wp_footer(), and closes the document.

Keep wp_footer() in place when customising the footer. WordPress and plugins use it to load scripts and output required footer markup.

HTML
<footer class="footer" role="contentinfo">
    ...
</footer>

<?php wp_footer(); ?>
</body>
</html>

The footer uses the Barebones grid. The default layout has one column for copyright text and one column for footer navigation.

The site name comes from WordPress.

The year is generated dynamically with PHP.

HTML
<footer class="footer" role="contentinfo">
    <div class="container">
        <div class="row">
            ...
        </div>
    </div>
</footer>
HTML
<p class="footer__copyright">
    &copy; <?php echo get_bloginfo( 'name' ); ?> <?php echo date('Y'); ?>
</p>

The footer menu uses the footer menu location. Assign a menu to this location in Appearance > Menus.

PHP
<nav class="footer__navigation">
    <?php wp_nav_menu([
        'theme_location' => 'footer',
        'menu_class'     => 'nav nav--footer'
    ]); ?>
</nav>

Styles

Footer styles live in assets/styles/layout/_footer.scss.

The default footer styles are minimal. The footer receives a light background colour, padding, and top margin.

Most projects will customise the footer to match the site content and design.

Common changes include:

  • adding contact details
  • adding social links
  • changing the column layout
  • adding newsletter signup markup
  • adding legal navigation
  • changing background and spacing
  • replacing the default copyright text

Keep wp_footer() intact when making changes.