Skip to main content
All CollectionsFor BusinessesManaging your Classes
Website Embed and iFrames (Dash 2.0)
Website Embed and iFrames (Dash 2.0)
Victoria C avatar
Written by Victoria C
Updated over 2 months ago

Embedding Recess onto your website is fast and easy and creates a fully integrated and seamless experience for your clients.

Covered in this Article

Step 1 - Setting up your iFrame

  1. To create your iFrame, go to the Growth Suite section on the left-hand menu bar and select iFrame

  2. Add your website URL

  3. Add your brand colors

Step 2 - Choosing Your Display Options

We always recommend building out the navigation bar on your website with dedicated pages for your schedule, pricing, etc.

  1. Select a page: In-person, Packages, etc.

    • Appointments:

      • Level: Choose Studio Level

      • Location: If you are a single location studio, we recommend choosing the 1 location

      • Appointment Category: We recommend leaving this empty

  2. Choose display options

    • Note: Tags is an option for you VOD collection and is recommended if you are organizing your library with tags

  3. Show Header

    • Only use this option if you do not have dedicated pages on your website for your schedule, pricing, etc.

  4. Tips on the embed code
    โ€‹

    • You can edit things directly in the code to improve how things display. Note, the text is case sensitive

    • List vs gallery: change the gallery view to list view by changing this part: displayClassIrl=list

    • Display Days

      • The iFrame will show all upcoming classes on any given day and days in the future

      • To limit how many future days are shown in the list, add this to the very end of the URL string before the last quotation mark

      • &displayDays=3

        • 3 is an example, you can put any number there

    • Filter the Schedule for an Instructor

      • Instructor: &displayInstructorIds=

        • You can find the IDs of the instructors in the URL on their profile page

    • Filter the Schedule for Specific classes/events

      • If want to create special iFrames for an events or workshop page, please reach out to support as they will need to give you some of the IDs you'd add to the code.

        • Events/Workshops: &displayFormatIds=

Step 3 - Embedding the iFrame onto your Website

  1. You can preview how it will look before embedding it

  2. Click the "Copy" button

  3. Follow the instructions for your web builder to paste the embed code onto your website

Note: If you change any of the option after you embed the code, you must re-embed the code again with the new options.

Video Tutorial

Did this answer your question?