Embedding Your Portal

Put your open positions and application forms directly on your church's website, so people can browse and apply without ever leaving your site.

How It Works

Your Rhythmic portal includes embed pages built specifically to live inside your own website. They have no navigation or logo, a transparent background, and they automatically resize to fit their content, so they blend right into your site's design.

You add a small snippet of HTML to any page on your site. Visitors see your open positions, click one to view its application form, and submit, all inside your page. Applications land in Rhythmic just like ones submitted on your portal.

Before You Start

• Your organization needs a portal subdomain. You can find or set it on your Organization Settings page. Your portal lives at your-subdomain.rhythmic.church.
• You need at least one open position with an application form. Closed positions never appear in the embed, even with a direct link.

Add the Embed to Your Site

Copy the snippet below into your website where you want the positions to appear, and replace your-subdomain with your portal subdomain:

<iframe
  id="rhythmic-embed"
  src="https://your-subdomain.rhythmic.church/embed/positions"
  style="width: 100%; border: 0;"
  title="Open Positions"
></iframe>
<script>
  window.addEventListener("message", (event) => {
    if (event.data && event.data.type === "rhythmic:resize") {
      document.getElementById("rhythmic-embed").style.height = event.data.height + "px";
    }
  });
</script>

The <iframe> displays your positions. The small script below it listens for size updates from the embed and adjusts the frame's height so the whole thing fits without inner scrollbars. The embed sends a new height whenever its content changes, like when a visitor opens a longer application form.

Embedding a Single Position

If you'd rather embed one specific application form instead of the full positions list, point the iframe at that position directly:

https://your-subdomain.rhythmic.church/embed/positions/position-id

To find the position ID, open the position on your portal and copy the ID from the end of the address in your browser's address bar. Everything else about the snippet stays the same, including the resize script.

Showing Only Certain Positions

By default the embed shows every open position in your organization. If you want a page to show only a subset, for example just your worship team openings, create a View on your Portal Settings page. A view is a named grouping of positions.

Then add the view to your embed URL with the viewId parameter:

https://your-subdomain.rhythmic.church/embed/positions?viewId=your-view-id

This lets you embed different position groups on different pages of your website, like worship openings on your worship ministry page and production openings on your tech page.

Adding the Snippet on Popular Website Builders

Every major website platform has a way to paste in custom HTML. Paste the full snippet (both the iframe and the script) into:

Troubleshooting

• The embed is cut off or has a scrollbar. Make sure you included the script part of the snippet, not just the iframe. The script is what sizes the frame to fit the content. Also check that the iframe's id matches the one the script looks up.
• The embed shows "No positions available". Check that your positions are open. If you're using a view, confirm the view includes open positions.
• The page is blank. Double-check the subdomain in the iframe's src matches the subdomain on your Organization Settings page.