For hosts

Embed widget

Drop a one-line snippet on your own site and accept bookings directly. Same booking flow, same insurance, same payouts — your URL, your fee discount.

3% platform fee

Widget-driven bookings pay 3% instead of the 10% marketplace tier. Your site, your traffic, your fee discount.

Your URL, your trust

Renters never leave your site to start the booking. The widget runs in an iframe; the booking confirmation lands on a chrome-free success page that can redirect them back to your own thank-you URL.

Same checkout, same insurance

Stripe Checkout handles payment in the top window (Stripe doesn't support being framed). Thimble insurance, the License agreement, and dispute paths are identical to a marketplace booking.

Same payouts

Funds flow through your existing Stripe Connect account on the same schedule as marketplace bookings.

How it works

1.
You drop the snippet on your site
One-line script tag plus a container div. Configure a listing ID, primary color, default attendee count, and an optional success-redirect URL.
2.
Renter clicks book
An iframe loads our chrome-free booking flow scoped to your listing. Same date/time picker and insurance choices as the marketplace.
3.
Payment in a top window
Stripe Checkout opens in the top window (or in a Stripe-hosted page) to collect the card. We're not allowed to frame Stripe by their terms.
4.
Renter lands back on your site
After payment, the iframe shows a chrome-free confirmation. If you provided a redirect URL, we send the renter there with the booking ID.

The snippet

Generate yours

Paste this anywhere you can include HTML. Replace YOUR_LISTING_ID with the ID from your dashboard. The Widget tab in the host dashboard renders a live preview alongside the snippet so you can confirm the look before deploying.

<div id="nichespace-widget"></div>
<script src="https://cdn.nicheshift.com/widget/v1/nichespace.js"></script>
<script>
  NicheShift.init({
    listingId: 'YOUR_LISTING_ID',
    container: '#nichespace-widget',
    primaryColor: '#2f7a6a',
    defaultAttendeeCount: 1,
    successRedirectUrl: 'https://yoursite.com/thanks',
    onBookingComplete: function(payload) {
      console.log('NicheShift booking complete', payload);
    }
  });
</script>

Need an exact copy? The host dashboard's Widget tab has a one-click Copy button.

Configuration

Every option you can pass to NicheShift.init.

listingId

string (required)

The listing ID to render. Find it in your host dashboard under the Widget tab.

container

string (required)

CSS selector for the element the iframe mounts into. The widget grows its height automatically; just give it a width.

primaryColor

hex string

CSS color for primary buttons and accents. Match your site's brand color so the widget feels native.

defaultAttendeeCount

number

Pre-fill the attendee count input. Useful if your site already collected party size before the renter clicked book.

successRedirectUrl

string

URL to send the renter to after a confirmed booking. If omitted, the iframe shows a built-in confirmation card with a 'Back to host site' link.

onBookingComplete

function

Callback fired when a booking confirms. Receives the booking ID, total, and listing ID. Use it for analytics or to trigger a custom UI update on the parent page.

Make it look like yours

Pass primaryColor as a hex to tint primary buttons, focus rings, and progress indicators. The widget's built-in palette adapts around it.
The widget inherits the parent page's system fonts for labels and buttons; you don't have to ship custom CSS.
The container element on your page can be any width. Recommended minimum is 320px so the date / time picker still breathes on mobile.
Width is yours to set; height auto-grows. Don't set a fixed height on the iframe — the widget resizes itself via postMessage handshake with the parent.

Performance footprint

The widget loader is < 5 KB gzipped.
The iframe loads lazily; it doesn't block your page's first paint.
Served from our CDN with long-cache headers (immutable per version).
No third-party trackers injected on the parent page.

Analytics

The widget emits three analytics events to NicheShift: view, booking_started, and booking_completed. You can also wire your own analytics via the onBookingComplete callback — it receives the booking ID, total, and listing ID so you can push a conversion event into GA, Plausible, or anything else you already use.

Troubleshooting

Renter clicks book but nothing happens.

Open the browser console on your site. If you see 'NicheShift.init: container not found,' the selector you passed didn't match an element. Make sure the container div is in the DOM before the script runs (or load the script with `defer`).

The widget is the wrong width.

The widget fills 100% of its container. Set the container width on your end (a fixed `max-width`, a CSS grid column, etc.). Don't set a height — the widget reports its content height and grows automatically.

Stripe Checkout opens in a new tab — is that expected?

Yes. Stripe's terms disallow framing their checkout. We open it in the top window for the renter and route back to the widget afterward. Your iframe stays alive in the background.

Does this work on Webflow / Squarespace / Wix?

Yes, anywhere you can paste an HTML embed. On Squarespace use the 'Code Block.' On Webflow use a 'Custom Code' embed. On Wix add a 'Custom Element' or HTML iframe block.

The widget shows 'Listing not available.'

Either the listing ID is wrong or the listing isn't in the "published" state. Check the listing's status in your host dashboard — drafts and paused listings 404 the widget on purpose.

Ready to embed?

Grab your snippet from the Widget tab in the host dashboard. Live preview included so you can confirm the look before you ship.

Open widget generator