Skip to main content

Canvas User Integration Setup - Course Evaluations & Surveys

Updated

A Canvas Certified Integration Logo.

This article is specifically for the Watermark Course Evaluations & Surveys product. If you are setting up a developer key for other Watermark product (for example, Student Learning & Licensure or Planning & Self-Study), please refer to the Help Center document for that specific product.

The Course Evaluations & Surveys User integration with Instructure’s Canvas LMS has several features which allow you to customize the Course Evaluations & Surveys user experience within Canvas for students, teaching assistants, instructors and Administrators. The following provides setup steps and information on the User Integration functionality between Course Evaluations & Surveys and Canvas.

Note: If you have not yet completed setting up the Data Integration with Canvas, you will need to follow those instructions first.

Create a Developer Key in Canvas:

Overview

We have streamlined the setup process for Canvas LTI 1.3 integrations. Previously, administrators were required to manually create Developer Keys and copy-paste extensive JSON data between systems. With the new Dynamic Registration feature, this initial configuration is automated.

By simply entering a registration URL, Canvas and Course Evaluations & Surveys (CES) will now automatically exchange the necessary Client ID and security tokens. This significantly reduces setup time and minimizes the risk of copy-paste errors during implementation.

Note: While the Client ID exchange is now automated, administrators must still manually paste the Deployment ID into CES to finalize the connection.

Detailed instructions

  1. Initiate Dynamic Registration in Canvas
    • Navigate to Admin > Developer Keys.

    • Instead of the standard "+ LTI Key" button, click the + Developer Key dropdown and select + LTI Registration.

      The Developer Keys page showing a list of existing keys with name, owner email, details, stats, and type columns, while the +Developer Key button is open and displaying options for API Key, LTI Key, and LTI Registration in a dropdown

    • In the Dynamic Registration URL field, enter your specific CES domain URL using the following format: https://yourInstitution.evaluationkit.com/lti/dynamic-registration

      Note: Replace yourInstitution with your CES domain displayed in a working URL.

      The Register App modal showing a Dynamic Registration URL field filled with a link and Cancel and Continue buttons displayed at the bottom.

  2. Configure Permissions
    • Once the URL is entered, you will be prompted to configure settings.
    • Under "User data shared with this tool," select All user data.

    • Click Enable & Close to proceed.

      The Register App page showing Course Evaluations Settings with a permissions note, a dropdown for user data shared, and placement sections for Link Selection, Account Navigation, Course Navigation, and User Navigation, each showing title and icon URL fields, with Delete, Save, and Enable & Close buttons at the bottom.

  3. (Returned to list of Developer Keys) and you will see the Client ID

    The Developer Keys list showing an entry for a tool with the Client ID highlighted on the right and the activation toggle highlighted as set to On.

  4. Retrieve the Deployment ID
    1. Within Canvas, go into Admin and choose your account again. Click on Settings > Apps> View App Configurations
    2. Click on Click on “+App” button

    3. In Configuration Type: select “By Client ID”. Paste the Client ID from a previous step. And click on “Submit” button

      The Add App modal showing Configuration Type set to By Client ID, with an empty Client ID field below and Cancel and Submit buttons displayed at the bottom.

    4. For the above app, locate the "Course Evaluations" app you just created.

    5. Click the Gear Icon next to the app and select Deployment ID > Copy the “Deployment ID”

      The LTI tools list showing the Course Evaluations QA Parentu entry highlighted on the left, with the gear menu opened on the right and the Deployment Id option highlighted in the dropdown.

    6. Finalize Installation in CES
    7. Within Course Evaluations & Surveys go back to Account > Integrations (section) > Canvas > User Settings tab
    8. In the Installation section. If there an old settings, delete them and refresh the page.
  5. You will notice the Client ID field is already pre-filled (a result of the Dynamic Registration).
  6. Click on Placements and make sure that all four placements are enabled.
    Screenshot showing all four placements present under App Placements
  7. Paste the Deployment ID you copied from Canvas into the Deployment ID field.

  8. Click Save.

    The Canvas User Integration page showing steps for adding CSS and JavaScript and a section for entering the Canvas Developer Key and External App values, with the Client ID and Deployment ID fields filled and Save button displayed below.

For institutions that use their OWN custom CSS and JS files, follow the steps below to ADD the Course Evaluations & Surveys code to your existing CSS and Javascript files

  1. In Course Evaluations & Surveys, navigate to Account > Integrations (section) > Canvas > User Settings tab.
  2. Under the Installation section, Step 1, copy the CSS code and paste it into your CSS file that is uploaded to your Canvas theme.
    1. Ensure that the Course Evaluations & Surveys CSS Code comes before all other content and comments in your CSS file.
  3. Next, under the Installation section, Step 2, copy the Javascript Code and paste it into your JS file.

    1. Ensure that the Course Evaluations & Surveys Javascript Code comes before all other content and comments in your Javascript file.

      The Canvas User Integration page showing installation steps with a CSS Code box displayed under Step 1 and a JavaScript Code box displayed under Step 2, each containing code to copy into Canvas

  4. Confirm that the changes have been completed and saved within your CSS and JS files.
  5. Within Canvas, go to Admin and select your Canvas account.
  6. On the left-hand side of the page select Themes.

  7. Select Open in Theme Editor for your current theme under Themes.

    The Themes page showing several theme templates at the top and a My Themes section below, with the Documentation Theme tile outlined and displaying an Open in Theme Editor button and a Current Theme label.

  8. Make sure that the correct version of your global files have been updated within the Theme Editor.

    NOTE: Once you make the update, preview Your Changes. If everything appears correct, select Save theme, Apply theme, and OK in the confirmation dialog.
    Go to Settings -> Apps -> View App Configurations (Note: this can be added at the Canvas sub-account level too. In that case add CSS and JS files at the same sub-account level, just make sure root level theme is empty. )

  9. You can now configure your desired settings for the Automated LTI Links & Customized Survey Notification for Students under the User Integration Setup section. See the Canvas User Integration Settings for more information on these settings.

