🎷 Tucson Jazz Society Command Center → WordPress Embed Kit

Put the TJS Command Center on theforceforhealth.com — as a page or a reusable shortcode — without moving anything. The tool stays hosted on theforce.health (gated to the TJS board); WordPress just surfaces it.

What's happening here

You're embedding by reference, not copying. The Command Center stays live and gated at theforce.health/tucson-jazz-society/ — board members sign in through the FFH gate. WordPress simply links to it or frames it.

✅ Already live & gated. Anyone who isn't signed in is bounced to /gate/; the TJS board + Coach Lucy are on the allowlist. Nothing to deploy for WordPress — paste a snippet below.
⚠ Because it's gated, prefer the button over the frame. Browsers increasingly block sign-in inside an iframe (third-party storage). For a private, signed-in tool, the most reliable pattern on WordPress is a button that opens it in a new tab (Option A). The iframe (Option B) is fine for a quick look but board members should sign in via the full page.

ARecommended — a "Open the Command Center" button

Paste into a Custom HTML block (block editor) or an HTML widget (Elementor). Opens the gated tool full-screen in a new tab.

<div style="text-align:center;padding:26px;background:#0e1633;border-radius:16px;max-width:640px;margin:24px auto;">
  <div style="font-size:2rem">🎷</div>
  <h3 style="color:#f4d488;font-family:Georgia,serif;margin:8px 0 4px;">Tucson Jazz Society — Command Center</h3>
  <p style="color:#cdd5ee;font-size:.9rem;margin:0 0 16px;">Board members: sign in with your board email.</p>
  <a href="https://theforce.health/gate/?next=/tucson-jazz-society/" target="_blank" rel="noopener"
     style="display:inline-block;background:#e7b54a;color:#241b0e;font-weight:800;padding:13px 24px;border-radius:11px;text-decoration:none;">
     Open the Command Center →</a>
</div>

BOptional — inline iframe (quick look)

Frames the tool inside a WordPress page. Keep the trailing slash. Sign-in may need the full-page button above.

<div style="position:relative;width:100%;max-width:1200px;margin:0 auto;">
  <iframe
    src="https://theforce.health/tucson-jazz-society/"
    title="Tucson Jazz Society Command Center"
    style="width:100%;height:85vh;min-height:600px;border:0;border-radius:12px;box-shadow:0 8px 30px rgba(15,32,68,.18);"
    loading="lazy" allow="fullscreen; clipboard-write" allowfullscreen></iframe>
  <p style="text-align:center;margin:12px 0 0;font:600 14px -apple-system,sans-serif;">
    <a href="https://theforce.health/gate/?next=/tucson-jazz-society/" target="_blank"
       style="color:#1f6f64;text-decoration:none;">⤢ Open full-screen / sign in in a new tab</a>
  </p>
</div>
Note: theforceforhealth.com is already allowed to frame theforce.health pages (the site's security policy permits it), so the frame will render.

CCleanest — the TJS plugin (a reusable shortcode)

Install the one-file plugin (tjs-command-center.php) and drop this shortcode on any page, post, or menu:

[tjs_command_center]           <!-- the button (recommended) -->
[tjs_command_center view="frame"]  <!-- the inline iframe -->

To install: WordPress admin → Plugins → Add New → Upload Plugin → choose tjs-command-center.php (zip it first if your host requires a .zip) → Activate. Then use the shortcode anywhere.

DStep-by-step on theforceforhealth.com

  1. Log in to theforceforhealth.com/wp-admin.
  2. Create a new Page — e.g. "Tucson Jazz Society — Command Center".
  3. Add a Custom HTML block and paste Option A (button). Or install the plugin and use [tjs_command_center].
  4. Publish. Keep it out of the public menu while it's board-only — share the page link with the board.
  5. Board members click the button → the FFH gate → they sign in with their board email → the Command Center.
Edits propagate automatically. WordPress only points at the live folder, so every update to the Command Center shows up instantly — nothing to re-paste.