Fitness studio footer
Dark four-column studio footer with the name and a trial button, address and parking, hours and contact details, page links and a legal line.
The top of the template as it renders in a browser. Images become placeholders when you import it.
When to use it
A footer for a studio that people often open on a phone just to check the hours or the address. It repeats the details members look up most, namely where you are, when the doors are open and the phone number, so nobody has to dig for the contact page. The first column restates what the studio offers in one sentence and carries a trial button, since the footer is where readers of long pages end up. The page links stay short and match the header. The legal line holds the age and waiver rule, a condition visitors should see before booking rather than discover at the desk. Replace the address, hours and phone number first and keep them identical to the contact page. A tip for studios: if your weekend hours change with the seasons, update the footer and the contact page in the same sitting.
What it converts to
Converted with the Native components mode. The component list below is what this template produces — not a generic example.
- Container × 8
- Container (grid) × 1
- HTML widget × 1 — the block’s scoped CSS; keep it, the layout depends on it
- Text Editor × 10
- Button × 1
- Heading × 3
Things worth knowing
- The four columns convert to Containers with Headings and Text Editors; the address and the hours keep their line breaks inside one Text Editor each.
- The four page links are plain text links and convert to Text Editor widgets. Replace them with a WordPress menu (Nav Menu widget, Elementor Pro) if the footer should follow menu changes.
- The trial link becomes a Button widget. As a site-wide footer it goes in Theme Builder (Elementor Pro); without Pro, paste it at the bottom of each page.
- The columns stack to one below 780px, in source order.
The HTML
This is the complete source. Copy it, or send it straight to the converter and adjust the options before exporting.
Show the HTML source
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fitness studio footer</title>
<style>
body{margin:0;font-family:'Roboto',Arial,Helvetica,sans-serif;color:#e8ebef;background:#111315}
.footer{background:#111315;padding:64px 0 28px}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.cols{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:36px;padding-bottom:40px;border-bottom:1px solid #24282d}
.brand{margin:0 0 12px;font-family:'Oswald','Arial Narrow',Arial,sans-serif;font-size:26px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#ffffff}
.brand span{color:#c8f135}
h3{margin:0 0 14px;font-family:'Oswald','Arial Narrow',Arial,sans-serif;font-size:16px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#c8f135}
p{margin:0 0 14px;font-size:15px;line-height:1.75;color:#e8ebef}
.links{display:flex;flex-direction:column;gap:10px}
.links a{color:#e8ebef;text-decoration:none;font-size:15px}
.button{display:inline-block;margin-top:6px;padding:12px 22px;border-radius:4px;background:#c8f135;color:#111315;text-decoration:none;font-family:'Oswald','Arial Narrow',Arial,sans-serif;font-weight:600;font-size:15px;letter-spacing:.06em;text-transform:uppercase}
.legal{margin:24px 0 0;font-size:13.5px;color:#e8ebef}
@media(max-width:780px){.footer{padding:48px 0 24px}.wrap{padding:0 16px}.cols{grid-template-columns:minmax(0,1fr);gap:28px}}
</style>
</head>
<body>
<footer class="footer">
<div class="wrap">
<div class="cols">
<div>
<p class="brand">Northline<span> Studio</span></p>
<p>Coached small group strength, conditioning, cycling and mobility classes in Riverton.</p>
<a class="button" href="#free-trial">Book a free trial</a>
</div>
<div>
<h3>Visit</h3>
<p>418 Foundry Lane, Unit 2<br>Riverton, OR 97000<br>Parking behind the building</p>
</div>
<div>
<h3>Hours</h3>
<p>Mon to Fri: 5:45 am to 8:00 pm<br>Sat and Sun: 8:30 am to 12:00 pm</p>
<p>(555) 014-2290<br>[email protected]</p>
</div>
<div>
<h3>Studio</h3>
<nav class="links" aria-label="Footer">
<a href="#classes">Classes</a>
<a href="#timetable">Timetable</a>
<a href="#membership">Membership</a>
<a href="#contact">Contact</a>
</nav>
</div>
</div>
<p class="legal">© 2026 Northline Studio. Classes are open to adults 16 and over; under-18s need a parent or guardian to sign the waiver.</p>
</div>
</footer>
</body>
</html>
