HTML to Elementor
Website kits

Nonprofit footer

Dark nonprofit footer with the name, mission line and Donate button, pantry address and hours, get-involved links, contact details and a small-print row.

Module Nonprofit Footer Contact Donate
Preview of the Nonprofit footer template

The top of the template as it renders in a browser. Images become placeholders when you import it.

When to use it

The footer that closes every page, and where many visitors go when all they want is the pantry address or this week’s hours. Its four columns follow that need: the name with a one-line mission and a Donate button, Get food with the address and market hours, Get involved with links to volunteering, food drives and the impact report, and Contact with the phone, email and office hours. The small-print row carries the copyright line, the nonprofit status and links such as privacy, accessibility and financial statements, which grant-makers often check. Replace the hours first and make sure they match the home page, the programs page and any community resource directory that lists you, because a family who arrives on a closed day after reading the wrong hours may not try again. Keep the nonprofit status line generic unless you want to add your registration details yourself.

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 × 13
  • Button × 1
  • Heading × 3

Things worth knowing

  • The three column titles convert to Heading widgets, the name and every line of text to Text Editor widgets with their links kept, and only Donate, with its marigold background, becomes a Button.
  • Use it as an Elementor Theme Builder footer template (Elementor Pro) so it shows on every page; without Pro, paste it at the bottom of each page.
  • Below 780px the four columns stack into one and the small-print row splits into two lines.
  • Privacy policy, Accessibility and Financial statements are plain text, not links; add the links in the Text Editor after import.

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>Nonprofit footer</title>
  <style>
    body{margin:0;font-family:'Nunito Sans',Helvetica,Arial,sans-serif;color:#f6e3d6;background:#3b2346}
    .foot{background:#3b2346;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:40px;padding:0 0 40px;border-bottom:1px solid #6b5b70}
    .brand{margin:0 0 12px;font-family:'Fraunces',Georgia,serif;font-size:26px;font-weight:700;line-height:1.25;color:#faf6ee}
    h2{margin:0 0 12px;font-family:'Nunito Sans',Helvetica,Arial,sans-serif;font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#f2a93b}
    p{margin:0 0 8px;font-size:15px;line-height:1.7;color:#f6e3d6}
    a{color:#f6e3d6}
    .donate{display:inline-block;margin-top:10px;padding:12px 22px;border-radius:10px;background:#f2a93b;color:#3b2346;text-decoration:none;font-size:15px;font-weight:800}
    .small{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:22px}
    .small p{margin:0;font-size:13px;color:#f6e3d6}
    @media(max-width:780px){.foot{padding:48px 0 24px}.wrap{padding:0 16px}.cols{grid-template-columns:minmax(0,1fr);gap:28px}.small{flex-direction:column;gap:6px}}
  </style>
</head>
<body>
  <footer class="foot">
    <div class="wrap">
      <div class="cols">
        <div>
          <p class="brand">Bramwell Community Pantry</p>
          <p>A volunteer-run food pantry sharing free groceries with neighbors across Bramwell and the Corran Valley.</p>
          <a class="donate" href="/donate/">Donate</a>
        </div>
        <div>
          <h2>Get food</h2>
          <p>Pantry Market, 75 Quarrystone Road</p>
          <p>Tue 3–7 pm · Thu 10 am–2 pm</p>
          <p>Sat 9 am–noon</p>
        </div>
        <div>
          <h2>Get involved</h2>
          <p><a href="/programs/#volunteer">Volunteer</a></p>
          <p><a href="/donate/#other-ways">Run a food drive</a></p>
          <p><a href="/impact/">Impact report</a></p>
        </div>
        <div>
          <h2>Contact</h2>
          <p>(555) 018-4470</p>
          <p>[email protected]</p>
          <p>Office Mon–Fri, 9 am–5 pm</p>
        </div>
      </div>
      <div class="small">
        <p>© 2026 Bramwell Community Pantry. A registered nonprofit organization.</p>
        <p>Privacy policy · Accessibility · Financial statements</p>
      </div>
    </div>
  </footer>
</body>
</html>