Version: current

Embedding Karmasoft Elements to Your Website

You will need to know your subdomain. This is the name you chose when you signup for the platform. You can locate your subdomain on the address bar of your browser or check the email we sent you when you signed up.

Staff Sign-in

Step 1

Copy and paste the relevant code snippets below into your HTML page.

To Embed Your 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>

To Embed Your 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>

To Embed Your 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>

To Embed 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>

To Embed Your 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>

To Embed a 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>

To Embed 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>
</div>

Step 2

Make studio-specific changes to the above code.

  • Change every occurrence of the word demo to your subdomain.
  • Set your data-options parameters. [See Parameter options below]

Data-Options Parameters

  • today_only=true For this to work you must specify a by_branch flag.

    Example: data-options='by_branch=7&today_only=true'

  • clean=true This will load a cleaner, simpler embedded element (recommended).

  • hide_instructor_full_name=true Will hide the instructor's full name and only display the first name

  • hide_instructor_name=true Will hide the name of the instructor. No name will be listed on the public embedded schedule

  • hide_branch=true Will remove drop down that allows user to filter the schedule by branch/Location

  • hide_instructor=true Will remove the drop-down that allows user to filter the schedule by instructor

  • hide_lesson=true Will remove the drop-down that allows user to filter the schedule by lesson/class

  • hide_type=true Will remove the drop-down that allows the user to filter the schedule by class type

  • only_classes=true Will only display classes, workshops will be removed

  • only_online=true Will only display only your livestream classes.

  • only_online=false Will only display only your in-studio classes.

  • only_workshops=true Will only display workshops, classes will be removed

  • by_lesson_category = lesson_category_id Where lesson_category_id = the numeric value representing the lesson category  as_list=true Will display the schedule as a list.*

  • by_workshop=workshop_id

for multiple branches you will need also to include the by_branch parameter

Example: by_workshop=workshop_id&by_branch=xxxxxx

Store-Specific Options

Embed by Product Category

  • by_category = product_category_id you can select multiple categories, separating each with a comma

    Example: by_category=1,3,5

JSON

Use JSON endpoints for more control.

JSON data structures

Example Site and Code

HTML Implementation Examples

http://karmasoft2-embed.s3-website-us-east-1.amazonaws.com

JSON Implementation Examples

http://karmasoft2-embed.s3-website-us-east-1.amazonaws.com/json.html

GitHub Code

https://github.com/karmasoft/karmasoft-embed

Copyright © 2024 Karmasoft, Inc.