Abundant Life · Resources Map

Interactive, mobile-first resource map fed live from abundantlifewa.org.

Embed Code

Paste this snippet anywhere on a third-party website. The map and its search, category, and radius filters update automatically from the live feed (only resources with coordinates are shown).

<!-- Abundant Life Resources | Interactive Map -->
<div class="abundant-life-resources" style="min-height:420px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e5e7eb;border-radius:12px">
  <div style="display:flex;flex-direction:column;align-items:center;gap:14px;color:#64748b;font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,Roboto,sans-serif">
    <svg width="42" height="42" viewBox="0 0 42 42" style="animation:alrspin 1s linear infinite">
      <circle cx="21" cy="21" r="16" fill="none" stroke="#e5e7eb" stroke-width="4"/>
      <circle cx="21" cy="21" r="16" fill="none" stroke="#1F4586" stroke-width="4" stroke-linecap="round" stroke-dasharray="80" stroke-dashoffset="60"/>
    </svg>
    <span style="font-size:13px;font-weight:600;letter-spacing:.02em">Loading resources…</span>
  </div>
</div>
<style>@keyframes alrspin{to{transform:rotate(360deg)}}</style>
<script src="https://tools.host1help1.com/functions/serveAbundantLifeEmbed" async></script>

Live Preview

Tip: on mobile, the list collapses below the map so users can pan the map then scroll to browse matching resources.