Embeds & widgets

Render a service on any site with a public key.

Widgets are the in-browser counterpart to the server API. Drop a <script> tag with a pk_* public key and the service renders on your page - no backend code required.

<script src="https://app.softsolz.uk/softsolz.js"
  data-public-key="pk_live_your_key"
  data-service-id="forms"
  data-form-slug="contact"></script>

Domain allowlist

Each public key is locked to the origins you list when you create it. The widget only loads on an allowed origin - otherwise it is blocked. Add every domain (and port, for local dev) you embed on.

Each entry must be a scheme, host and optional port, such as https://shop.example.com. Wildcards and paths are refused, and a key must keep at least one origin.

What each widget needs

Every widget needs data-public-key and data-service-id. Some also need the record to show:

• Forms (forms): data-form-slug of a published form.
• Newsletter (newsletter): data-card-slug of a published signup card.
• Appointments (appointments): data-booking-slug of a booking link.
• Blogs (blogs): nothing extra. Add ?post=<slug> to the page address to open one post.
• Knowledge Hub (smart-chat): add data-mode="floating" for the corner bubble. The key must name the Knowledge Base collections the chat may answer from.
• Customer Auth (customer-auth): nothing extra. data-view picks a screen and data-redirect is the page to open after sign-in.
• Funnels (funnels): nothing extra. It renders nothing and records page views; call window.Softsolz.funnel.track('event_name') for events.
• Stripe Payments is not a script widget: a payment button is a plain link to the hosted checkout, see the Stripe Payments guide.

Placement and look

Widgets render inline where you place the script and grow to fit their content. Use data-mount="#element-id" to render into an element of your choice, and data-theme="dark" or "light" to match your page. Several widgets can sit on the same page.

Try it

Use the Widget Testerto paste a public key and load any service's real widget on an example page before you ship.