Adding JS and/or CSS Code to you Canvas Theme:

IMPORTANT NOTE: If your institution uses other code in your Canvas theme JS or CSS files, please work with your IT Team to ensure that you are only adding or replacing the Course Evaluations & Surveys code.

  1. In Course Evaluations & Surveys, navigate to Account > Integrations (section) > Canvas > User Settings tab.
  2. Create a new text document in a text editor application, i.e. Notepad or TextEdit.

  3. Next, under the Installation section on the User Settings tab, Step 1, copy the CSS Code in full and paste it into your CSS (Notepad or TextEdit) file.

    A CSS file editor is open showing a dark code window with a single @import line at the top containing a URL.

  4. Open another new text document in Notepad or TextEdit for instance, and this time under the Installation section on the User Settings tab, Step 2, paste the JS code into your (Notepad or TextEdit) file.

    A JavaScript file editor is open showing a dark code window containing an EvaluationKIT script block that loads an external JavaScript file using a dynamically created script tag.

    Complete the following to save the CSS and JavaScript files:

    1. In Notepad click on Save As and under Save as type select All Files, OR in TextEdit under the Format menu, select Make Plain Text.
    2. When saving your files, include the correct file extension (.css or .js) as seen in the examples above.
    3. Within Canvas, go to Admin and select your account.
    4. On the left-hand side of the page select Themes.

    5. Select Open in Theme Editor for your current theme under Themes.

      The Themes page showing multiple preset templates at the top and a My Themes section below, with the Documentation Theme tile outlined and displaying an Open in Theme Editor button and a Current Theme label.

  5. If you show a CSS file or a JavaScript file already in use, you can see what code is already uploaded by clicking the View File button. If you show code other than Course Evaluations & Surveys code in your Canvas theme JS or CSS files, please work with your IT Team to ensure that you are only adding or replacing the Course Evaluations & Surveys code.

  6. Click on Upload to select and upload your JS and CSS files respectively, as shown in the screenshots below.

    The Theme upload window showing the CSS file upload area with the Select button clicked, opening a file browser displaying two files, with an arrow pointing to the CE&S University.css file in the list.

    The Theme upload window showing the JavaScript file upload area with the Select button clicked, opening a file browser where the arrow is pointing to the CE&S University.js file in the list.

  7. After the files are uploaded, Preview Your Changes.

    NOTE: If you Preview Your Changes after uploading either the CSS or JS file, you will need to return to the Upload tab to upload the second file.

    The Theme preview panel showing the Canvas login page with a green Preview Your Changes button centered over the preview, while Save theme and Exit buttons appear at the bottom.

  8. After verifying your changes, click Save theme, then Apply theme.

  9. When presented with the confirmation dialog window, click OK to confirm the changes and apply the changes to the entire account in Canvas. This will initialize the User Integration for Course Evaluations & Surveys.

    A confirmation dialog is appearing over the theme editor asking if the theme should be applied to the entire account, showing Cancel and OK buttons.

  10. Within Canvas, go into Admin and choose your account again. Click on Settings > Apps
  11. Click on “+App” button

  12. In Configuration Type: select “By Client ID”. Paste the Client ID from a previous step. And click on “Submit” button

    The Add App modal showing Configuration Type set to By Client ID, with the By Client ID option circled and an empty Client ID field displayed above Cancel and Submit buttons.

  13. For the above App, click on settings dropdown -> Click on “Deployment Id” -> Copy the “Deployment Id”

    The LTI tools list showing the “Course Evaluations QA Parentu” entry circled on the left, with the gear menu on the right also circled and open to reveal the Deployment Id option circled in the dropdown.

  14. Within Course Evaluations & Surveys go back to Account > Integrations (section) > Canvas > User Settings tab
  15. In the Installation section. Delete old settings that may appear. Paste “ClientId” and “DeploymentId” that you copied earlier.
  16. Save the settings
  17. VERY IMPORTANT: If you are a LMS Admin, you may need to hand this step off to the CES Admin. Now that the User Integration has been set up, you should now configure your desired settings for the LTI Links & Customized Survey Notification for Students under the User Integration Setup section. See the Canvas User Integration Settings for more information on these settings.
Was this article helpful?
4 out of 7 found this helpful

Articles in this section

See more
How to Contact Support
There are many ways to reach out! Click the icon above for our support options.
Watermark Academy
Click the icon above to access the Watermark Academy for consultation, training, and implementation companion courses.
Customer Community
Can’t find the answer? Ask fellow users how they’re making the most of Watermark in our Community!