PlayWithASL Help Center

Find documentation for LMS integration, LTI setup, and troubleshooting.

Canvas LMS Guide

Last Updated: Jan 22, 2026
{% extends "base.html" %} {% block content %}

Canvas LTI 1.3 Setup Guide

Follow these steps to configure your PlayWithASL LTI tool in Canvas:

Step 1: Register the Developer Key

Contact your Canvas administrator and ask them to create a Developer Key with these settings:

Key Settings:
  • Name: PlayWithASL
  • Owner Email: your-email@example.com
  • Redirect URIs: {{ redirect_url }}
  • Tool Configuration: Paste this JSON:
    {
      "title": "PlayWithASL",
      "description": "Interactive ASL learning tool",
      "target_link_uri": "https://lti.playwithasl.com/lti/launch",
      "oidc_initiation_url": "https://lti.playwithasl.com/lti/login",
      "oidc_initiation_urls": {},
      "public_jwk_url": "https://lti.playwithasl.com/lti/keys",
      "public_jwk": null,
      "custom_fields": {
        "user_id": "$Canvas.user.id"
      },
      "scopes": [
        "https://purl.imsglobal.org/spec/lti-ags/scope/lineitem",
        "https://purl.imsglobal.org/spec/lti-ags/scope/result.readonly",
        "https://purl.imsglobal.org/spec/lti-ags/scope/score",
        "https://purl.imsglobal.org/spec/lti-nrps/scope/contextmembership.readonly",
        "https://purl.imsglobal.org/spec/lti-ags/scope/lineitem.readonly",
        "https://canvas.instructure.com/lti/public_jwk/scope/update",
        "https://canvas.instructure.com/lti/account_lookup/scope/show",
        "https://canvas.instructure.com/lti-ags/progress/scope/show"
      ],
      "extensions": [
        {
          "domain": "lti.playwithasl.com",
          "tool_id": "PlayWithASL",
          "privacy_level": "public",
          "platform": "canvas.instructure.com",
          "settings": {
            "text": "PlayWithASL",
            "icon_url": "https://lti.playwithasl.com/static/logo.png",
            "platform": "canvas.instructure.com",
            "placements": [
              {
                "text": "PlayWithASL",
                "enabled": true,
                "icon_url": "https://lti.playwithasl.com/static/logo.png",
                "placement": "course_navigation",
                "message_type": "LtiResourceLinkRequest",
                "target_link_uri": "https://lti.playwithasl.com/lti/launch",
                "visibility": "admins",
                "windowTarget": "_blank",
                "canvas_icon_class": "icon-lti"
              },
              {
                "text": "PlayWithASL",
                "enabled": true,
                "icon_url": "https://lti.playwithasl.com/static/logo.png",
                "placement": "assignment_selection",
                "message_type": "LtiDeepLinkingRequest",
                "selection_width": 1024,
                "target_link_uri": "https://lti.playwithasl.com/lti/launch",
                "selection_height": 768,
                "windowTarget": "_blank",
                "canvas_icon_class": "icon-lti"
              },
              {
                "text": "PlayWithASL",
                "enabled": true,
                "icon_url": "https://lti.playwithasl.com/static/logo.png",
                "placement": "editor_button",
                "message_type": "LtiDeepLinkingRequest",
                "selection_width": 1024,
                "target_link_uri": "https://lti.playwithasl.com/lti/launch",
                "selection_height": 768,
                "canvas_icon_class": "icon-lti"
              }
            ]
          }
        }
      ]
    }
Important: Canvas Iframe Issues

Canvas may try to load LTI tools within an iframe, which can cause issues with Canvas SSO. To prevent this:

  • Make sure windowTarget: "_blank" is included in each placement as shown in the JSON above
  • When testing, if you see "sso.canvaslms.com refused to connect" errors, it means Canvas is trying to load the tool in an iframe
  • Our tool includes automatic iframe detection and will try to break out of iframes, but proper configuration is still important
Updated Configuration

This configuration is based on the H5P LTI tool, which is known to work reliably with Canvas. Key points:

  • Includes editor_button placement for rich content editor integration
  • Specifies correct scopes for assignment integration
  • Sets Canvas-specific settings like canvas_icon_class
  • Uses selection_width and selection_height for proper sizing

Note: If you're upgrading from a previous configuration, you'll need to delete and re-add the LTI tool in Canvas.

Step 2: Install the App in Your Course

  1. Go to your Canvas course
  2. Click Settings in the course navigation
  3. Click the Apps tab
  4. Click + App
  5. Select By Client ID
  6. Enter the Client ID: {{ client_id }}
  7. Click Submit

Note: If you have administrator access, you can also install the tool at the account level rather than individual courses.

Step 3: Add to Your Course

You can now add PlayWithASL to your course in two ways:

Navigation Menu:
  1. Go to your course Settings
  2. Click the Navigation tab
  3. Find "PlayWithASL" in the hidden items list
  4. Drag it to the active items area
  5. Click Save
As an Assignment:
  1. Go to Assignments
  2. Create a new assignment
  3. Set Submission Type to "External Tool"
  4. Click "Find" and select "PlayWithASL"
  5. Configure the activity parameters
  6. Make sure "Load This Tool In A New Tab" is checked
  7. Save the assignment

Troubleshooting Common Issues

This error occurs when Canvas tries to load the tool in an iframe, but Canvas SSO blocks iframe loading for security reasons.

Solutions:

  • Ensure windowTarget: "_blank" is set in the JSON configuration
  • In assignments, check "Load This Tool In A New Tab"
  • Try launching the tool directly from the course navigation instead of an assignment

These errors relate to LTI authentication configuration issues.

Solutions:

  • Verify all URLs in the JSON configuration end with trailing slashes
  • Make sure the correct platform is configured in the system (both canvas.instructure.com and your custom Canvas domain)
  • Check that the Client ID matches the one provided by Canvas
  • Ensure the Developer Key is active in Canvas
{% endblock %} {% block scripts %} {% endblock %}
LTI 1.3 Configuration JSON