Home Setup & Configuration Embedding Karmasoft Elements on Your Website

Embedding Karmasoft Elements on Your Website

Last updated on Oct 29, 2025

Embedding Karmasoft Elements on Your Website

Whether you want to display your schedule, workshops, staff profiles, video library, store, lead form, or daily offers, embedding Karmasoft elements is quick and easy. Just add the right iframe code to your site and customize with data options.

Step 1: Choose and Add Your Code Snippet

Copy and paste the relevant snippet into your HTML page. Replace demo.karmasoft.io with your own subdomain—you’ll find it in your browser’s address bar or your Karmasoft sign‑up email.

Element Code Snippet
Schedule <div id="container1" class="ksiframe-container" data-module="schedule" data-options="hide_branch=true" data-target="https://demo.karmasoft.io"></div><script src="https://demo.karmasoft.io/assets/iframeapi.js"></script>
Video Library <div id="container1" class="ksiframe-container" data-module="member/video_library" data-options="hide_branch=true" data-target="https://demo.karmasoft.io"></div><script src="https://demo.karmasoft.io/assets/iframeapi.js"></script>
Workshops <div id="container1" class="ksiframe-container" data-module="member/workshops" data-options="hide_branch=true" data-target="https://demo.karmasoft.io"></div><script src="https://demo.karmasoft.io/assets/iframeapi.js"></script>
Instructors <div id="container1" class="ksiframe-container" data-module="users/profiles" data-options="hide_branch=true" data-target="https://demo.karmasoft.io"></div><script src="https://demo.karmasoft.io/assets/iframeapi.js"></script>
Store <div id="container1" class="ksiframe-container" data-module="member/store" data-options="hide_branch=true" data-target="https://demo.karmasoft.io"></div><script src="https://demo.karmasoft.io/assets/iframeapi.js"></script>
Lead Capture Form <div class="ksiframe-container" data-module="student_lead/new" embedded="true" data-target="https://demo.karmasoft.io" id="container1"></div><script src="http://demo.karmasoft.io/assets/iframeapi.js"></script>
Daily Offers <div class="ksiframe-container" data-module="schedule/offers" data-target="https://demo.karmasoft.io" id="container1" style="position: fixed; right: 10px; bottom: 15px; width: 450px"><script src="https://demo.karmasoft.io/assets/offers.js"></script>

Step 2: Customize for Your Studio

After embedding, make it your own:

  • Replace demo with your subdomain throughout the snippet.

  • Use data‑options parameters to refine display and functionality.

Available Options:

  • today_only=true — shows only today’s content; requires by_branch.

  • clean=true — minimal, streamlined display.

  • hide_instructor_full_name=true — only first names show.

  • hide_instructor_name=true — hides instructor names entirely.

  • hide_branch=true — removes branch filter dropdown.

  • hide_instructor=true, hide_lesson=true, hide_type=true — hide other filters.

  • only_classes=true, only_workshops=true, only_online=true/false — filter content type.

  • by_lesson_category=ID, by_workshop=ID, by_branch=ID, as_list=true — advanced filtering and list display.

  • by_category=ID,ID… — for store embeds by product categories.

Optional: Use JSON APIs for Greater Control

Prefer to fetch data instead of embedding iframes? You can use these JSON endpoints:

  • Instructors: https://{subdomain}/users/profiles.json

  • Schedule: https://{subdomain}/schedule.json

  • Workshops: https://{subdomain}/member/workshops.json

  • Store: https://{subdomain}/member/store.json

You can also add available within your JSON fetch:
ex: https://ytb.karmasoft.io/schedule.json?today_only=true

See Samples & Code Repositories

Explore full working examples: