Get the free theme
View Categories

How to Build a Global Header and Footer in WordPress Using Raw HTML

1 min read

If you want one header and footer in your own raw HTML across every page, most themes make you either edit theme files or build them from blocks. Loupely Canvas gives you 2 boxes that take raw HTML and wrap every page for you.

Set them once

Go to Appearance, Loupely Canvas. Paste your header markup into the header box and your footer markup into the footer box. Both take raw HTML, including any style and script they need. From then on, the header prints above your page content and the footer prints below it, on every page that uses the global pair.

Why raw HTML

There is no nav builder between you and the output. You write the header you want, and that is what renders, full width like everything else in Canvas. What you paste is what ships. If you would rather manage your links in WordPress than hand code them, you can drop a registered menu into your header with the {menu:header} token, but that is an option, not a requirement.

Optional tokens

For the parts that change, the boxes accept tokens: {site_title}, {tagline}, {home_url}, and {year} for site values, {logo} for the site logo, and {menu:header} or {menu:footer} for a menu assigned under Appearance, Menus. A common use is a footer line that pairs the current year with your site title and never goes stale. See using tokens in the header and footer for the full set.

More than one pair

If you reach the point of needing more than one header or footer across a site, Loupely Canvas Pro adds multiple named header and footer sets you can assign by page, category, or URL pattern. For a single global pair, the free theme is all you need.