Skip to main content
Get a preview
All docs

Embed the Porchlight chat widget

Paste one script tag in the site footer. The widget loads asynchronously, does not block the page, and works on CMS sites like WordPress, Squarespace, Webflow, and custom HTML.

The snippet

<script src="https://porchlight.cymbalabs.com/widget.js" data-org="your-org-slug" async></script>

Replace your-org-slug with the slug of your Porchlight organization. You can find it in Settings -> Branding or in the URL of your dashboard.

Where to paste it

Put the snippet just before the closing </body> tag on every page where the chat bubble should appear. Most customers add it site-wide, then use page context and button copy to steer buyers into the right consult flow.

Configuration options

  • data-org is required.
  • data-position can be bottom-right or bottom-left.
  • data-attention-text controls the callout above the bubble, such as Book a backyard project consult.
  • data-attention-delay controls the callout delay in milliseconds.
<script
  src="https://porchlight.cymbalabs.com/widget.js"
  data-org="your-org-slug"
  data-position="bottom-right"
  data-attention-text="Book a qualified consult"
  data-attention-delay="6000"
  async
></script>

Programmatic control

The loader exposes window.PorchlightWidget:

  • window.PorchlightWidget.open() opens the chat panel.
  • window.PorchlightWidget.close() closes it.
  • window.PorchlightWidget.toggle() toggles it.
<button onclick="window.PorchlightWidget.open()">Book a consult</button>

Troubleshooting

If the bubble does not appear, check the browser console for a typo in data-org, an inactive org, or a Content Security Policy that blocks the Porchlight domain.

If the panel is blank, add frame-src https://porchlight.cymbalabs.com to the site's CSP.

Verifying it works

  1. Load a page with the snippet.
  2. Open the bubble.
  3. Send a test message.
  4. Confirm the conversation lands in the Porchlight Inbox.

Once a buyer chats, Porchlight qualifies the project, records the lead, and moves ready buyers toward a consult, showroom visit, design call, or site visit.