Skip to content
Iframe Integration

User Flow

What your customers experience: the card states, the checkout journey, and what happens after they buy.

The three card states

The iframe always renders in one of three states. Osteocom decides which one to show by checking the (clientId, partnerUserId, productId) tuple against the catalog and existing activations.

✅ AvailableCourse card with image, title, short description, price and a Buy button. The default state for a customer who hasn't purchased yet.
🔓 Already purchasedSame card content, but the CTA becomes Already purchased and links to the Osteocom login. After logging in, the customer finds the course in their personal area.
⚠️ Content unavailableNeutral placeholder. Typically means the iframe parameters are wrong (invalid clientId or productId) or that the course is not in your catalog. If you hit it during testing, contact Osteocom Support with the iframe URL.

Click "Buy" — what happens

When the customer clicks Buy:

Step 1
Leaves the iframe
The navigation leaves the iframe. The customer's main tab moves to the Osteocom checkout — a new tab does not open. This is intentional: card payment forms must never be rendered inside a third-party iframe for security reasons.
Step 2
Osteocom checkout
The customer lands on the Osteocom checkout, with the right course already in the cart.
Step 3
Completes payment
The customer completes the payment (credit card, PayPal, bank transfer — handled by Stripe on Osteocom's side).
Step 4
Access granted
On success, Osteocom shows the order confirmation. The customer is granted access to the course immediately.

The customer can return to your LMS whenever they want. There is nothing for them to do explicitly — the next time they visit the iframe page, they will see the Already purchased state.

After the purchase — where the customer finds the course

The purchased course lives in the customer's Osteocom personal area, under My Courses in the top navigation. After logging in to Osteocom, the customer clicks My Courses and the catalog opens with all the items they own — including everything they bought through any partner iframe.

My Courses entry in the Osteocom top navigation

  • No webhook required on your side. Purchase state is read live every time the iframe loads, using the partnerUserId you pass.
  • If you want a reporting view of which customers of yours bought what on Osteocom, ask us about read-only admin access — it can be arranged.

Login from "Already purchased"

Clicking the Already purchased CTA brings the customer to the Osteocom login page. They log in with the credentials they created during the purchase, then click My Courses in the top navigation to reach their course library.

Built with VitePress.