How to add PCO Embeds on Your Church Website (One Line of Code)

If you’ve been putting off adding your Planning Center events, calendars, groups, or sermons to your church website because it sounds technical — good news: it isn’t. PCO Embed works with a single line of code that you paste into your page. That’s it. No plugins to configure, no databases to set up, no ongoing maintenance.

Here’s what that line looks like:

<script src="https://pcoembed.com/go/js/embed.js" data-type="publishing" data-id="f5f2a19e-896c-47a7-acab-48c9260c0449"></script>

A few quick notes before we get into platform-specific steps:

• data-type tells the embed what kind of content to display (for example, publishing for sermons, or events and groups for those modules).
• data-id is your unique embed ID, generated for you in your PCO Embed dashboard. Yours will look different from the example above.
• The script automatically builds an isolated widget on your page — it won’t clash with your site’s existing fonts, colors, or CSS, no matter what theme or builder you’re using.

Below are instructions for adding this snippet to the most common church website platforms.

WordPress

WordPress is the most common platform for church websites, and there are two easy ways to add the embed depending on how your site is built.

If you’re using the block editor (Gutenberg):

1. Open the page or post where you want the embed to appear.
2. Click the + icon to add a new block and search for “Custom HTML.”
3. Paste your PCO Embed script tag into the block.
4. Click Preview to confirm it’s displaying correctly, then update or publish the page.

If you’re using a page builder (Elementor, Divi, Beaver Builder, etc.):

Most builders have a dedicated “HTML” or “Code” widget/element you can drag onto the page. Drop it where you want the embed, paste the script tag inside it, and save. The exact widget name varies slightly between builders, but they all work the same way.

A note on theme files: if you want the embed to appear in your header, footer, or a sidebar widget area site-wide (rather than on one page), go to Appearance → Widgets and add a “Custom HTML” widget to the relevant widget area, then paste the same snippet there.

Wix

Wix treats embedded code as its own element type, which makes this straightforward:

1. Open the Wix Editor and go to the page where you want the embed.
2. Click + Add Elements (or Add in the left-hand panel).
3. Choose Embed Code → Embed a Widget (sometimes labeled HTML iframe).
4. A code box will appear on your page. Click Enter Code and paste the script tag.
5. Click Update, then resize the embed box on your page as needed.
6. Publish your site to make it live.

One Wix-specific quirk: the embed element reserves a fixed-size box on the page. If your embedded content (like a calendar or events list) is taller or shorter than the default box, drag the corner handles to resize it so nothing gets cut off or leaves extra white space.

Squarespace

Squarespace also supports custom code through a dedicated block:

1. Edit the page where you want the embed and click to add a new block.
2. Search for and select the Code block (not “Markdown” — that’s a different block type).
3. Make sure the code block’s format is set to HTML (this is usually the default).
4. Paste the script tag into the block.
5. Save and exit the editor, then check the live preview.

If you’re on an older Squarespace plan, custom code blocks may be limited to Business-tier plans and above — worth checking if you don’t see the Code block option.

Other platforms and custom-built sites

If your church site runs on something else — Webflow, Ghost, a custom-coded HTML site, or really any platform that lets you insert raw HTML — the process is essentially the same everywhere:

1. Find wherever your platform lets you insert custom HTML (often called an “HTML embed,” “code block,” or “custom code” element).
2. Paste the script tag in.
3. Save and publish.

If you built your site by hand or have direct access to your site’s HTML files, you can paste the snippet directly into the page’s HTML at the point where you want the widget to appear — no special container needed.

Troubleshooting tips

A few things to check if the embed isn’t showing up:

• Double check your embed ID. Each data-id is unique to a specific piece of content in your Planning Center account. If you copy the wrong one, the embed will either show nothing or the wrong content.
• Clear your cache. Some website builders and hosting setups cache pages aggressively. If you just added the embed and don’t see it, try a hard refresh or clear your site’s cache.
• Check for ad blockers. Occasionally, browser extensions that block third-party scripts can interfere with embeds during testing. Try viewing the page in an incognito window to rule this out.
• Make sure the code block is set to “HTML,” not “text” or “Markdown.” This trips people up most often on Squarespace and similar platforms, where formatting options can default to something other than raw HTML.

That’s it

One script tag, dropped into whichever platform you use, and your Planning Center content is live on your website — automatically staying in sync as you update it in PCO. No more manually copying event details or sermon links onto your site every week.

If you run into any trouble getting your embed set up, reach out and we’re happy to help.